一、超链接访问后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: 0;
    margin: 0;
    list-style: none;
}

ol {
    padding: 0;
    margin: 0;
    list-style: none;
}

 

posted on 2018-01-02 20:00  minoz  阅读(218)  评论(0编辑  收藏  举报