2014-02-16 173 views
-1

我在嘗試但無法通過CSS更改文本的顏色無法更改顏色CSS

這裏是我的css代碼。

.donfont1 
{ 
margin: 0.8em 0 0.5em 0;  
color:#00ff00; 
font-weight: 600;  
font-family: 'Titillium Web', sans-serif; 
font-size: 16px;  
line-height: 20px;  
counter-increment: section-1;  
counter-reset: section-2 section-3 section-4; 
position: relative; 
text-align:center; 
} 

.leaf { 
list-style-type: none; 
background: url('images/feature.png') no-repeat top left; 
height: 46px; 
text-align:center; 
} 

這裏是HTML代碼

<li class="leaf"> 
<p class="donfont1"> 
<a href=productdetails.php?url=<?php echo $friendlyurlget;?>> 
<?php echo $propertytitle; ?> 
</a> 
</p> 
</li> 

請幫我謝謝

+5

顯示你的HTML,給我們一個小提琴。 – Ranveer

+0

現在在那裏...... – Reel

+0

您的規則很可能被'a'元素上的樣式設置覆蓋。 – Nit

回答

1

將一個text-decoration:none添加到您的錨標記。默認情況下,color未應用於錨標記,並且它保持藍色。

這是你修改HTML:

<li class="leaf"> 
<p class="donfont1"> 
<a style="text-decoration:none; color:#00ff00;" href=productdetails.php?url=<?php echo $friendlyurlget;?>> 
<?php echo $propertytitle; ?> 
</a> 
</p> 
</li> 

如果你想反覆使用,其納入你的類。

+0

類不工作 – Reel

+0

內聯樣式工作正確嗎? – Ranveer

+0

嘗試使用'Text'或嘗試將整個東西封裝在'div'中。 – Ranveer

3

如果您不能更改字體,那麼無論是元素有一個內聯樣式(在這種情況下,你會想將內聯樣式移到CSS中定義),或者您有一個特定問題(在這種情況下,您需要一個具有更高特異性的選擇器)。如果您在Chrome中打開您的網站並使用Chrome開發人員工具,它應該會顯示哪些樣式已應用到該元素以及哪些樣式正在被其他規則替換(這可以幫助您追蹤排除規則,如果它是特異性問題)。

更新
現在,您所提供的示例代碼中,問題是<一個>標籤有它自己的瀏覽器的默認樣式。您應該添加一個類到<a>標籤,並使用它來指定您的自定義顏色(您也可以爲「:hover」和「:active」狀態添加自定義樣式)。例如:

/* css */ 
.product-details { 
    color:#00ff00; 
} 

<!-- html --> 
<a class="product-details" href="productdetails.php?...">...</a> 
+0

我認爲你錯了。他爲'p'元素定義顏色,但不是爲所包含的'a'元素定義顏色,這實際上是唯一的內容/子元素。 – Netsurfer

+0

當我發佈我的答案時,OP還沒有發佈他的代碼。同意。 –

+0

好的,我明白了! ;-) – Netsurfer

0

如果不想調試,可以使用color:color_code!important;

+0

!重要的是會增加css屬性的優先級 –

+1

這種方式很有效,但這是一個非常難看的解決方案,我不推薦這樣做。 (雖然我已經犯了幾次,我自己)。 –

+0

是的,你是正確的使用只在最壞的情況下,當你沒有控制你的內聯css –

0

您可以在p元素中定義文本的文本顏色。實際上,您的p元素的唯一內容是作爲子元素的鏈接a元素。

鏈接元素具有由瀏覽器(用戶代理)樣式表定義的默認顏色。

因此,您必須定義elements的顏色,例如像這樣:

a { 
    color: #0F0; 
    text-decoration: none; /* if you do not want your links to be underlined */ 
} 

a:visited { 
    color: #FF0; 
} 

a:hover { 
    color: #FFF; 
} 

a:active { 
    color: #0FF; 
} 

注意到a元素的不同僞類。您的CSS中的順序非常重要。

順便說一句:我想你的HTML代碼也有錯誤!
應該是:

<a href="productdetails.php?url=<?php echo $friendlyurlget;?>" <?php echo $propertytitle; ?>>