如何样式化 CSS 角色

小开

最佳答案

使用 CSS 属性选择器:

例如:

div[role=main]

小开

像这样访问它应该可以工作: #content[role="main"]

小开

当然你可以这样做:

 #content[role="main"]{
//style
}

小开

学习 CSS 属性选择器

小开

请使用:

 #content[role=main]{
your style here
}

小开

编写访问特定 div 的选择器的最短方法是简单地使用

[role=main] {
/* CSS goes here */
}

前面的答案并没有错，但是它们依赖于您使用 div 或者使用特定的 id。使用这个选择器，您将能够拥有各种疯狂的标记，而且它仍然可以工作，并且您可以避免特定性方面的问题。

[role=main] {
background: rgba(48, 96, 144, 0.2);
}
div,
span {
padding: 5px;
margin: 5px;
display: inline-block;
}

<div id="content" role="main">
<span role="main">Hello</span>
</div>

小开

我们可以利用

 element[role="ourRole"] {
requried style !important; /*for overriding the old css styles */
}