随笔分类 - 兼容性
包括浏览器的兼容性解决的心得
摘要:1. 问题现象 先看下面的html结构: 外层div设定了固定宽度,css中ul的宽度未设置(因为li的个数不确定),当通过javascript动态设置ul的宽度后,会导致li换行。 2. 分析 尝试将ul的宽度增大,问题消失,推测是计算的ul宽度不准确,经过思考推敲,原来是我为li设置了1px的b
阅读全文
摘要:在做列表时,我们经常会这样写: 在现代浏览器下点击图片或者a标签里的其他部分,均能链接到指定url,但是在ie6,ie7,部分ie8下鼠标hover到img上并没有出现鼠标的手,而且点击也没有反应。 解决方法: 推测是css样式问题,在img的父元素div上,我设置的css有: overflow:
阅读全文
摘要:布局网页时,需要把header固定在上方。直接使用position:fixed;现代浏览器以及ie8以上均正常显示,但是ie7中,header里面的子元素设置的水平居中并没有效果。做了各种尝试,都没有解决。经过网上查询,固定定位必须要写left和top值,至此问题解决。
阅读全文
摘要:1.css3有一个属性:background-size:cover;可以让背景图片完全覆盖屏幕,但是IE9以下浏览器无效。 2.IE有个滤镜: 经测试,没有什么效果。 3.有一种方法是:单独在body上放一个div,里面只放一个img,将该div定位最下方。ie,其他浏览器均可,但是img会变形(如
阅读全文
摘要:http://www.phpddt.com/dhtml/926.html 问题描述:li的高度在IE6 IE7间距高度和其他浏览器不一致,即便设定了高度,IE6,7中,仍比其他浏览器要高。 解决方法:在li样式上加上vertical-align:bottom;
阅读全文
摘要:问题描述: ul固定宽度,li浮动超出ul的宽度自动换行,li有左margin,但是靠近ul左边缘的那一列l 的margin设为0,其他浏览器正常,但是在ie7中超出ul宽度后会有一个l溢出并导致出现横向滚动 条,即便ul设置了overflow:hidden,也无用。 解决方法:特殊li的margi
阅读全文
摘要:实现透明的css方法 通常有以下3种方式,以下是不透明度都为80%的写法 1.css3的 opacity:x,x 的取值从 0 到 1,如opacity: 0.8 设置opacity元素的所有后代元素会随着一起具有透明性,一般用于调整图片或者模块的整体不透明度。 2.css3的 rgba(red,
阅读全文
摘要:看代码: HTML CSS 正常情况下,Chrome,FF: IE7及360兼容模式下: 原因:ie中子元素的优先级要取决于其父元素的优先级,需要设置父元素的z-index 解决方法:因为有两个同一class的div,绝对定位的ul的父元素就是.select-wrap,但是如果给两个.select-
阅读全文
摘要:最近做项目,用360浏览器访问自己的本地网页,发现都是默认在兼容模式下打开,做的淡入淡出轮播效果在兼容模式下看时,感觉切换很生硬。百度,发现360官网帮助里有说明用meta标签控制浏览器内核,网址为http://se.360.cn/v6/help/meta.html. 实现方式很简单,就是在head
阅读全文
摘要:原作者:微米博客 以前写过一篇关于CSS hack的文章,但近期回头看了看发现理解的不够深刻,总结的也不凝练,于是今天重新测试从新写一篇。常用的CSS hack如下(笔者只对IE&FF&Chrome进行了测试)。 hack列表(全部经笔者测试,且均为标准模式下,混杂模式由于很少会用到所以未对其进行测
阅读全文
摘要:1.ie下背景图片铺满全屏解决方法: 问题:设置background:cover,chrome,ff,ie9+正常,ie9兼容模式(推测是ie7)及ie8两边有留白解决:放弃在body上设置背景图片,在html上加一个div专门放背景图片 2.导航二级菜单的显示隐藏问题 --现象:鼠标hover,二
阅读全文
摘要:1.button里面,用letter-spacing调整中文字间距 问题描述:设置之后现代浏览器无法使文字水平居中,会偏右,原因:最后一个字后面也有间距存在解决方式:用空格解决;或者用paddding-left:2px解决 2.兼容ie6,7,8背景透明内容不透明解决方法: rgba(a,b,c,0
阅读全文
摘要:css代码
阅读全文