5

ホバーする前にすべての要素のスタイルを設定しようとしています(左側から)。

これが私のコードです：jsFiddle

[CSS]:

a,
a:link,
a:hover,
a:visited {
    /* ... */
    color: #222;
}

a:hover, 
a:hover ~ a {
    color: #f00;
}

[HTML]:

<a href="#">text1|</a>
<a href="#">text2|</a>
<a href="#">text3|</a>

私がやったのは、右側から（要素をホバーした後）ホバリングすることだけですが、左側からそれをしたいです。

4

2 に答える 2

5

html と css を少し変更するだけで、要件を満たすことができます。

HTML:

<div><a href="#">this/</a><a href="#">line/</a><a href="#">is/</a><a href="#">hovering/</a><a href="#">from/</a><a href="#">left/</a><div>

CSS:

a,
a:link,
a:hover,
a:visited,
div {
    text-decoration: none;
    font-size: 14pt;
    background: #def;
    color: #222;
}
div:hover a{
    color: #f00;
}
a:hover ~ a {
    color: #222;
}

jsフィドル

于 2013-08-14T18:06:27.737 に答える
1

すべての要素に異なるスタイルを適用しますか?

n番目の子セレクターで要素を選択できます。

例：

a:nth-child(1){}
a:first-child+a{} or a:nth-child(1) + a /* Second Element */
a:last-child{} /*select last child, Works in ie8+, webkit, moz, o */
于 2013-08-14T17:57:28.940 に答える