CSS兼容性(IE和Firefox)技巧大全(5)
作者:yehon 来源:web前端寒风 发布时间:2010-07-29 12:29:00
1. Div居中问题
div设置 margin-left, margin-right 为 auto 时已经居中,IE 不行,IE需要设定body居中,首先在父级元素定义text-algin: center;这个的意思就是在父级元素内的内容居中。
2.链接(a标签)的边框与背景
a链接加边框和背景色,需设置 display: block, 同时设置 float: left 保证不换行。参照 menubar, 给 a 和 menubar 设置高度是为了避免底边显示错位, 若不设 height, 可以在 menubar 中插入一个空格。
3.超链接访问过后hover样式就不出现的问题
被点击访问过的超链接样式不在具有hover和active了,很多人应该都遇到过这个问题,解决技巧是改变CSS属性的排列顺序: L-V-H-A
Code:
<style type="text/css">
<!--
a:link {}
a:visited {}
a:hover {}
a:active {}
-->
</style>
4. 游标手指cursor
cursor: pointer 可以同时在 IE FF 中显示游标手指状, hand 仅 IE 可以
5.UL的padding与margin
ul标签在FF中默认是有padding值的,而在IE中只有margin默认有值,所以先定义 ul{margin:0;padding:0;}就能解决大部分问题
6. FORM标签
这个标签在IE中,将会自动margin一些边距,而在FF中margin则是0,因此,如果想显示一致,所以最好在css中指定margin和 padding,针对上面两个问题,我的css中一般首先都使用这样的样式ul,form{margin:0;padding:0;}给定义死了,所以后面就不会为这个头疼了.
7. BOX模型解释不一致问题
在FF和IE中的BOX模型解释不一致导致相差2px解决技巧:div{margin:30px!important;margin:28px;} 注意这两个margin的顺序一定不能写反, important这个属性IE不能识别,但别的浏览器可以识别。所以在IE下其实解释成这样:
div{maring:30px;margin:28px}重复定义的话按照最后一个来执行,所以不可以只写margin:xx px!important;#box{ width:600px; //for ie6.0- w\idth:500px; //for ff+ie6.0}
#box{ width:600px!important //for ff width:600px; //for ff+ie6.0 width /**/:500px; //for ie6.0-}
8.属性选择器(这个不能算是兼容,是隐藏css的一个bug)
p[id]{}div[id]{}
这个对于IE6.0和IE6.0以下的版本都隐藏,FF和OPera作用.属性选择器和子选择器还是有区别的,子选择器的范围从形式来说缩小了,属性选择器的范围比较大,如p[id]中,所有p标签中有id的都是同样式的.
猜你喜欢
- 一年一度的双十一就快到了,各种砍价、盖楼、挖现金的口令将在未来一个月内充斥朋友圈、微信群中。玩过多次双十一活动的小编表示一顿操作猛如虎,一看
- 本文实例讲述了朴素贝叶斯分类算法原理与Python实现与使用方法。分享给大家供大家参考,具体如下:朴素贝叶斯分类算法1、朴素贝叶斯分类算法原
- Python自带一个轻量级的关系型数据库SQLite。这一数据库使用SQL语言。SQLite作为后端数据库,可以搭配Python建网站,或者
- 最初打算使用scroll-view实现,效果好、流畅、有惯性滑动,但由于滚动条没法去掉、无法实现上下层的帧布局,最终放弃了。还是自己写个吧,
- 本文为大家分享了pygame游戏之旅的第6篇,供大家参考,具体内容如下定义一个障碍模型函数:def things(thingx, thing
- 我就废话不多说,直接上代码吧!# -*- coding: utf-8 -*-import cv2import numpy as npfrom
- 本文实例讲述了django+js+ajax实现刷新页面的方法。分享给大家供大家参考,具体如下:在服务器开发的时候,为了方便将服务器对外开一个
- 1、备份数据库(单个表备份) bk_table.bat mysqldump -h127.0.0.1 -P3306 -uroot -proot
- 疫情还没结束,小编只能宅在家里,哪哪也去不了,今天突发奇想给大家分享一篇教程关于Python paramiko 模块浅谈与SSH主要功能模拟
- javascript 常见汉字转换成拼音,上下行排列,方便对比,速度快,你可以把代码复制到本地,作为一个不错的汉字转换拼音的工具!转换效果图
- J2ME是利用HttpConnection建立HTTP连接,然后获取数据,ASP也是利用HTTP协议,因而可以利用J2ME与ASP建立连接,
- APScheduler简介在平常的工作中几乎有一半的功能模块都需要定时任务来推动,例如项目中有一个定时统计程序,定时爬出网站的URL程序,定
- 废话不多了,直接贴代码了一查询数值型数据:SELECT * FROM tb_name WHERE sum > 100; 查询
- MaxPooling1D和GlobalMaxPooling1D区别import tensorflow as tffrom tensorflo
- 下面示例代码是防止用网页刷新过快,如果多个页面使用,最好将<%...%>代码存为一个asp文件,在需要的页面最前面include
- 遇到这样一个需求,有一张表,要给这张表新增一个字段delta,delta的值等于每行的c1列的值减去上一行c1列的值。我的解决方案,可以通过
- 前言vue.js的UI组件库,在git上有多个项目,我见的使用者比较多的是iView和Element.两个组件库,组件都很丰富。官网的介绍i
- 还有多少耿直boy和我一样在等待微信官方送上一顶圣诞帽?最后知道真相的我眼泪掉下来……(还蒙在鼓里的同学请在微信最上方的搜索栏自行搜索『圣诞
- 1.Series介绍Pandas模块的数据结构主要有两种:1.Series 2.DataFrameSeries 是一维数组,基于Numpy的
- 本文实例讲述了Laravel框架集合用法。分享给大家供大家参考,具体如下:前言集合通过 Illuminate\Support\Collect