400-685-0732

WJMonitor舆情之声

企业大数据智能舆情监测管理解决方案

全网监测海量数据按需发布监测预警

实时把握舆情动态精准追溯信息源头

获取验证码
企业采购 个人使用
当前位置: 首页 > SEO博客 > css样式回顾

css样式回顾

时间:2012-12-26 12:35:02
在做前端的这段时间,虽然一直在用html和css,但是经常用的熟悉了,不经常用的不了解,所以汇总了一下最近项目中遇到的几个属性,以作回顾。

一、!important 属性

它的作用是定义样式的优先权,ie不支持这语法,其它浏览器都支持,设置了优先权的代码是不会被ie执行的,方法是:在important的后面添加css样式即可。

二、height属性

高度的应用,一般设置了宽度高度不设置也是没问题,但是在有些浏览器中由于内容超出了默认高度的时候,就需要设置高度,对于溢出部分可以使用overflow:hidden;来隐藏。

三、css注解

注解的作用可以方便在以后的维护中一看即懂,由于对于团队合作中更应该注意这点,它的样式/*注释说明文字 */。

四、css父级子级

在css书写中,可能并不在意继层问题,但是对于在页面上显示会有比较大的影响,所以在建立html代码的时候,需要考虑到class的书写规范,例如:service    service_a 从这两个可以看出前者是后者的父级,在css中可以从css的优化考虑,如何不使css多余。

五、clearfix:after



* html .clearfix {height: 1%;}

这段代码一直有在其它网站的css中看到,它存在的原因是,在有些html中不能自动加大高度而设置,clearfix的css使用了after的伪类,将应用clearfix的结尾添加content中的内容,添加了句号“.”,并将display设置为了block,高度设为o,clear设为both;visibility设为隐藏。即达到了自动撑开容器的目的,不过由于ie无法识别,故又添加了ie的专属设置。

六、z-index

在目前做的网站中,虽然用到这属性的次数不在多,不过效果确实惊人的,对于文字和图像的叠加就可以利用这个属性来设置,z-index用于绝对定 位或相对定位了的要素。
例如;.shuxin1 { position: relative; left: 10px; top: 0px; z-index: 10 } .shuxin2 { position: relative; left: 33px; top: -35px; z-index: 1 }由于shuxin1的参数值更高,所以会显示在上面。

css样式还有很多,但鉴于最近项目中用的一些平常不常用的css,作以上罗列,更多css样式持续更新中...
分享按钮