本文介绍了什么do / deep /和:: shadow意味着在CSS选择器?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述 在查看Polymer时,我在Chrome 37开发人员工具的样式标签中看到以下CSS选择器:In looking at Polymer, I see the following CSS selector in the Styles tab of Chrome 37's developer tools: 我也看过一个选择器 / deep / :: shadow 。I've also seen a selector with pseudo selector ::shadow. $ c>和 :: shadow 在CSS选择器中的意思是什么?So, what do /deep/ and ::shadow in a CSS selector mean?推荐答案 HTML5 Web Components提供了CSS样式的完全封装。HTML5 Web Components offer full encapsulation of CSS styles.这意味着: 在页面级定义的样式不会修改该组件自己的样式 但是,有时你想要页面级的规则来操作在其shadow DOM中定义的组件元素的表示。为此,您需要向CSS选择器添加 / deep / 。However sometimes you want to have page-level rules to manipulate the presentation of component elements defined within their shadow DOM. In order to do this, you add /deep/ to the CSS selector. html / deep / [self-end] 正在选择 html self-end 属性,包括隐藏在web组件的shadow DOM根目录中的属性。So in the example shown, html /deep/ [self-end] is selecting all elements under the html (top level) element that have the self-end attribute, including those buried inside web components' shadow DOMs roots. 所选元素居住在阴影根内,则可以使用 :: shadow 伪选择器作为其父元素。If you require a selected element to live within a shadow root, then you can use the ::shadow pseudo selector on it's parent element.请考虑:<div> <span>Outer</span> #shadow-root <my-component> <span>Inner</span> </my-component></div>选择器 html / deep / span 选择< span> 元素。 code>将仅选择内部< span> 元素。 W3C的 CSS Scoping模块规范。 这篇关于什么do / deep /和:: shadow意味着在CSS选择器?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!
10-12 19:03