::before,::after擬似要素を使って、よくあるパターンをつくってみよう。
2015年12月07日 ::before,::after擬似要素を使って、 よくあるパターンをつくってみよう。 コーダーのあーだこーだ こんにちは。 コーディングファクトリー部 コーダーの丸山です。 このコーナーでは、コーディングファクトリーの仕事のスタイルや、深堀りしたコーディング技術をメインにお伝えしていきたいと思っています。また、コーダーが各々のコーディング論を語る座談会なども企画してますのでお楽しみに！ 今回は私がこの要素を知ってから（コーディングの）世界観が変わった！というCSSの要素の一つである『::before,::after擬似要素』の特徴とコーディング例をご紹介します。 ::before,::after擬似要素とは 擬似要素（pseudo elements）は、W3Cによると"文書言語(HTML)に記された以上の抽象概念や情報を与えるもの"とされています。::before
:before content image のサイズを指定する - CSS note
:beforeなどの擬似要素を使った画像の場合、widthやheightを指定することができませんが、工夫をすると、サイズのコントロールが可能になります。 コンテンツの背景として画像を設定する .entry-title:before{ margin:0 10px 0 0; content:" "; display:inline-block; width:80px; height:60px; background:url( http://www.tenman.info/images/DSCF0024.jpg); background-size:contain; vertical-align:middle; } 新着記事 ©2024 cssTheme URI: http://www.tenman.info/wp3/bootsDescription: Raindrops theme of chi
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
