一、超链接访问后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浏览器兼容性与解决的更多相关文章

  1. 【转】CSS浏览器兼容性与解析问题终极归纳

    1.怪异模式问题:漏写DTD声明,Firefox仍然会按照标准模式来解析网页,但在IE中会触发怪异模式.为避免怪异模式给我们带来不必要的麻烦,最好养成书写DTD声明的好习惯. 2.IE6双边距问题:在 ...

  2. HTML+CSS浏览器兼容性问题

    浏览器兼容问题一:不同浏览器的标签默认的外补丁和内补丁不同 问题症状:随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大. 碰到频率:100% 解决方案:CSS里    ...

  3. 常见CSS浏览器兼容性问题与解决方案【转载自http://blog.csdn.net/chuyuqing/article/details/37561313/】

    所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况.在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们的系统,都应该是统一的 ...

  4. CSS浏览器兼容性问题解决方法总结

    CSS浏览器兼容解决总结如下: 1. CSS中几种浏览器对不同关键字的支持,可进行浏览器兼容性重复定义 !important 可被FireFox和IE7识别 * 可被IE6.IE7识别 _ 可被IE6 ...

  5. 浏览器的兼容性(CSS浏览器兼容性、CSS hack)

    一.关于CSS hack(尽量不用或者少用,减少页面复杂度) 1.条件注释法:(我的测试是IE9及其以下才有效) 这种方式是IE浏览器专有的Hack方式,微软官方推荐使用的hack方式.举例如下 只在 ...

  6. javascript和css浏览器兼容性总结

    一些浏览器的兼容性做一个总结的问题以下: 为什么会出现这样的现象是?主要表现为Firefox这样的良好支持的浏览器W3C标准,这是现在CSS支持最好的浏览器,和ie它比较早出现,在w3c支持一直没有做 ...

  7. CSS浏览器兼容性与解析问题终极归纳

    1.怪异模式问题:漏写DTD声明,Firefox仍然会按照标准模式来解析网页,但在IE中会触发怪异模式.为避免怪异模式给我们带来不必要的麻烦,最好养成书写DTD声明的好习惯. 2.IE6双边距问题:在 ...

  8. CSS浏览器兼容性问题集()两

    11.非常适合    高度适合于被改变时所述内目标高度的外层的高度不能自己主动调节,尤其是排队对象时margin 要么paddign 时. 例:   #box {background-color:#e ...

  9. css 浏览器兼容性问题解决

    一个.!important (功能有限)   随着IE7正确!important支持, !important 方法现在只IE6兼容.(注意措辞.我记得这句话需要推进的位置.)   : #example ...

随机推荐

  1. DocFetcher 本机文件搜索工具

    优点: 支持的文件类型多 全文搜索 可以随时update索引

  2. “更新时间”字段的:ON UPDATE CURRENT_TIMESTAMP 含义

    "更新时间"字段的:ON UPDATE CURRENT_TIMESTAMP 含义: 表示在数据库数据有更新的时候UPDATE_TIME的时间会自动更新(如果数据库数据值没有变化的话 ...

  3. Golang cpu的使用设置--GOMAXPROCS

    以下测试,使用的Go版本是1.8.3 不设置 如果没有调用runtime.GOMAXPROCS 去设置CPU,Golang默认使用所有的cpu核. 测试机器CPU有4个核,测试代码开启4个gorout ...

  4. Go语言加解密--AES简单实践

    AES加解密的简单实现,代码如下. package main import ( "crypto/aes" "crypto/cipher" "encod ...

  5. 自然语言处理工具HanLP被收录中国大数据产业发展的创新技术新书《数据之翼》

    在12月20日由中国电子信息产业发展研究院主办的2018中国软件大会上,大快搜索获评“2018中国大数据基础软件领域领军企业”,并成功入选中国数字化转型TOP100服务商. 图:大快搜索获评“2018 ...

  6. kafka_2.11-0.8.2.1生产者producer的Java实现

    转载自:http://blog.csdn.net/ch717828/article/details/50818261 1. 开启Kafka Consumer 首先选择集群的一台机器,打开kafka c ...

  7. CPS(Cyber-Physical Systems)白皮书-摘选

    <中国制造2025>提出,“基于信息物理系统的智能装备.智能工厂等智能制造正在引领制造方式变革”,要围绕控制系统.工业软件.工业网络.工业云服务和工业大数据平台等,加强信息物理系统的研发与 ...

  8. 信号滤波模块verilog代码---UNLOCK,LOCK状态机方式

    信号滤波模块verilog代码 `timescale 1ns / 1ps /////////////////////////////////////////////////////////////// ...

  9. mysql 1267 error

    CREATE TABLE a (id VARCHAR(32)) DEFAULT CHARSET = utf8 COLLATE utf8_general_ci:INSERT INTO a(id) VAL ...

  10. 1.linux6 x86-64 RPM包安装mysql5.7.20

    注意版本和此次更新时间 2017-12-03  版本:mysql-5.7.20-1.el6.x86_64  环境:linux6.x ​官方下载地址: wget https://dev.mysql.co ...