當鼠標移過選定的選項卡時，需要更改背景。怎麼樣？

我希望標籤選項卡與鼠標懸停時的搜索選項卡具有相同的背景，我該怎麼做？當鼠標移過選定的選項卡時，需要更改背景。怎麼樣？

我有搜索選項卡已經有一個默認的背景，但當點擊標籤時我怎麼能得到相同的背景是在搜索出現在標籤？

HTML：

<html> 
<head> 

<link href="arg.css" rel="stylesheet" type="text/css" /> 

</head> 
<body> 


<div class="tab-item tab-selected" id="search-box"> 
Search 
</div> 
<div class="tab-item" id="tag-box"> 
Tags 
</div> 

</body> 
</html>

CSS：

.tab-item { 
-moz-border-radius: 10px; 
border-radius: 10px; 
font: 14px helvetica; 
color: #000; 
height: 20px; 
float: left; 
margin: 5px 5px 5px 5px; 
    padding: 5px 5px 5px 5px; 
position: relative; 
width: 75px; 
} 

.tab-mouseover { 
background: #bdbdbd; 
} 

.tab-selected { 
background: #c0c0c0; 
}

來源

2011-10-11 James

使用hover CSS僞類

http://jsfiddle.net/mrtsherman/7FvR5/

tab-item:hover {  background: #c0c0c0; }

來源

2011-10-11 18:49:17 mrtsherman

非常感謝！順便說一句我不是最好的CSS ..我如何將兩個標籤旁邊的CSS在中心彼此對齊？當我將對齊方式更改爲中心時，將一個選項卡放在另一個選項卡上 – James

沒問題。使用'margin：0 auto;'以及指定的'width.' http://jsfiddle.net/mrtsherman/7FvR5/1/ – mrtsherman

無法添加由於我的代表低，但我想說的是，現在你所做的只是創建一個名爲「tab-mouseover」的類，其背景爲#bdbdbd。如果你將這個類應用到一個元素，它將只有一個#bdbdbd的背景。它實際上並不意味着當您將鼠標懸停時它會改變顏色。

請注意名稱的類可以是任何東西。然而，爲了達到你想要的效果，你需要做一下mrtsherman提到的事情（除了將背景顏色改爲：「#bdbdbd」）。

來源

2011-10-11 19:22:49 starwarspunk

當鼠標移過選定的選項卡時，需要更改背景。怎麼樣？

回答

相關問題