嵌入式CSS不會覆蓋鏈接樣式表中的CSS

我想覆蓋鏈接的背景和字體顏色。嵌入式CSS不會覆蓋鏈接樣式表中的CSS

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"/> 
<link href="index.css" rel="stylesheet"/> 
<style> 
#abc{ 
    background:#ffffff; // doesn't work 
    color:#008080; // doesn't work 
} 
</style> 
</head> 

<body> 
<?php include 'inc/menum.php';?>

menum.php

<div id="divL"> 
<a href='abc.php' id='abc'>ABC</a> 
<a href='universe.php' id='universe'>UNIVERSE</a> 
<a href='strel.php' id='strel'>STREL</a> 
</div>

index.css

#divL a{ 
background:#008080;  // works  
color:#ffffff; // works  
}

來源

2013-09-30 bonaca

http://www.w3.org/TR/CSS21/cascade.html#specificity – CBroe

解決，謝謝大家！ – bonaca

你有一個特殊性的問題。

#divL a選擇器比#abc更具體。

你可以很容易地使用#divL #abc，這將使嵌入式規則更具體。

來源

2013-09-30 11:06:22

使用background-color和:link

#abc{ 
    background-color :#fff; 

} 
#abc:link { 
    color:#008080; 
}

代替。 :link在這裏是適當的子類。顏色只會更改<div>的一般顏色，例如未錨文本內容..

來源

2013-09-30 11:06:25 davidkonrad

在這種情況下，你必須使用!important

#abc{ 
    background:#ffffff !important; 
    color:#008080 !important; 
}

來源

2013-09-30 11:07:05 RiKo

'！important'不是必需的，只是讓選擇器更具體。過度使用'！important'會導致難以維護的樣式表，特別是對於複雜的規則集。 –

+1 ...是的，使用更具體的選擇器也方法。我贊同你。 – RiKo

呀！你曾經說過，#divL a{....}的作品，因爲它是通過選擇父DIV選擇更專一，如果你不能只是#abc{....}覆蓋，那麼你可以把！重要的最後這樣

#abc{ 
    background:#ffffff !important; 
    color:#008080 !important; 
}

即使它不工作，你應該通過選擇更特異的div嘗試是你必須聲明#divL a是工作

，如果任何時候如果選擇連父DIV不工作，那麼你可以使用體選擇這樣

body #abc{ 
    background:#ffffff; 
    color:#008080; 
}

此外，如果你想設置，則背景顏色使用background-color比background

來源

2013-09-30 11:07:35

'！important'不是必需的，只是讓選擇器更具體。過度使用'！important'會導致難以維護的樣式表，特別是對於複雜的規則集。 –

使用!important強制瀏覽器給這個值優先

例如一個提示你background-color: red !important;

來源

2013-09-30 11:09:01

嵌入式CSS不會覆蓋鏈接樣式表中的CSS

回答

相關問題