1. 首页
  2. css

CSS继承父颜色的语音气泡箭头

有趣的问题:
css3语音气泡问题:对于\”三角形\”的边框颜色,如何将其自动设置为其父div的bgcolor?
-Jin Yang(@jzy)2012年2月1日
通过\”css3语音气泡\”,Jin的意思是使用容器上的伪元素添加一个小指针箭头(三角形)。不是真的CSS 3,但那是迂腐的。
。可能是一个用户设置,也可能是它的动态设置。

Setting the container with an inline style is all well and good, but unfortunately there is no inline style for pseudo elements. So we might end up with something like this:
Bummer.
There is a solution though! While we are setting the inline style for the container, we can set an inline style for border-color也是。即使容器实际上没有边框,我们也可以依赖继承将颜色传递给伪元素,伪元素被视为子元素。请注意,我将inherit应用于border-top-color,而不是速记属性border-top。出于某种原因(请随意启发我)inherit不适合速记。还要注意的是,当您用inherit覆盖颜色时,它不会\”继承\”它上面的颜色集(黑色),而是继承它的父级。因此,如果需要默认设置,则需要在父级上设置border-color。
查看演示

CSS继承父颜色的语音气泡箭头 为WP2原创文章,链接:https://www.wp2.cn/css/css%e7%bb%a7%e6%89%bf%e7%88%b6%e9%a2%9c%e8%89%b2%e7%9a%84%e8%af%ad%e9%9f%b3%e6%b0%94%e6%b3%a1%e7%ae%ad%e5%a4%b4/