我是HTML / CSS的新手,我试图将一些文本显示为50%透明。到目前为止,我有HTML来显示完全不透明的文本
<html><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></html>
但是,我不确定如何改变它的不透明度。我试过在线查看,但我不确定如何处理我找到的代码。
检查Opacity,您可以将此css属性设置为div,<p>
或使用<span>
您想要透明
顺便说一下,字体标签是deprecated,使用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);
}
您最好的解决方案是查看元素的“不透明度”标记。
例如:
.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属性,如background-opacity,你只能用它来改变元素背景的不透明度或透明度而不影响子元素,另一方面,如果你试图使用CSS opacity属性,它不仅会改变背景的不透明度,但也改变了所有子元素的不透明度。在这种情况下,您可以使用CSS3中引入的RGBA颜色,其中包括Alpha透明度作为颜色值的一部分。使用RGBA颜色,您可以设置背景的颜色及其透明度。
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>
作为附加信息,我当然建议您在html元素之外使用CSS声明,但是也尝试使用字体css样式而不是字体html标记。
对于跨浏览器的css3样式生成器,请查看http://css3please.com/