来一发CSS教程：了解承继属性及使用

只看该作者 · 发表于 2015-1-16 00:12:21

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

您需要登录才可以下载或查看，没有帐号？立即注册

x

大大缩减页面代码，提高页面浏览速度,缩减带宽成本;
4.5承继
在本书的[3.3.2承继与层叠]一节已经扼要先容过承继：(X)HTML元素能够从其父元素那边承继部分CSS属性，即便以后元素并没有界说该属性。

4.5.1值的承继

承继也是基于文档树的，文档树中元素的某些属性能够被其子元素承继，每个CSS属性都界说了它可否被承继。比方有以下代码，其在扫瞄器内显现如-29所示。

p{color:green;}
<p>文档树中一元素的<strong>某些值</strong>能够被其子元素承继。</p>

登录/注册后可看大图

-29值的承继

要设定文档的某些缺省款式属性，能够在文档树的根上设定该属性，假如这个属性能够承继，则厥后代元素将承继这个属性，比方color、font-size等属性。在(X)HTML中，<html>或<body>元素能够完成这一功效。比方：
body{color:black;}
因为color属性是可承继的，一切<body>元素的儿女都承继色彩值为“black”。
指定的百分比值不被承继，可是盘算值能够被承继。比方：
body{font-size:12px;}
h1{font-size:120%}
<body>
<h1>题目1的<em>笔墨</em>会年夜一些</h1>
<p>段落的笔墨承继body的界说</p>
</body>
<h1>元素的font-size属性的盘算值为“14.4px”（其父元素值12px的120%）。因为“font-size”的盘算值被承继，<em>元素也承继“14.4px”的盘算值。可是因为1个像素（1px）是电脑最小的显现单元，不成能显现“0.4px”，以是<h1>和<em>元素“font-size”的实践值是“14px”。

4.5.2“inherit”值

每个属性能够指定值为“inherit”，即：关于给定的元素，该属性和它父元素绝对属性的盘算值取一样的值。承继值一般只用作后备值，它能够经由过程显式地指定“inherit”而失掉增强，比方：
p{font-size:inherit;}

4.5.3承继的范围性

承继固然削减了反复界说的贫苦，可是，有些属性是不克不及承继的，比方border（边框）、margin（边距）、padding（补白）和背景等。
如许设定是有事理的，比方，为一个<div>设定了边框，假如此属性也承继的话，那末在这个<div>内一切的元素城市有边框，这无疑会发生一个让人头昏眼花的了局。一样的，影响元素地位的属性，比方margin（边距）和padding（补白），也不会被承继。
同时，扫瞄器的缺省款式也在影响着承继的了局。比方：
body{font-size:12px;}
<h2>2级题目的笔墨不是12px。</h2>
这是由于扫瞄器的缺省款式设定了<h2>的CSS划定规矩。
同时，有些老版本的扫瞄器大概对承继撑持的不太好，比方某些扫瞄器当碰到<table>的时分，就会丧失一切的承继的属性，比方以下代码，在IE5.5中显现如-30所示。
body{font-size:12px;}
<p>段落的笔墨承继body的界说</p>
<table>
<tr>
<td>单位格</td>
<td>单位格</td>
</tr>
</table>

登录/注册后可看大图

-30IE5.5中表格没有承继<body>的属性

因而，假如要照应到这些老版本的扫瞄器，则大概必要以下界说：
body,table,th,td{……}
Div全称division意为“区分”使用DIV的方法跟使用其他tag的方法一样。

只看该作者 · 发表于 2015-1-18 05:31:46

我深感到交流的重要。善于交流的人才是善于学习的人。在整个技术的学习过程中，我总结了四大定律：兴趣、恒心、虚心、时间。

只看该作者 · 发表于 2015-1-25 20:42:36

在刚开始接触网页的第一堂课上，听说网页制作会是一门很无聊并且很难听懂的过程，而事实却印证了这样一个事实。

只看该作者 · 发表于 2015-2-4 04:04:29

在刚开始接触网页的第一堂课上，听说网页制作会是一门很无聊并且很难听懂的过程，而事实却印证了这样一个事实。

只看该作者 · 发表于 2015-2-9 15:49:17

Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。

只看该作者 · 发表于 2015-2-27 09:05:32

HTML技术的不断发展和完善，随之而产生了众多网页编辑器，从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器（则原始代码编辑器）

只看该作者 · 发表于 2015-3-9 03:53:33

Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器，在编辑时能同时看到源码和设计界面，非常方便新手学习制作网页。

只看该作者 · 发表于 2015-3-16 22:05:56

Dreamweaver在所见即所得添加链接，也可以先选中文字或图片然后在属性栏中的链接栏后的一个小圆圈，用鼠标点击小圆圈按住不放拖动出箭头然后指向文件即可。

只看该作者 · 发表于 2015-3-23 08:08:44

在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。

		自动登录	找回密码
密码			立即注册

[DIV+CSS] 来一发CSS教程：了解承继属性及使用

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

相关帖子