CSS3.0
E:not(s) : 単体セレクタ s にマッチしない E 要素 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=SJIS" /> <title> :child </title> <style type="text/css"> li:not(#ajax) { color: #999; font-weight: bold; } </style> </head> <body> <ul> <li id="java">Java</li> <li id="javaee">J…</li></ul></body></html>
E:link／E:visited : 未訪問 (:link) であるもの、訪問済 (:visited) E:active : ユーザーによって実行されたE要素 E:hover : ユーザーがポインティングデバイスで示したE要素 E:focus : ユーザーによって実行されたE要素 E:enabled ／ E:disabled UI 要素で…
E:first-of-type : 同じ型をもつ要素のうち最初の E 要素。E:nth-of-type(1) と等価 E:last-of-type : 同じ型をもつ要素のうち最後の E 要素。E:nth-last-of-type(1) と等価 E:nth-of-type(an+b) : 同じ型をもつ要素のうち n 番目にある E 要素 E:only-of-ty…
E:first-child : 最初の子である E 要素。E:nth-child(1) と等価 E:last-child : 最後の子である E 要素。E:nth-last-child(1) と等価 E:nth-child(an+b) : n 番目の子であるE要素。最初の子要素のインデックスは1。 E:nth-last-child(an+b) : 後ろから数え…
・E::first-letter : E 要素の先頭文字 ・E::first-line : E 要素の最初の整形済行 ・E::before : E 要素の内容の前にある生成コンテンツ。なお、生成コンテンツはインライン要素になる。 ・E::after : E 要素の内容の後にある生成コンテンツ。なお、生成コ…
・E F : 子孫結合子。E 要素の子孫であるすべての F 要素。 ・E > F : 子結合子。E 要素の子であるすべての F 要素。 ・E + F : 隣接兄弟結合子。E 要素の直後に現れる F 要素 ・E ~ F : 一般兄弟結合子。E 要素のあとに現れる F 要素 ・E F : 子孫結合子 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=SJIS" /></meta></head></html>…
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=SJIS" /> <title>IDとclassセレクタ</title> <style type="text/css"> #yy { background-color:#82FF63; } p#xx { border:2px dotted black; background-color:#888; height:40px; } .myclass { background-color:#7FD5F8; } p.mycl…</meta></head></html>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=EUC" /> <title> 属性セレクタ </title> <style type="text/css"> div { width:550px; height:25px; background-color:#eee; border:1px solid black; padding:10px; } div[id] { background-color:#999; } div[class=class1] { back…</meta></head></html>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=SJIS" /> <title> 要素セレクタ </title> <style type="text/css"> /* div要素 */ div{ background-color: grey; font: 100% serif; } /* p要素 */ p{ background-color: #444; color:#fff; font: 200% serif; } </style> </head> <body>…</body></html>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=EUC" /> <title> CSS </title> <link href="outer1.css" rel="stylesheet" type="text/css" /> <style type="text/css"> @import "outer2.css"; </style> </link></meta></head></html>
