2014-02-16 113 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; ?>>