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 ...
随机推荐
- Jmeter --- 组件执行顺序与作用域
一.Jmeter重要组件: 1)配置元件---Config Element: 用于初始化默认值和变量,以便后续采样器使用.配置元件大其作用域的初始阶段处理,配置元件仅对其所在的测试树分支有效,如,在同 ...
- mysql程序之mysqladmin详解
mysqladmin命令 mysqladmin是执行管理操作的客户端.您可以使用它来检查服务器的配置和当前状态,以创建和删除数据库等 用法: mysqladmin [OPTIONS] command ...
- CentOS6.4 添加php-fpm系统服务
简介: php-fpm安装完成后默认不会注册为系统服务,所以需要手工添加系统服务脚本.在/etc/init.d目录下新建php-fpm文件,并更改权限其即可. 1.检测/usr/local/php/v ...
- 数据科学VS机器学习
数据科学是一个范围很广的学科.机器学习和统计学都是数据科学的一部分.机器学习中的学习一词表示算法依赖于一些数据(被用作训练集)来调整模型或算法的参数.这包含了许多的技术,比如回归.朴素贝叶斯或监督聚类 ...
- ML: 降维算法-概述
机器学习领域中所谓的降维就是指采用某种映射方法,将原高维空间中的数据点映射到低维度的空间中.降维的本质是学习一个映射函数 f : x->y,其中x是原始数据点的表达, y是数据点映射后的低维向量 ...
- Excel技巧--漏斗图让转化率直观明了
当要实现如上图那样表现转化率等漏斗形图表时,可以这么做: 1.选择表格,点击“插入”-->“二维条形图”-->堆积条形图类型: 2.点击选中图表,点击”设计“-->“选择数据”: 将 ...
- iwebshop (: Cannot use object of type stdClass as array in)
今天在PHP输出一个二维数组的时候,出现了“Fatal error: Cannot use object of type stdClass as array in……”. 这个二维数组是这样的: Ar ...
- TreeView添加图片
实现方式一: 通过代码方式实现如下所示: private string FilePath = Application.StartupPath + "\\Images\\"; Ima ...
- GitHub版本控制入门(新手学习)
要使用GitHub功能,首先要登陆官方网站https://github.com,注册GitHub账号. 在浏览器中的操作: 新建一个仓库.一个项目一旦被Git控制了版本历史,在GitHub上就有另外一 ...
- 在windows server 2012上安装.net3.5
1.dism.exe /online /enable-feature /featurename:NetFX3 /Source:D:\sources\sxs /all 2.Start the Local ...