Insert you title list-item_01 this is a test this is a test list-item_02 this is a test ... Read More
一、挖坟不可耻 CSS计数器不是什么新鲜玩意了,早在10年春暖花开的时候,我写的“CSS content内容生成技术以及应用”一文就要提到(见下图),不过当时是作为其中一员介绍。就像例行的溜新同事一样,虽然黑如焦炭的我在自我介绍的时候给新同事留下了深刻印象,但由于介绍的同事茫茫多,我只是其中一员。很 Read More
一、特性表现one: 不能左右:empty伪类 CSS3选择器中有个:empty伪类,表示当元素里面什么都没有的时候(包括空格、标签内换行),应用相关样式。在现代web网页开发制作中,非常常用也非常方便。 例如,某元素类名是.box, 如下HTML和CSS: 因为.box里面是空大屁,所以,呈现的背 Read More
每种程序语言都有其精华与糟粕的部分。CSS(我知道,CSS不是程序语言,但又何妨?)也不例外。 本文我除了发牢骚还是发牢骚。我已经给网站敲代码敲了12年了,其中有一半的时间是在折腾CSS布局(没错,哥我大器晚成)。我想到要去认识到CSS中的精华与糟粕,而这里,我要讲的是”糟粕”。 “标准”盒模型 虽 Read More
小小的提醒 在进入正题之前,我要做一回啰嗦的老女人,讲点可有可无无伤大雅的提醒: 仅在CSS可用的现代浏览器下起作用 不可通过DOM使用,它只是纯粹的表象 最基本的 – 生成内容 content使用如下: h2:before { content: "我是额外文字!"; } 此段样式的作用是在每个h2 Read More
vertical-align的定义 W3C上对vertical-align的定义:vertical-align 属性设置元素的垂直对齐方式。该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中,这个属性会设置单元格框中的单元格 Read More
外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距;合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者 外边距合并外边距合并(叠加)是一个相当简单的概念。但是,在实践中对网页进行布局时,它会造成许多混淆。简单地说,外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。 Read More
/** 楔子: !important是CSS1就定义的语法,作用是提高指定样式规则的应用优先权(参见:W3.org的解释)。 语法格式{ sRule!important },直接写在定义的最后面,如: p{color:green !important;} 注意:IE一直都不支持这个语法,而其他的浏览 Read More
IE和Chrome等浏览器与zoom 还在几年前,zoom还只是IE浏览器自己私有的玩具,但是,现在,除了FireFox浏览器,其他,尤其Chrome和移动端浏览器已经很好支持zoom属性了: zoom的字面意思是“变焦”,摄影的时候常用到的一个概念。对于web上的zoom效果,你也可以按照此概念理 Read More
box-flex属性(和谐版) 有道桌面词典显示,”flex”一词中文有“收缩”之意。不过,从此属性实际上产生的效果来看,无论怎样用“收缩”一词解释都显得很牵强。所以,这里,直接抛开字面意思,我们可以将”box-flex”理解为”房子-分配”。box为“盒子”的意思,我们可以理解为当下价格巨高的“房 Read More