CSS3 结构性伪类选择器—not，十天精通CSS3教程-慕课网

CSS3 结构性伪类选择器—not

:not选择器称为否定选择器，和jQuery中的:not选择器一模一样，可以选择除某个元素之外的所有元素。就拿form元素来说，比如说你想给表单中除submit按钮之外的input元素添加红色边框，CSS代码可以写成：

form {
  width: 200px;
  margin: 20px auto;
}
div {
  margin-bottom: 20px;
}
input:not([type="submit"]){
  border:1px solid red;
}

相关HTML代码：

<form action="#">
  <div>
    <label for="name">Text Input:</label>
    <input type="text" name="name" id="name" placeholder="John Smith" />
  </div>
  <div>
    <label for="name">Password Input:</label>
    <input type="text" name="name" id="name" placeholder="John Smith" />
  </div>
  <div>
    <input type="submit" value="Submit" />
  </div>
</form>

演示结果：

任务

在CSS编辑器的第五行输入代码，除页脚”div#footer”之外的所有div设置橙色背景色。

?不会了怎么办: not标签是否书写正确

问答
评论
笔记
代码

全部精华我要发布

一个not选择器只能选择一个吗

已采纳回答 / 慕无忌3374468

不是,此例中not选择的是id不为footer的div元素

1 回答 1747 浏览

2017-11-15

not 选择器如何兼容ie8?

最新回答 / 慕数据0028241

不需要兼容吧，IE本身支持这个选择器的吧

2 回答 1551 浏览

2018-03-04

第六行什么意思？

已采纳回答 / qq_狂客_0

引用css样式在其他课程有具体介绍关于新建css，或者在html加<style><style/>或者直接加样式

5 回答 1525 浏览

2022-03-25

.css代码问题

最赞回答 / 前端小白多多关照

内联标签里面加style=""；外联css文件用<link>标签导入在html文件head标签中加入<style></style>标签完成；祝：新年快乐，前程似锦

5 回答 844 浏览

2020-07-02

怎么not 两个以上的id？用逗号隔开么？

已采纳回答 / chenjs

id是唯一的，只可以用一次，相当于人的身份证号，在这里可以用class，两个button都用相同的class=“not”就可以一起控制了。

3 回答 1300 浏览

2022-08-09

可以写not:first-child吗？

+ 我来回答回答最高可+2积分

2 回答 4798 浏览

2022-04-20

css hack功能?

最赞回答 / 小灰灰heart

因为不同的浏览器解析和渲染页面的最终效果不同，为了达到在不同浏览器下页面的效果相同，就采用css hack使页面效果达到相同的结果。CSS hack是一种类似作弊的手段，以欺骗浏览器的方式达到兼容的目的，是用浏览器的兼容性差异来解决浏览器的兼容性问题。参考css hack讲解，不同浏览器的css hack

2 回答 1182 浏览

2022-07-15