深入理解CSS的inherit与auto之间区别

2010-06-20 15:40:01 作者：网友来源：互联网

通常是一个很小的数值，经过层层放大歪曲后，整个布局就走形了。CSS是一门很简单的语言，易学易用，但也最容易出垃圾代码。这是没有深入研究这门语言所致。本人认为，CSS是由以下三大块构成的：默认值，继承系统与加权系统。默认值，也就是浏览器在用户没有设置属性的情况下，默认指定的属性。CSS框架基本都有一个叫reset.css 的文件，就是对其进行重设，消除各浏览器的差异的。继承系统就是下面要重点讨论的东西。加权系统，也就是优先级的问题，不在本文的讨论范畴，不说了。另，这三个东西都面临着IE Bug的侵袭，危害甚大，自己另行了断吧（笑）。

在CSS中，许多属性都是可以继承的，如某个段落的字体设置为白色，其元素的字体不用设置或设置为inhert，它就是白色。这些属性被称之为inherited property，它会从父元素获取对应属性的经过计算与转换的值(computed value)，如果父元素和它的情形一样，它就继续往上找，最后没有就使用浏览器的默认值。

下面是 inherited properties的一览表：

border-collapse
border-spacing
caption-side
color
cursor
direction
empty-cells
font
font-family
font-stretch
font-size
font-size-adjust
font-style
font-variant
font-weight
letter-spacing
line-height
list-style
opacity
list-style-image
list-style-type
quotes
text-align
text-indent
text-transform
white-space
word-spacing

提示:可以对代码修改后再运行。

相关热词：inherit auto CSS基础

分享到：

更多...

收藏至我的帐号

教程排行榜: 21个令人惊叹的CSS技术（案例）展示; 看这些用CSS3绘制的图标，你震撼了吗; HTML5的Video标签详细说明手册; 如何使一个DIV层居中于浏览器中？; 加一段代码让IE6支持hover伪类效果; IE PNG Fix—让IE6完美支持PNG透明图片的插件; CSS Sprite(CSS精灵)的优点和使用方法; 最新的IE6、IE7和IE8的CSS BUG汇总列表; 深入理解CSS的inherit与auto之间区别; 用浮动清除LI元素在IE6中底部3像素的BUG; CSS3教程：17种用CSS实现的很酷炫的立体网...; 解决IE6下PNG图片透明的最佳方法; IE的几个最常见BUG及解决方案; DIV+CSS布局两列右列宽度自适应布局的不同...; CSS样式的postion属性absolute和fixed的区别; CSS教程：用相对定位实现简单的图片边框阴...

下载排行榜: 基于jQuery的超炫酷的3D切换JS幻灯焦点图特效代码; 半透明立体质感的宽屏flash+xml焦点幻灯代码; 简洁效果多图切换flash幻灯焦点图代码; 带标题和数字导航的JS焦点幻灯特效代码; 适合摄影网站超漂亮的宽屏flash+xml幻灯轮换代码; 31款简单实用的CSS+JS下拉菜单脚本; 3D立体效果金字塔环形旋转的flash+xml相册代码; 基于jQuery实现的瀑布流布局列表特效代码; 透明质感上下滑动带小图预览5屏JS焦点图幻...; 超酷的3D摩天轮flash+xml相册幻灯图片代码; 能沿多个方向滑动切换的jquery幻灯代码; 自带多种幻灯效果支持缩略图导航的jquery画...; 可改图片尺寸和张数的flash幻灯轮换代码; 很好看的带缓冲效果CSS下拉菜单导航代码; 基于jquery很有趣的360度全景图片预览特效; 6屏幻灯上下滑动式带缩略图和文字介绍的fla...