ol や ul タグで 括弧付き数字 を使った 箇条書き :Tips & FAQ | arbk-works Blog
html<ol class="paren"> <li>あか</li> <li>あお</li> <li>きいろ <ol class="paren"> <li>たんぽぽ</li> <li>ひまわり</li> </ol> </li> </ol> css.paren{ counter-reset:item; list-style:none; } .paren li:before{ content:"(" counters(item, "-") ")"; counter-increment:item; margin-right:0.5em; } .paren li{ padding-left:1.5em; text-indent:-1.5em; } バリエーションcss "li:before" の content 部分を変えれば, 括弧と区切り文字を自由に設定できます. content:"(" co
[CSS]パラグラフやリストなどのテキストの下にできてしまう意図しない余白を解決する方法
p, ul, ol, dl などのテキストの下にできてしまう意図しない余白を解決するうまい方法をCSS-Tricksから紹介します。 下記は各ポイントを意訳したものです。 Spacing The Bottom of Modules 上記のコードはシンプルで、divをラッパーとして、見出しとパラグラフを配置しているだけです。 HTML <div class="module"> <h3>Module</h3> <p>Pellentesque habitant morbi tristique senectus...</p> </div> スタイルシートもシンプルです。 CSS html { background: #333; } .module { width: 20rem; padding: 1.5rem; margin: 1.5rem auto; background: white; } h
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
