Quantcast
Channel: CSSタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 8920

CSS~擬似要素と擬似クラス~

$
0
0

今回はCSSで使用する、疑似要素について学習していきます。

疑似要素とは

指定している要素の特定の部分にスタイル付けすることができます。

index.html
<h1><span></span>いうえお</h1>
style.css
h1{color:red;}span{color:blue;}

疑似クラス

HTMLをいじることなく要素を作ることができます!

index.html
<h1>あいうえお</h1>
style.css
h1::before{content:'いぇあ!いぇあ!';}

あいうえおの直前にいぇあ!が出ます。
疑似クラスには他にも、active,hover,checkedなどがあります。

疑似クラスを使うメリット

①HTMLの文章構造を変えることなく見かけ上の要素を追加することができる
②あとから追加することができる。
③コピペされたくないとき(?)
となります。

具体的な使い方は次の記事で触れていきたいと思います!!


Viewing all articles
Browse latest Browse all 8920

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>