属性选择器 P| utonIy四 Useful for many applicatons, plutonium can also be dangerous Safety Information When handlin plutonium, care must be taken to avoid the forma mplosion is very real, and must be avoid at all cost. This can b separate Comments It's best to avoid using plutonium at all if it can be avoided
属性选择器 <html> <head> <title>Plutonium</title> <style type="text/css"><!-- … --></style> </head> <body> <h1 lang="en" title="urgent warning">Plutonium</h1> <p>Useful for many...</p> <h2>Safety Information</h2> <p> <span>When handling plutonium...</span> <span>With plutonium... </span> </P> <h3>Comments</h3> <p>It's best to avoid ...</p> </body> </html>
属性选择器 h1 [lang] icolor: blue, 1 h1 [title="urgent warning"][color: blue, 1 h1 [langi [title](color: blue 1
属性选择器 h1 [lang] {color: blue;} h1 [title="urgent warning"] {color: blue;} h1 [lang] [title] {color: blue;}
子串匹配属性选择器 类型 描述 实例 atr=vaea属性值包括vaue的所 有元素 h1 [title-=warning l attra="value"at属性值以vaue开头的 所有元素 img [src ="images"] attr $=value"/a属性值以vae结尾的 所有元素 img [srcS=".jpg l at’ value" at(属性中包含vaue"子 串的所有元素 a [href*="fudan. edu. cn"] ttr="value"attr属性值等于vae以 "vaue"开头的所有元素 img [src="picture
子串匹配属性选择器 img [src|="picture"] a [href*="fudan.edu.cn"] img [src$=".jpg"] img [src^="\images"] h1 [title~="warning"] 实例 attr属性值中包含"value" 子 串的所有元素 [attr*="value"] attr属性值等于"value"或以 "value"开头的所有元素 [attr|="value"] attr属性值以"value"结尾的 所有元素 [attr$="value"] attr属性值以"value"开头的 所有元素 [attr^="value"] attr属性值包括"value"的所 有元素 [attr~="value"] 类型 描述
文档的树型结构 <html> html <head> <title> Plutonium/title> <style type="text/css"><- head bod </styl </head> <body> title style h1 p h2 ol <h1>Plutonium</h1> span>When.</span> spanspan li li i <spanWith. </span> Plutonium <h2>Safety Information</h2> When handlin plutonium, care must be taken to avoi implosion is very real, and must be avoid at all cost. <></i><li></><l></i> Safety Information </body> 1. Security 2. Safety </html> 3. Mothed
文档的树型结构 <html> <head> <title>Plutonium</title> <style type="text/css"><!-- … --></style> </head> <body> <h1>Plutonium</h1> <p> <span>When...</span> <span>With... </span> </P> <h2>Safety Information</h2> <ol> <li></li><li></li><li></li> </ol> </body> </html> html head body title style h1 p h2 ol span span li li li
后代选择器 p span( color: green; 1
后代选择器 p span {color: green;}