1

これが本当に Google Chrome のバグかどうかはわかりませんが、次のようになります。

a:linkクラスで疑似クラスをネストすると、ページ内のa:visitedすべての<a>要素がネストで設定された最新の色を取得します。color プロパティでのみ発生します。他のブラウザでは起こらず、Google Chrome 30.0.1599.69mを使用しています

CSS:

.cat ul{
    list-style-type:none;
    margin-top:10px;
    padding-left:10px;
}

.cat a:link, a:visited {
    margin-top: 3px;
    font:15px arial,sans-serif;
    display:block;
    color:#000000;
    text-align:left;
    text-decoration:none;
}

.cat a:hover,a:active {
    background-color: #eeeeee;
}



.menu ul {
    list-style-type:none;
    margin:0;
    padding:0;
    overflow:hidden;
}

.menu li {
    float:left;
}

.menu a:link,a:visited {
height:35px;
padding-top:8px;
    display:block;
    width:120px;
    font-weight:bold;
    color:#FFFFFF;
    background-color:#2d0000;
    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
}

.menu a:hover,a:active {
    background-color:#7A991A;
}

HTML:

<html>
<head>
<title>TITLE</title>
</head>
<link href="style.css" rel="stylesheet" type="text/css" media="all" />
<body>
<div id="wrapper">
    <div id="site">

            <div id="header">
                <div id="logo"><img src="./img/logo.png" /></div>
                <div id="cart"></div>
            </div>
            <div id="subheader">
                <div id="menu" class="menu">
                    <ul>
                        <li><a href="#home">Home</a></li>
                        <li><a href="#news">News</a></li>
                    </ul>
                </div>
                <div id="searchbar">
                    <form>
                        <input type="text" name="search" /> <input type="submit" name="ok" value="Search" />
                    </form>
                </div>
            </div>
        <div id="body">
            <div id="category" class="cat">
                <ul>
                    <li><a href="#home">Home</a></li>
                    <li><a href="#news">News</a></li>
                    <li><a href="#contact">Contact</a></li>
                    <li><a href="#about">About</a></li>
                </ul>
            </div>
            <div id="main">
                <a>Test</a>
            </div>
        </div>
        <div id="footer"></div>
    </div>
</div>
</body>
</html>
4

1 に答える 1

1

ここでは.cat a:link、すべてa:visitedを黒色に設定します-すべての a.catとすべての a の穴 cssa:visitedは黒に設定されています..

.cat a:link, a:visited {
    .....
}

ここでは.menu a:linkとa:visited白に設定します。すべてa:visitedが白くなります... .menuだけではありません...

.menu a:link,a:visited {
.....
}

私はあなたが間違っていると思います.cat a:link, a:visited- それはあるべきです.cat a:link, .cat a:visited。同じ間違い.menu a:link, a:visited- これは.menu a:link, .menu a:visited

于 2013-10-14T08:41:04.360 に答える