CSS :nth-of-typeで指定した行にCSSを適用する方法
環境
Windows 10 Home 64bit
Google Chrome 110.0.5481.105(Official Build)
構文
セレクタ:nth-child (数値){
}
同じ親要素を持つ子要素の指定した数値の行に適用します。
「:nth-of-type」を利用して指定した行にCSSを適用します。
使用例
<!DOCTYPE html> <html> <head> <style> p:nth-of-type(2) { color: blue; } </style> </head> <body> <h2>タイトルの見出し</h2> <p>東京</p> <p>大阪</p> <p>福岡</p> </body> </html>
結果
指定した行「大阪」の文字色が青に変わります。