1.CSS派生选择器
概念:通过依据元素在其位置的上下文关系来定义样式。
实例:
<!--index.html--> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link href="mycss.css" type="text/css" rel="stylesheet"> </head> <body> <p><strong>p-label :hello css</strong></p> <ul> <li><strong>li-label :hello cess</strong></li> </ul> </body> </html>
/*mycss.css*/ li strong{ color: brown; } strong{ color: blue; }
运行结果:
2、id选择器
概念:
id选择器可以为标有id的HTML元素制定特定的样式
id选择器以“#”来定义
注:id选择器和派生选择器可以结合使用
实例:
<!--index02.html--> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link href="mycss02.css" type="text/css" rel="stylesheet"> </head> <body> <p id="pid">hello css <a href="http://www.baidu.com">baidu</a></p> <div id="divid"> this is a div style </div> </body> </html>
/*mycss02.css*/ #pid{ color: blue; } #pid a{ color: blueviolet; } #divid{ color: brown; }
运行结果: