■ ヒントだよ！HTML & CSS ■

    topへ     前のページに戻る     ページ閉じる

■ contentの例
.new::before {
content: "NEW!";
font-weight: bold; color: red;
}
・その日暮らし<br>
・世紀の大発見<br>
・<span class="new">そして全員揃った</span>
 
・その日暮らし
・世紀の大発見
・そして全員揃った

■ content,Counter-increment,counter-reset - リストマーカーの例
※htmlファイルとcssファイルの文字コードが一致しないと全角文字 位 が文字化けします。
※p {counter-reset: number;}がないとリスト全部が 1位 になります。
 
p {counter-reset: number;}
ol {list-style-type: none;}
li::before {
counter-increment: number;
content: counter(number)" 位：";
}
<p>××ゲーム大会の結果
<ol>
<li>報酬タイタンズ</li>
<li>隣国カンバロズ</li>
<li>遠地ネピングス</li>
</ol>
</p>

××ゲーム大会の結果

1. 報酬タイタンズ
2. 隣国カンバロズ
3. 遠地ネピングス

■ quotes の例
q { quotes: "「" "」"; }
q::before {content: open-quote;}
q::after {content: close-quote;}
故きを温ね新しきを<q>しるなどで</q>、ははぴぴでががすとにて、ははは。
 
故きを温ね新しきをしるなどで、ははぴぴでががすとにて、ははは。

    topへ     前のページに戻る     ページ閉じる