当涉及到CSS时,<div class="">和<div id="">之间有什么区别?是否可以使用<div id="">?
我看到不同的开发人员用这两种方式来做这件事,因为我是自学的,所以我从来没有真正弄清楚。
当涉及到CSS时,<div class="">和<div id="">之间有什么区别?是否可以使用<div id="">?
我看到不同的开发人员用这两种方式来做这件事,因为我是自学的,所以我从来没有真正弄清楚。
当前回答
1) div id不可重用,只能应用于HTML的一个元素,而div类可以添加到多个元素中。
2)一个id更重要,如果两者都应用于同一个元素,并且有冲突的样式,id的样式将被应用。
3) Style元素总是引用div类。(点)在他们的名字前面,而div id类是通过在他们的名字前面放一个#(哈希)来引用的。
4)举例:-
<style>声明- .red-background {background-color:红色;} 在<style>声明- #blue-background {background-color:蓝色;} <div class="red-background" id="blue-background">Hello</div> 这里的背景将是蓝色的
其他回答
id在整个页面中必须是唯一的。
一个类可以应用于许多元素。
有时候,使用id是个好主意。
在一个页面中,你通常有一个页脚,一个页眉…
然后页脚可以是一个带有id的div
<div id="footer" class="…"" >
而且还有课
在CSS中,类选择器是一个以句号(“.”)开头的名称,ID选择器是一个以散列字符(“#”)开头的名称。ID和类之间的区别是,ID可以用来标识一个元素,而类可以用来标识多个元素。
CSS是面向对象的。ID表示实例,class表示类。
在应用CSS时,将其应用于类,并尽量避免应用于id。ID只能在JavaScript中用于获取元素或任何事件绑定。
应该使用类来应用CSS。
有时必须使用类进行事件绑定。在这种情况下,尽量避免使用用于应用CSS的类,而是添加没有相应CSS的新类。当你需要更改任何类的CSS或更改任何元素的CSS类名时,这将会有所帮助。
CSS选择器空间实际上允许有条件id样式:
h1#my-id {color:red}
p#my-id {color:blue}
将按预期渲染。你为什么要这么做?有时id是动态生成的,等等。进一步的用途是基于高级ID赋值来呈现不同的标题:
body#list-page #title {font-size:56px}
body#detail-page #title {font-size:24px}
就个人而言,我更喜欢较长的类名选择器:
body#list-page .title-block > h1 {font-size:56px}
因为我发现使用嵌套的id来区分治疗有点反常。只要知道,当Sass/SCSS领域的开发人员得到这些东西时,嵌套id正在成为常态。
最后,当涉及到选择器性能和优先级时,ID往往会胜出。这完全是另一个主题。