如何选择<li>作为锚元素直接父元素的元素?
在示例中,我的CSS将是这样的:
li < a.active {
property: value;
}
Run Code Online (Sandbox Code Playgroud)
显然有一些方法可以使用JavaScript来实现这一点,但我希望CSS Level 2本身存在某种解决方法.
我尝试设置样式的菜单正在由CMS喷出,因此我无法将活动元素移动到<li>元素...(除非我主题菜单创建模块,我宁愿不这样做).
有任何想法吗?
CSS类选择器中允许使用哪些字符/符号?我知道以下字符无效,但哪些字符有效?
~ ! @ $ % ^ & * ( ) + = , . / ' ; : " ? > < [ ] \ { } | ` #
Run Code Online (Sandbox Code Playgroud) 我有一堆带有类名的元素red,但我似乎无法class="red"使用以下CSS规则选择第一个元素:
.red:first-child {
border: 5px solid red;
}Run Code Online (Sandbox Code Playgroud)
<p class="red"></p>
<div class="red"></div>Run Code Online (Sandbox Code Playgroud)
这个选择器有什么问题,我该如何纠正?
感谢这些评论,我发现该元素必须是其父母的第一个孩子才能被选中,这与我的情况不同.我有以下结构,这条规则失败,如评论中所述:
.home .red:first-child {
border: 1px solid red;
}Run Code Online (Sandbox Code Playgroud)
<div class="home">
<span>blah</span>
<p class="red">first</p>
<p class="red">second</p>
<p class="red">third</p>
<p class="red">fourth</p>
</div>Run Code Online (Sandbox Code Playgroud)
我怎样才能让第一个孩子上课red?
搜索~角色并不容易.我正在查看一些CSS并找到了这个
.check:checked ~ .content {
}
Run Code Online (Sandbox Code Playgroud)
这是什么意思?
我有一个div包含几个ul标签的标签.
我ul只能为第一个标签设置CSS属性:
div ul:first-child {
background-color: #900;
}
Run Code Online (Sandbox Code Playgroud)
但是,我以下尝试为ul除第一个标记之外的其他标记设置CSS属性不起作用:
div ul:not:first-child {
background-color: #900;
}
div ul:not(:first-child) {
background-color: #900;
}
div ul:first-child:after {
background-color: #900;
}
Run Code Online (Sandbox Code Playgroud)
我怎么能写CSS:"每个元素,除了第一个"?
例如:
p + p {
/* Some declarations */
}
Run Code Online (Sandbox Code Playgroud)
我不知道是什么+意思.这与仅定义p没有的风格有什么区别+ p?
我正在尝试选择除了和之外input的所有元素.typeradiocheckbox
很多人已经表明你可以放入多个参数:not,但是使用type似乎无论如何都没有用到我试试.
form input:not([type="radio"], [type="checkbox"]) {
/* css here */
}
Run Code Online (Sandbox Code Playgroud)
有任何想法吗?
我有这些我正在设计的div .tocolor,但我还需要唯一的标识符1,2,3,4等,所以我将它添加为另一个类tocolor-1.
<div class="tocolor tocolor-1"> tocolor 1 </div>
<div class="tocolor tocolor-2"> tocolor 2 </div>
<div class="tocolor tocolor-3"> tocolor 3 </div>
<div class="tocolor tocolor-4"> tocolor 4 </div>
.tocolor{
background: red;
}
Run Code Online (Sandbox Code Playgroud)
有没有办法只有一个班级tocolor-*.我尝试使用*这个css中的通配符,但它没有用.
.tocolor-*{
background: red;
}
Run Code Online (Sandbox Code Playgroud) 我想编写一个CSS选择器规则,选择所有没有特定类的元素.例如,给定以下HTML:
<html class="printable">
<body class="printable">
<h1 class="printable">Example</h1>
<nav>
<!-- Some menu links... -->
</nav>
<a href="javascript:void(0)" onclick="javascript:self.print()">Print me!</a>
<p class="printable">
This page is super interresting and you should print it!
</p>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我想编写一个选择器来选择所有没有"可打印"类的元素,在这种情况下,它是nav和元素.
这可能吗?
注意:在我想要使用它的实际HTML中,将会有更多的元素没有 "可打印"类而不是(我在上面的例子中意识到它是另一种方式).