css选择器的集体和嵌套申明实例详解
css选择器的申明:可以单独申明,也可以进行集体申明。同样的样式如果单独申明,就会产生很多重复的代码,所以具有共同属性的最好进行集体申明。而且方便控制,达到一改全改的效果。嵌套式声明就是一个标记里嵌套另一个标记。
集体声明实例:<html><head><title>css选择器的申明-集体声明</title><style type=”text/css”><!–h1, h2, h3, h4, h5, p{ color:purple; font-size:15px; }h2.special, .special, #one{ text-decoration:underline; }–></style></head><body><h1>集体声明h1</h1><h2 class=”special”>集体声明h2</h2><h3>集体声明h3</h3><h4>集体声明h4</h4><h5>集体声明h5</h5><p>集体声明p1</p><p class=”special”>集体声明p2</p><p id=”one”>集体声明p3</p></body></html> 解释:以上代码第一个集体声明表示:对于整个页面 h1,h2,h3,h4,h5,p这些标签中的内容都会引用这这个样式。第二个集体声明表示: h2标记中的special类别选择器,类别选择器.special以及ID选择器#one都会采用这个样式。
嵌套声明实例: <style type=”text/css”> <!– p b{ /* 嵌套声明,p标记中的b标记 */ color:maroon; /* 颜色 */ text-decoration:underline; /* 下划线 */ } –> </style> 以上嵌套声明代码表示p标记中的b标记的内容会采用此样式。 举例如下: <p>IT部落窝<b>网址</b>是:www.222.com</p> 此行中“网址”会采用样式,因为它是位于p标记中的b标记。 IT部落窝<b>网址</b>是:www.222.com 此行b标记中的“网址”并不会采用样式。
