CSS笔记
清枫草塘
HTML+JS+CSS,Html5+CSS3,Canvas/SVG,PHP+MySQL
展开
-
IE6 IE7 IE8 css bug兼容性解决方法总结归纳
1:li边距“无故”增加任何事情都是有原因的,li边距也不例外。先描述一下具体状况:有些时候li边距会突然增 加很多,值也不固定(只在IE6/IE7有这种现象),让人摸不着头脑,仔细“研究”发现是由于其低级元素ul的padding引 起,padding的上下值对li有影响,左右无影 响。所以只好笨手笨脚地把padding去掉,换成margin。这是能解决问题,但往往不是我们想要的结果,或许转载 2012-05-26 19:00:41 · 5340 阅读 · 1 评论 -
【CSS笔记之十】深入认识display:inline-block和hasLayout
【CSS笔记之十】display:inline-block和hasLayouthasLayout设计的初衷是用于辅助块级元素的盒子模型的,它是用于块级元素的。如果用于行内元素,会引发一些特殊效果。设置宽高属性width、height值都可以触发hasLayout,但是有时候带来副作用,现在常用zoom:1;来触发,极少数非常复杂的css设置情况zoom无效的时候,需要借助更为强大的“pos原创 2012-05-16 18:21:17 · 4306 阅读 · 1 评论 -
【五月夏花】CSS笔记之七:话说CSS字体属性font-family、font-style、font-size、font-weight、font-variant
话说CSS字体属性font-family、font-style、font-size、font-weight、font-variant:使用CSS,可以对字体进行设置,字体属性包括五种常见属性:字体系列font-family、字体样式/字体风格font-style、字体大小font-size、字体粗细font-weight、字体变量font-variant。通过这五个属性,可以设定文本在we原创 2012-05-08 19:01:17 · 19625 阅读 · 0 评论 -
CSS3阴影 box-shadow的使用和技巧总结
text-shadow是给文本添加阴影效果,box-shadow是给元素块添加周边阴影效果。随着html5和CSS3的普及,这一特殊效果使用越来越普遍。基本语法是{box-shadow:[inset] x-offset y-offset blur-radius spread-radiuscolor}对象选择器 {box-shadow:[投影方式] X轴偏移量 Y轴偏移量阴影模糊半径 阴影扩原创 2012-05-28 18:58:04 · 718095 阅读 · 13 评论 -
【CSS笔记之六】filter滤镜在IE浏览器失效的原因、Chrome不认document.documentElement.scrollTop的解决方法
一、filter滤镜在IE浏览器失效的原因及其解决方法在项目后期补充交互效果的时候,发现有时候filter滤镜在IE浏览器下会失效。用IE Developer Toolbar检查测试后发现hasLayout 属性值为0。说明造成此现象的原因依然是IE的Layout没有被触发。触发IE Layout的方式很多,比如display:inline-block;width/height:除原创 2012-05-04 19:14:43 · 16379 阅读 · 1 评论 -
【CSS笔记之五】IE6/IE7/IE8下float:right的异常及其解决方法
示例分析代码: 安卓首页>安卓游戏> 角色育成 下载量排序时间排序 对应CSS样式代码:#channel_tit h1,#channel_tit h2{ background:none; font-size:14px; padding-left:10px; height:34px; line-height:34px; width:6原创 2012-05-03 16:32:38 · 24782 阅读 · 2 评论 -
【CSS笔记之八】CSS标签语义化、怪异模式和CSS的组织方式
CSS语义化标签需要注意的问题1.虽然CSS布局中不推荐使用table。但是table布局在二维数据展示方面是最好的选择。table除了table、tr、td标签外,表格标题要用caption,表头用thead包围,主体部分tbody包围,尾部用tfoot包围,表头和一般单元格要区分开,表头用th,一般单元格用td。2.尽可能减少使用div、span等无语义标签。3.在语义不明显,原创 2012-05-14 19:15:31 · 1617 阅读 · 0 评论 -
【CSS笔记之九】CSS选择符权重、CSS Sprite技术和CSS hack
一、在实际使用中,使用类要注意:多用组合,少用继承。上下margin重合问题:margin是个特殊的样式,相邻的margin-left和margin-right是不会重合的,但相邻的margin-top和margin-bottom会产生重合。如果不确定模块的上下margin特别稳定,最好不要将它写到模块的类里,而是使用类的组合,单独为上下margin挂用于边距的原子类(如mt10/mb原创 2012-05-15 18:05:48 · 2222 阅读 · 0 评论 -
由锚点失效引发的hasLayout探究
最近在项目中遇到了一些与锚点相关的问题,由此引出hasLayout的一系列概念和方法,在此记录下来与大家一起分享。一、锚点的相关问题1.html map定位的名字问题。 大部分浏览器都支持map的name属性,而webkit内核的浏览器,如chrome和safari,不认识name,必须使用id,否则定原创 2012-04-19 19:03:57 · 7235 阅读 · 0 评论 -
柳絮纷飞的日子——CSS笔记之四
1.IE6也认识!important.我们知道!important一般用做提升优先级,区分IE6和Firefox/Chrome/Opera/IE 其他版本的hack,不过并不是因为IE6完全不支持!important.代码段一: .test{ color:blue !important; color:green;}代码段一代码段二:.test{ color:原创 2012-04-16 17:19:28 · 1387 阅读 · 0 评论