当前目录: css基础教程
CSS伪元素 :after :befor

2016年11月3日  css基础教程,前端资源   

:after :befor 主要是文本内容的插入 IE8支持 :符号 功能1: .test:after{content:'123'} <div class="test" id="aaa">插入的内容是:</div> 效果就是: 插入的内容是:123 功能2: 获取元素本身属性的值在插入内容 .test:after{content:attr(id)} <div class="test" id="aaa">插入的内容是:</div> 效果就是: 插入的内容是:aaa 在css3中 ::after ::befor其实跟css2中的:after :befor功能是一样的,只是为了区别伪类选择符而已,即:(:hover这些) 在css3的语法中 :是伪类选择符 ::是伪对象选择符 可以参考:https://www.xgllseo.com/book/css/selectors/pseudo-element/index.htm            

css ie hack

2016年9月22日  css基础教程,前端资源   

ie css hack ie7 ie8 hack padding:10px; padding:9px\9; /* all ie */ padding:8px\0; /* ie8-9 */ *padding:5px; /* ie6-7 */ +padding:7px; /* ie7 */ _padding:6px; /* ie6 */  

IE8透明filter:alpha

2016年5月23日  css基础教程,前端资源   

IE8以下浏览器不兼容css的透明度属性,但是微软也提供自己的hack css方法: 经过测试IE7/8都支持以下写法 style="filter:alpha(opacity=50)";   IE7/8也有各自的写法 IE8里可以这样写 -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(opacity=50)';   IE7里可以这样写 filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);

textarea cols,rows属性和宽度高度关系研究

2016年2月23日  css基础教程,前端资源   

总结一下就是: 貌似在Chrome浏览器下才有点实用价值,因为其他浏览器下的宽度波动太明显,任何其他环境的变化都会导致宽度不一样,这个其实在网页布局中是很糟糕的。因为,网页是自上而下流式的,高度可以很长很长,但是,宽度一般是固定的,资源比较紧张,要求布局精确,因此,一旦出现宽度在各个浏览器下不一样的情况,势必大大影响其实用价值。因此,在实际web制作的时候,除非一些对宽度要求不高的情况,其余时候,还是使用CSS width属性来控制文本域的宽度。   最后的结束语 最后研究的结果是,兼容性很差,想要各个浏览器下表现一模一样成本很高。因此,如果对文本域的布局要求比较严格,还是使用CSS width/height属性精确控制。 唯一的收获就是,知道了各个浏览器如何兼容性不一,以及最终尺寸呈现的计算...

取代float属性

2016年1月21日  css基础教程,前端资源   

常写css的人都知道要让元素水平排列一般习惯性的使用float,使用此属性之后还需要清除浮动。 现在可以完全使用display属性来代替了,如下: display:inline-block;*display:inline;*zoom:1; 这样元素不仅可以水平排列在一起,还能控制大小,可以兼容IE7以上浏览器,至于IE6没去测试也不想去测试了。 (使用这方法记得元素和元素之间不能有空白,不然谷歌浏览器也会有一个空白的空间) 如: