公司项目的一些总结

1、不建议使用‘_'这个符号,因为ie6有时候,不识别此符号

2、设置font-size:100%的作用

如当body设置font-size:12px 的时候,h1-h6是不继承这个属性的,所以要设置这个属性

3、line-height:最好使用复数

当使用单数的时候,对浏览器的显示有差别(各个浏览器的解析不同)

4、样式截字,需要出现省略号:但是这种截字的方法,必须是针对单行文本起作用

写法如下:width:***;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;

5、使用display:inline-block要注意的事项

display:block就是将元素显示为块级元素,display:inline则将元素显示为行内元素。

display:inline-block将元素显示为行内元素,但是元素的内容作为块元素处理。旁边的内联元素和该对象显示在同一行,并且允许空格,但是该元素具有块元素的特性,可以设置其高度,宽度等属性。在同一行内有不同高度内容的元素时,通常要设置对齐方式如vertical-align: top;来使元素顶部对齐。

6、使用zoom:1的作用

触发IE浏览器的haslayout,解决ie下的浮动等一些问题,zoom属性是IE浏览器的专有属性,firefox等浏览器不支持,它可以设置或检索对象的缩放比例

7、rgba透明在ie9下的问题(ie9的滤镜)

filter:none;//处理ie9浏览器中的滤镜效果

background-color:rgba(0,0,0,0.8);

8、浏览器中判断ie6、ie7、ie8

ie6 识别*和_

ie7 识别*和!important

firefox识别!important不能识别*

color:#f00\0;       ie8-ie10

color:#f00\9\0;   ie9-ie10

color:#f00\9;    ie6-ie10

如果转门设置ie8的话,可以用下面的方法:

color:#f00\0;

color;#000\9\0;

9、css清除浮动的三种方法

1//个人推荐

.clearfix:before,.clearfix:after{display:table;content:"",line-height:0;}

.clearfix:after{clear:both;}

2//(有时候会导致没有换行的内容隐藏到,或者拖动的时候,要拖动的内容在盒子里拖不出去)

overflow:hidden;zoom:1;

3//不推荐,要添加多余的标签

添加div设置:clear:both;

10、ie8下图片带边框的问题

给img设置以下属性img{outline:none;border:none;}

11、ie6的双边距问题

_display:inline;

12、图片自适应问题

可以给图片外层添加一个盒子,设置宽高,然后设置图片为100%(兼容性好)

还可以把图片当做背景来实现,用position-size,控制图片的自适应,但是兼容ie9+

13、对于"text-indent:2em;"属性,只能加在块状元素上面,内联元素是不起作用的。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,842评论 1 45
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,839评论 1 92
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    love2013阅读 2,349评论 0 11
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    wzhiq896阅读 1,815评论 0 2
  • 朋友叶子刚刚给我发来这段话,这样的婚姻还要维持吗?
    周一一的角落阅读 277评论 0 0