日期:2014-05-17  浏览次数:20676 次

在CSS中遇到的一个小问题

?

?? 在看《jQuery基础教程》时,遇到一个CSS,其具体的定义方式为:

body.large .chapter{
   font-size:1.5em;
}

?不理解,large与chapter的关系,后得知:

??? large类只能应用到<body/>中,chapter类可以应用到<body/>内部的所有地方:

???

??? 用例子说明:

 <body class="large">
	<div>
		<div>
			<div class="chapter">
				测试!!!
			</div>
		</div>
	</div>
</body>

?

?? 若large类应用到<body/>元素之外的地方,将是无效的。

?

?? 【原理说明】:

???? CSS的Class选择器的规则是:

????????? [通配符].Class名称{ 声明 }

???? 举例:*.abc{ color:##000033; },是指abc类样式,可以应用到任何地方。

????? 但,假如是:div.abc{ color:##000033; },则是指:abc类只能应用到<div/>中。

?

所以文章最初开始的CSS样式,其本质为:

body.large{
  font-size:1.5em;
}
body  .chapter{
  font-size:1.5em;
}

?

【延伸】:

?? 若CSS样式为:

body.large#small  .chapter{
   font-size:1.5em;
}

? 则只能这样使用:

<body class="large" id="small">
</body>

?

?

【结束】:CSS的ID选择器也是如此。

???????????????? 参考文献为:w3cschool。连接为:这儿

?

?

?