CSS セレクターの復讐

お盆中、コロナだったので遠出はせず近場へ小旅行を2回も楽しんじゃいました。

良い夏でした。

去年はアトピーも激悪で生きた心地がしなかったな、、、

ま、そんなこんなでお盆は全く手を付けなかったが、また少しずつ始めていきます。

ほんでなかなか手を付けてこなかった簡単なHPも作っていこうと思っています。

ほい

今日はCSSセレクターの復讐(復習)から。。。

・要素型セレクター

・classセレクター

・idセレクター　#→シャープって言わずにパウンド記号って言ってた。。。

　　　　　　　　エンジニア界隈ではそうなんすかね？

・属性セレクター　hrefとかを[href]で指定できるのか！！？？まだあんまわかってない。

・全称セレクター　*　すべての要素　(”全体”じゃあかんのか)

class属性は　半角空白で区切ると複数つけることができる。

sample　html：<h1　class=”info title">こんにちは</h1>

sample　css：　.info { *** : ** ; }

                           .title { *** : ** ; }

ほえぇ

id属性は、、、

sample　html：<h1　id=”info title">こんにちは</h1>

sample　css：　#info { *** : ** ; }

大体同じなのね。

がしかし、html内で同じ値(id名)は使用できない。

そして、空白を含めてはいけないので、class属性のように複数指定する区ともできない。

id属性よりもclass属性のほうが柔軟なのか。

属性セレクター[]が何だかんだ今までで、初めましてです。

存在の有無　[attr]　

完全一致　[attr="value"]

前方一致　[attr^="value"]     ^初めて使ったwwww

後方一致　[attr$="value"]

部分一致　[attr*="value"]

つかうことあるかね？

セレクターの組み合わせはなかなかおぼえれやん。。。

https://webliker.info/css-selector-cheat-sheet/

あ、こんなのTwitterででまわってたな

わからなかったらこれみようｗ

疑似要素　要素の特定の部分をスタイリングするためのもの。。。？

うん、全くわからんｗ

というか使いどころがまだわからない。

でもつづけます。

:hover はめちゃよく使う奴だ。

覚えれないけど使えるようにしよう。

眠いおやすみ。