Css 使用相对于子元素的单位继承文本阴影,而不选择所有子元素
我想为元素创建一个文本阴影,并希望该元素的所有子元素继承该阴影。问题是继承的文本阴影的相对单位(即em、ex、ch)与创建该阴影的元素(即父元素)的计算字体大小(即:em、ex、ch)有关 而且,我明白这一点Css 使用相对于子元素的单位继承文本阴影,而不选择所有子元素,css,Css,我想为元素创建一个文本阴影,并希望该元素的所有子元素继承该阴影。问题是继承的文本阴影的相对单位(即em、ex、ch)与创建该阴影的元素(即父元素)的计算字体大小(即:em、ex、ch)有关 而且,我明白这一点 parent, parent * { text-shadow: 1em 2em 3em currentColor; } 可以正常工作,但我希望避免使用*选择器。我不想选择每一个子元素,但更重要的是,我不想弄乱特殊性 (如何)这是可能的?(我无法发表评论,因为有50个评论点的限制,
parent, parent * {
text-shadow: 1em 2em 3em currentColor;
}
可以正常工作,但我希望避免使用*
选择器。我不想选择每一个子元素,但更重要的是,我不想弄乱特殊性
(如何)这是可能的?(我无法发表评论,因为有50个评论点的限制,因此答案选项卡中的问题&一个可能的解决方案,我将根据答案更新:p)
所以@uber5001,
问题1:为了清楚起见,您是否选择了所有子元素?您说过的第一行,您希望选择所有子元素。在问题的最后,您说,您不想选择父元素的所有子元素。对不起,我不明白你的意思
在您在评论中提供的JSFIDLE中,添加text shadow:5em 0em 0em#999
到#父p:第一个孩子
会产生所需的效果。
我相信你也在试图实现同样的目标?
请告诉我细节,这样我可以更新我的答案
编辑:
由于您希望规则应用于每个子元素,因此我可以这样想:
使用#父p:n子(n){
文本阴影:5em 0em 0em#999;
}
希望有帮助:)还有其他约束吗?类似的约束吗?不。阴影是继承的,但单位与子项的
字体大小不相关。关于文本阴影:5rem 0rem 0rem#999代码>那也不行。我的想法是在父级上设置一个文本阴影,其子级的阴影会随着字体大小的增大或缩小而增大或缩小。我不认为您可以按照自己的方式继承文本阴影(text shadow:inherit
保留父级的设置)。您可以使用parent,parent>*
仅选择直接子级,但我知道仍然使用通用选择器。可能有js解决方案。我知道我可以达到预期的效果,但我希望在每次字体更改时不使用额外的CSS,也不使用*
选择器,因此在嵌套这些CSS规则时,我不必担心特殊性。最后,是的,我需要选择所有要使用的子项inherit
。我这样做是因为我想要inherit
提供的便利。然而,在这种改变字体大小的情况下,这样做似乎是不可能的。