構造化されたテキストをCSSで表現。
コード(HTML)
<html> <head> <style type="text/css"> div.a { border-bottom: 1px solid black; padding: 0 1em 0 0; margin: 0; float:left; } div.b { border: solid black; border-width: 0 0 1px 1px; padding: 1em; margin: 0 0 1em 0; float:left; } </style> </head> <body> <div> <div class="a"> lv1-abstract </div> <div class="b"> lv1<br /> <div> <div class="a"> lv2-abstract<br /> </div> <div class="b"> lv2<br /> lv2<br /> <div> <div class="a"> lv3-abstract<br /> lv3-abstract<br /> </div> <div class="b"> lv3<br /> lv3<br /> </div> </div> lv2<br /> </div> </div> lv1<br /> lv1<br /> lv1<br /> </div> </div> </body> </html>
手書き線でも表現できるシンプルな修飾。
これをWikiのゆるい記法で使いたい。
順序なしリストで実現したほうがいいかな?