:before & :afterの使い方の意味わかってる?

8月の終わりがそろそろ近づいてきてますね…

しかも、猛暑日が続きますね…

体調には気を付けて、水分補給もまめに取ってくださいね。

ついでに、塩分補給も忘れないようにね!

さてと、話題に戻して…

:before & :afterの使い方の意味わかってる?

他業者がデザインしたCSSの中身を見ると全く理解のできてないデザインが組み込まれてますね…

同じ技術者としてはホンマに恥ずかしいんですわ…

擬似要素タグ「:before」と「:after

擬似要素…対象の要素の一部を指定して装飾を適用する、もしくは対象の要素に擬似的に要素を追加して装飾を適用するセレクタのことです。

beforeとafterの基本的な設定方法

beforeは指定した要素内にあるコンテンツの直前に、afterは指定した要素内にあるコンテンツの直後に配置されます。

重なりの順について、「z-index」を指定していない場合は「:after」が一番上にもっていきます。

使い方や記述方法についてはまた後日にご説明しますね。

ではまた!

コメントする

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

Leonard-Blogをもっと見る

今すぐ購読し、続きを読んで、すべてのアーカイブにアクセスしましょう。

続きを読む