HTML/CSS中常遇到的bug 一些注意事项总结
1、IE6下横向双倍margin bug (触发条件:块属性标签;float;横向margin设置;IE6下。解决办法:css中加入display:inline。)
2、css中公用属性首先声明;如对浏览器对某些标签有默认的margin 和padding 值首先声明默认值为0。
3、css中class类名必须有实际的意义,必须与内容相关;不得用纯数字用于class类名。
4、IE6下标签嵌套时,如果内层标签float,只有清除内层标签的浮动后外层标签才能被撑开。
5、清除浮动时用div而不用其它标签清除浮动;
.clear {height:0;clear:both;overflow:hidden;}
6、IE6下定义1px的高度或定义小于等于10px的高度;IE6下默认行高是10px,解决办法是:overflow:hidden / zoom:0.08 / line-height:1px。
7、超链接点击过后就不在出现hover样式?解决方法是:改变css属性的排列顺序L--V--H--A。
8、使用群组选择器时,class名之间必须用空格隔开,否则firefox将不会读取CSS命令。
9、a标签中嵌套img时,必须有a{dispaly:block;}否则在IE6下将影响布局(即在图片下方多出一部分空白)。
10、a标签中嵌套img时,img默认会有1px的border,需要在CSS中加入a img {border:none;}。
0000000000000000000000000000000000000000000000000000000000000000000000000000000000
11、a标签中嵌套img时,a标签必须为块属性(即display:block;)否则在IE6下图片下方会多出一部分,影响布局。
12、在进行position定位时如果是标签嵌套时定位必须将父标签里的浮动全部清除,子标签的浮动后的CSS样式才能在IE6下被读出。
13、通过改变后缀名改变图片格式的图片在IE6下读不出,在其他浏览器下将以原来的格式解析图片。
14、li 中嵌套img img需要float否则在IE6下 img下方会多出一部分 有空隙。
15、在IE6下使用position定位,内标签必须清除浮动,否则定位的标签将无法显示。
16、未使用float浮动时,内层标签的margin值撑不开外层标签,而内层标签的padding值则可以撑开。
17、标签嵌套时,如果父子标签均浮动,子标签就不用清除浮动。
18、logo外层需要用H1标签嵌套。
19、在后台无法改动css,改动css需要改代码,所以需要更换的图片使用img标签。
HTML/CSS中常遇到的bug 一些注意事项总结的更多相关文章
- CSS 中,用 float 和 position 的区别是什么?
		
CSS 中,用 float 和 position 的区别是什么? 呃,其实这个命题有误,只有position才是定位,float不能说是定位,不过你可以说这两种布局方式有什么不同.float和posi ...
 - CSS中一些常见的兼容性问题
		
CSS中一些兼容性问题就是浏览器兼容,而这些浏览器兼容问题主要是Ie和FF之间的争斗. CSS hack中的一些事: 我们为了让页面形成统一的效果,要针对不同的浏览器或不同版本写出对应可解析的CSS样 ...
 - css中单位px、pt、em和rem的区别
		
国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢? px :像素(Pixel).相对长度单位.像素px是相对于显示器屏幕分辨率而言的.(引自CSS ...
 - CSS中"!important"的使用
		
本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22:23:22) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < ...
 - CSS中不为人知Zoom属性的使用介绍(IE私有属性)
		
其实Zoom属性是IE浏览器的专有属性,Firefox等浏览器不支持.它可以设置或检索对象的缩放比例.除此之外,它还有其他一些小作用,比如触发ie的hasLayout属性,清除浮动.清除margin的 ...
 - CSS中的overflow属性
		
导读:overflow属性一般用来隐藏超过div范围的元素,包括不隐藏(visible),直接隐藏(hidden),用滚动条隐藏(scroll),自动(aotu)这四个属性.当然overflow的用法 ...
 - 深入理解CSS中的层叠上下文和层叠顺序(转)
		
by zhangxinxu from http://www.zhangxinxu.com 本文地址:http://www.zhangxinxu.com/wordpress/?p=5115 零.世间的道 ...
 - CSS中设置DIV垂直居中的N种方法 兼容IE浏览器
		
在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...
 - CSS中!important的优先级
		
本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22:23:22) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < ...
 
随机推荐
- 完美解决移动Web小于12px文字居中的问题
			
前几天的一篇博文:移动Web单行文字垂直居中的问题,提到了移动web里小于12px的文字居中异常的问题,最后还是改为12px才近乎解决了问题.但是有时候或许并不是那么乐观,你并不能将原本定为10px的 ...
 - 基于OCILIB的oracle数据库操作总结及自动生成Model和Dao的工具
			
基于OCILIB的oracle数据库操作总结 1. 类图 2. 基类BaseOCIDao的设计与实现 BaseOCIDao.h头文件 #pragma once /* ----- ...
 - unity  开发总结
			
1.慎用线程,unity对线程的支持不是特别完善. 在一些网络通信,资源下载,解压文件,不得已要开线程操作的地方,需要进行线程回收. 2.不压缩的ab,比经过压缩的ab大了将近4倍. 在打包ngui的 ...
 - JavaScript  “完美运动框架”
			
/* “完美运动框架”,所谓“完美”,就是可以实现多个参数,多个物体运动互不影响的一个运动函数move(). * 大致结构如下:运动框架 EXP: move(obj,{width:200,height ...
 - WinDbg 调试.net程序
			
WinDbg支持以下三种类型的命令: · 常规命令,用来调试进程 · 点命令,用来控制调试器 · 扩展命令,可以添加叫WinDbg的自定义命令,一般由扩展dl ...
 - mysql在windows下支持表名大小写,lower_case_table_names
			
windows下mysql默认是不支表名大小写的,也就是表名大小写不敏感.用phpmyadmin创建的驼峰式表名,全部被强制成小写.mysql表名大小写敏感的参数: lower_case_table_ ...
 - lnmp下用phpize动态安装PHP模块/扩展(不需要重装PHP)
			
安装前 安装前建议先执行 /usr/local/php/bin/php -m (此命令显示目前已经安装好的PHP模块)看一下,要安装的模块是否已安装.然后下载当前PHP版本的源码并解压. 本文以ima ...
 - PHP安全之register_globals
			
一.register_globals = Off 和 register_globals = On的区别 register_globals是php.ini里的一个配置,这个配置影响到php如何接收传递过 ...
 - 如何去掉html中的超链接
			
$a= preg_replace("/<a[^>]+>/", "", $a); $a= preg_replace("/<\/a ...
 - js文本框验证
			
1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'')" onafte ...