#和。在为一个元素声明一组样式时,在决定使用哪一种样式时使用的语义是什么?
当前回答
#是一个id选择器。它只匹配具有匹配id的元素。 Next样式规则将匹配id属性值为"green"的元素:
#green {color: green}
更多信息请参见http://www.w3schools.com/css/css_syntax.asp
其他回答
就像几乎所有人都已经说过的那样:
“。”表示类,“#”表示ID。
两者的根本区别在于,您可以在页面上反复重用类,而ID只能使用一次。当然,前提是您坚持WC3标准。
如果您有多个具有相同ID的元素,页面仍然会呈现,但是如果/当您尝试通过使用ID调用这些元素来动态更新这些元素时,您将遇到问题,因为它们不是唯一的。
注意ID属性将取代类属性也是有用的。
是的,他们是不同的……
#是一个id选择器,用于瞄准具有唯一id的单个特定元素,但是。是一个类选择器,用于针对具有特定类的多个元素。换句话说:
#foo{}将使用id="foo"属性对单个元素进行样式化 .foo{}将使用class="foo"属性对所有元素进行样式化(你也可以将多个类分配给一个元素,只是用空格分隔它们,例如class="foo bar")
典型的使用
一般来说,你使用#样式化一些你知道只会出现一次的东西,例如,像边栏,横幅区域等高级布局。
类用于样式重复的地方,例如,你为错误消息设置了一个特殊形式的头,你可以创建一个样式h1。错误{},只适用于<h1 class=" Error ">
特异性
选择器的另一个不同之处在于它们的特异性——id选择器被认为比类选择器更具体。这意味着当元素上的样式发生冲突时,使用较特定的选择器定义的样式将覆盖较不特定的选择器。例如,给定<div id="sidebar" class="box"> #sidebar的任意规则,覆盖.box的冲突规则
了解更多关于CSS选择器的知识
查看Selectutorial了解更多关于CSS选择器的入门知识——它们非常强大,如果你的概念只是“#用于div”,那么你最好仔细阅读一下如何更有效地使用CSS。
编辑:看起来Selectutorial可能已经去了天上的大网站,所以试试这个存档链接。
#是一个id选择器。它只匹配具有匹配id的元素。 Next样式规则将匹配id属性值为"green"的元素:
#green {color: green}
更多信息请参见http://www.w3schools.com/css/css_syntax.asp
下面是我解释规则的方法。style和#style是矩阵的一部分。 如果没有正确的顺序,它们就会凌驾于对方之上,或者引起冲突。
这是一条线。
矩阵
#style 0,0,1,0 id
.style 0,1,0,0 class
如果你想覆盖这两个,你可以使用<style></style>女巫有一个矩阵级别或1,0,0,0。 @media查询将覆盖上面的所有内容… 我不确定,但我认为ID选择器#只能在一个页面中使用一次。
同样值得注意的是,在级联中,id(#)选择器比b(.)选择器更具体。因此,id语句中的规则将覆盖class语句中的规则。
例如,如果下面两个语句都是:
.headline {
color:red;
font-size: 3em;
}
#specials {
color:blue;
font-style: italic;
}
应用于相同的HTML元素:
<h1 id="specials" class="headline">Today's Specials</h1>
颜色:蓝色规则将覆盖颜色:红色规则。
推荐文章
- 在输入数字中隐藏上下箭头按钮(旋转器)- Firefox 29
- 如何用CSS“裁剪”一个矩形图像成一个正方形?
- Angular 2:如何为组件的宿主元素设置样式?
- 如何使用jQuery添加' style=display:"block" '到一个元素?
- 为什么在scss/css的文件名前面放“_”或“_”?
- 我可以将CSS样式应用于元素名称吗?
- 我怎么能发送一个内部<div>到它的父<div>底部?
- font-style: CSS中的斜体vs斜体
- 改变引导输入焦点蓝色发光
- 我如何使一个div上的滚动条只在必要时可见?
- CSS:控制项目符号和<li>之间的空格
- 调试打印样式表的建议?
- 为什么我的CSS3媒体查询不能在移动设备上工作?
- 下一个元素的CSS选择器语法是什么?
- 是否有'box-shadow-color'属性?