Warning: file_get_contents(/data/phpspider/zhask/data//catemap/5/ruby/23.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Css 不透明度文本阴影_Css - Fatal编程技术网

Css 不透明度文本阴影

Css 不透明度文本阴影,css,Css,我可以使用文本阴影不透明度,如下所示: text-shadow: 5px 5px 5px rgba(85,0,0,.5);/* 50% opacity */ 但我无法控制选择颜色值。所以我想这样做: text-shadow: 5px 5px 5px; 这是因为文本颜色可能会有所不同,我希望将文本阴影的颜色应用为与文本颜色相同的颜色 那么,有没有任何技术可以在不选择颜色的情况下为颜色值应用不透明度?如果我理解了您的问题,则文本阴影中的颜色是可选的,它将文本的颜色作为默认颜色,以便您可以使用 t

我可以使用文本阴影不透明度,如下所示:

text-shadow: 5px 5px 5px rgba(85,0,0,.5);/* 50% opacity */
但我无法控制选择颜色值。所以我想这样做:

text-shadow: 5px 5px 5px;
这是因为文本颜色可能会有所不同,我希望将文本阴影的颜色应用为与文本颜色相同的颜色


那么,有没有任何技术可以在不选择颜色的情况下为颜色值应用不透明度?

如果我理解了您的问题,则
文本阴影中的
颜色是可选的,它将文本的颜色作为默认颜色,以便您可以使用

text-shadow: 5px 5px 5px;
color: rgb(85,0,0); // or whatever you need
opacity: 0.5; // or whatever you need

请参见,

是否要遵循此操作?

使用RGB将颜色设置为文本阴影
rgba(红色、绿色、蓝色、不透明度)

更新

p{
颜色:绿色;
字体大小:20px;
文本阴影:0 10px 1px rgba(255,0,0,3)
}

示例文本

以下是使用

  • 为元素指定一个属性:

    <h2 data-text="this is how it works">this is how it works</h2>
    
结果是:

实例 我还提供了一个粗略的示例,说明如何使用javascript/jQuery自动应用此功能

var string=$('h1').text();
$('h1').attr('data-text',字符串)
*{
保证金:0;
填充:0;
}
h1{
颜色:#F00;
字号:5em;
位置:相对位置;
字体大小:正常;
}
氢{
颜色:#F09;
字号:3em;
位置:相对位置;
字体大小:正常;
}
h1:之前,
h2:之前{
内容:attr(数据文本);
位置:绝对位置;
左:3px;
顶部:3px;
不透明度:0.1;
}

给我阴影

这就是它的工作原理
你可以将css不透明度应用于整个文本,尽管如果你想改变文本阴影的不透明度-那么除了使用rgb和alpha通道外,我没有其他已知的方法看到这个css规则的“原型”
text shadow:h-shadow v-shadow blur radius color | none | initial | inherit
,您可能希望按照以下方式编写它以去除颜色:
文本阴影:5px 5px 5px首字母。和文本阴影颜色不透明度?基本上…你不能用CSS做到这一点。您需要javascript或其他创建tetx-shadow的方法。使用过滤器:Alpha(不透明度=50);适用于IE8及之前;-)这将是不透明度的文字颜色不是文字阴影颜色这将是不透明度的文字颜色不是文字阴影颜色这是一个好的。但如果不使用数据文本就可以了。但我希望没有别的办法了。所以,接受这个。非常感谢。
h2:before {
    content: attr(data-text);
    position: absolute;
    left: 3px;
    top: 3px;
    opacity: 0.1;
}