如何更改html / css中的文字透明度?
我很新的HTML / CSS,我试图显示一些文字,如50%透明。 到目前为止,我有HTML来显示完全不透明的文本
<html><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></html>
但是,我不知道如何改变其不透明度。 我已经尝试在网上查找,但我不确定如何处理我find的代码。 有人可以帮忙吗? 谢谢!
检查不透明度 ,您可以将此CSS属性设置为div, <p>
或使用<span>
您要透明
顺便说一下,字体标记已被弃用 ,使用CSS来设置文本的样式
div { opacity: 0.5; }
编辑:这个代码将使整个元素透明,如果你想**只是文本**透明的检查@Mattias Buelens答案
opacity
适用于整个元素,所以如果您对该元素有背景,边框或其他效果,则这些元素也将变为透明。 如果您只希望文本透明,请使用rgba
。
#foo { color: #000; /* Fallback for older browsers */ color: rgba(0, 0, 0, 0.5); font-size: 16pt; font-family: Arial, sans-serif; }
另外,远离<font>
。 我们现在有CSS。
只需使用rgba
标签作为文本颜色。 你可以使用opacity
,但这会影响整个元素,而不仅仅是文本。 假设你有一个边界,那么它也会变得透明。
.text { font-family: Garamond, serif; font-size: 12px; color: rgba(0, 0, 0, 0.5); }
你最好的解决scheme是看一个元素的“不透明”标签。
例如:
.image { opacity:0.4; filter:alpha(opacity=40); /* For IE8 and earlier */ }
所以在你的情况下,它应该看起来像这样:
<html><span style="opacity: 0.5;"><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></html>
但是不要忘了HTML5中不支持该标签。
你应该使用CSS也:)
简单! 在你的:
<font color=\"black\" face=\"arial\" size=\"4\">
添加这一个:
<font style="opacity:.6">
您只需要将“.6”更改为1到0之间的一个十进制数
怎么样的CSS opacity
属性? 0
到1
值。
但是,你可能需要使用比“font”更明确的dom元素。 例如:
<html><body><span style=\"opacity: 0.5;\"><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></span></body></html>
作为一个额外的信息,我当然会build议你在你的html元素之外使用CSS声明,但也可以尝试使用字体CSS样式而不是字体html标签。
对于跨浏览器的css3样式生成器,请看http://css3please.com/
没有像background-opacity这样的CSS属性,只能用于更改元素背景的不透明度或透明度而不影响子元素,另一方面,如果您尝试使用CSS不透明度属性,则不仅会更改不透明的背景,但也改变了所有子元素的不透明度。 在这种情况下,您可以使用CSS3中引入的RGBA颜色,将alpha透明度作为颜色值的一部分。 使用RGBA颜色,您可以设置背景的颜色以及透明度。