CSS浏览器兼容性与解决
一、超链接访问后hover样式不出现
1、现象描述：
同时设置了a:visited和a:hover样式，但一旦超链接点击过后，hover的样式就不再出现了。
2、解决方法：
调整样式顺序为先a:visited再a:hover即可。
a标签四种状态的排序：l(link)ov(visiter)e h(hover)a(active)te
二、行内元素上下margin和padding不拉开元素间距
1、现象描述：
行内元素的margin和padding在水平方向的都产生边距效果，但竖直方向的都没有效果。
（1）HTML代码：
<div>块级元素</div>
<span>行内元素</span>
（2）CSS代码：
div {
background: gray;
padding: 20px;
}
span {
background: green;
padding: 20px;
margin: 20px;
}
2、解决方法：
将行内元素display设置为block或inline-block即可。
（1）CSS代码：
span {
background: green;
padding: 20px;
margin: 20px;
display: block/inline-block;
}
三、浮动背景：
解决浮动背景，可在<head></head>之间相应的位置输入以下代码：
<style type='text/css'>
<!--
body {
background-image: url(image/bg.gif);
background-attachment: fixed;
}
-->
</style>
四、list-style-image无法准确定位的问题：
解决list-style-image无法准确定位的问题，可在<head></head>之间相应的位置输入以下代码：
<style type='text/css'>
<!--
li {
list-style: url('http://gluu5.163.com//E/11/6.gif');
} li a {
position: relative;
top: -5px;
font: 12px/25px 宋体;
}
-->
</style>
五、设置滚动条的颜色：
设置滚动条的颜色，可在<head></head>之间相应的位置输入以下代码：
<style type='text/css'>
<!--
html {
scrollbar-face-color: #F6F6F6;
scrollbar-highlight-color: #FFF000;
scrollbar-shadow-color: #EE00EE;
scrollbar-face-color: #F6F6F6;
scrollbar-3dlight-color: #EE222E;
scrollbar-arrow-color: #CCC000;
scrollbar-track-color: #DDEECC
scrollbar-darkshadow-color: #FFFDDD;
}
-->
</style>
六、innerText在IE下正常，但在FireFox下却不行：
解决此问题需要textContent：
（1）JQuery代码：
if(navigator.appName.indexOf('Explorer') > -1) {
document.getElementById('element').innerText = 'My text';
} else {
document.getElementById('element').textContent = 'My text';
}
七、ul和ol的列表缩进问题：
消除ul和ol的列表缩进问题，应写成如下样式：
ul {
padding:;
margin:;
list-style: none;
}
ol {
padding:;
margin:;
list-style: none;
}
CSS浏览器兼容性与解决的更多相关文章
- 【转】CSS浏览器兼容性与解析问题终极归纳
1.怪异模式问题:漏写DTD声明,Firefox仍然会按照标准模式来解析网页,但在IE中会触发怪异模式.为避免怪异模式给我们带来不必要的麻烦,最好养成书写DTD声明的好习惯. 2.IE6双边距问题:在 ...
- HTML+CSS浏览器兼容性问题
浏览器兼容问题一:不同浏览器的标签默认的外补丁和内补丁不同 问题症状:随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大. 碰到频率:100% 解决方案:CSS里 ...
- 常见CSS浏览器兼容性问题与解决方案【转载自http://blog.csdn.net/chuyuqing/article/details/37561313/】
所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况.在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们的系统,都应该是统一的 ...
- CSS浏览器兼容性问题解决方法总结
CSS浏览器兼容解决总结如下: 1. CSS中几种浏览器对不同关键字的支持,可进行浏览器兼容性重复定义 !important 可被FireFox和IE7识别 * 可被IE6.IE7识别 _ 可被IE6 ...
- 浏览器的兼容性（CSS浏览器兼容性、CSS hack）
一.关于CSS hack(尽量不用或者少用,减少页面复杂度) 1.条件注释法:(我的测试是IE9及其以下才有效) 这种方式是IE浏览器专有的Hack方式,微软官方推荐使用的hack方式.举例如下 只在 ...
- javascript和css浏览器兼容性总结
一些浏览器的兼容性做一个总结的问题以下: 为什么会出现这样的现象是?主要表现为Firefox这样的良好支持的浏览器W3C标准,这是现在CSS支持最好的浏览器,和ie它比较早出现,在w3c支持一直没有做 ...
- CSS浏览器兼容性与解析问题终极归纳
1.怪异模式问题:漏写DTD声明,Firefox仍然会按照标准模式来解析网页,但在IE中会触发怪异模式.为避免怪异模式给我们带来不必要的麻烦,最好养成书写DTD声明的好习惯. 2.IE6双边距问题:在 ...
- CSS浏览器兼容性问题集（）两
11.非常适合 高度适合于被改变时所述内目标高度的外层的高度不能自己主动调节,尤其是排队对象时margin 要么paddign 时. 例: #box {background-color:#e ...
- css 浏览器兼容性问题解决
一个.!important (功能有限) 随着IE7正确!important支持, !important 方法现在只IE6兼容.(注意措辞.我记得这句话需要推进的位置.) : #example ...
随机推荐
- webpack 4 升级点
webpack 4 升级点: 默认entry为./src,默认output为/dist sideEffects 在webapck2开始支持ESModule后,webpack提出了tree-shakin ...
- Linux lsattr命令详解
Linux lsattr命令 Linux lsattr命令用于显示文件属性. 用chattr执行改变文件或目录的属性,可执行lsattr指令查询其属性 用法: lsattr [-adlRvV][文件或 ...
- 大数据时代——为什么用HADOOP？
转载自:http://www.daniubiji.cn/archives/538 什么叫大数据 “大”,说的并不仅是数据的“多”!不能用数据到了多少TB ,多少PB 来说. 对于大数据,可以用四个词来 ...
- MySQL数据库优化小建议
背景 “那啥,你过来一下!” “怎么了?我代码都单元测试了的,没出问题啊!”我一脸懵逼跑到运维大佬旁边. “你看看!你看看!多少条报警,赶快优化一下!”运维大佬短信列表里面好多MySQL CPU 10 ...
- mysql binlog to sql and show mysqlstatusadmin
sed '/WHERE/{:a;N;/SET/!ba;s/\([^\n]*\)\n\(.*\)\n\(.*\)/\3\n\2\n\1/}' 1.txt | sed -r '/WHERE/{:a;N;/ ...
- Word中选择中内容后变成C，VMware 虚拟中Ctrl键一直被按住了
Word中选择中内容后变成C: 解决办法:关闭金山词霸的[划词翻译]功能即可. VMware 虚拟中Ctrl键一直被按住了: 解决办法:关闭金山词霸的[取词翻译]功能即可.
- 黄聪：JQUERY的datatables插件，Date range filter时间段筛选功能
需配合moment插件实现:http://momentjs.com/ 演示:http://live.datatables.net/zuciyawi/1/edit HTML代码 <!DOCTYPE ...
- 【linux】之Centos6.x升级glibc
因为Centos比较保守依赖的glibc最高版本是2.12 rpm -qa|grep glibc strings /lib64/libc.so. |grep GLIBC_ 但是经常我们安装一些源码包, ...
- 【问题解决】使用docker配置redis主从复制，不生效
不生效,解决 原因1:修改 bind 原因2: Slave即的db save失败,因为没有写权限
- boost::asio::io_context类
//有个疑惑: 向io_context对象中提交的任务只能被顺序化的执行. //下面这个构造函数表明可以运行多线程啊..... /** * Construct with a hint about th ...