css id挑选器应用

2021-03-17 22:34 jianzhan

CSS ID 挑选器

在一些层面,ID 挑选器相近于类挑选器,但是也是有1些关键区别。

英语的语法

最先,ID 挑选器前面有1个 # 号 - 也称为旗盘号或井号。请看下面的标准: *#intro {font-weight:bold;} 与类挑选器1样,ID 挑选器中能够忽视通配挑选器。前面的事例还可以创作: #intro {font-weight:bold;} 这个挑选器的实际效果将是1样的。
第2个差别是 ID 挑选器不引入 class 特性的值,没什么疑惑,它要引入 id 特性中的值。下列是1个具体 ID 挑选器的事例: <p id="intro">This is a paragraph of introduction.</p>

类挑选器還是 ID 挑选器?

在类挑选器这1章中大家曾解读过,能够为随意好几个元素特定类。前1章中类名 important 被运用到 p 和 h1 元素,并且它还能够运用到更多元化素。

差别 1:只能在文本文档中应用1次

与类不一样,在1个 HTML 文本文档中,ID 挑选器会应用1次,并且仅1次。

差别 2:不可以应用 ID 词目录

不一样于类挑选器,ID 挑选器不可以融合应用,由于 ID 特性不容许有以空格隔开的词目录。

差别 3:ID 能包括更多含意

相近于类,能够单独于元向来挑选 ID。一些状况下,您了解文本文档中会出現某个特殊 ID 值,可是其实不了解它会出現在哪儿个元素上,因此您想申明单独的 ID 挑选器。比如,您将会了解在1个给定的文本文档中会有1个 ID 值为 mostImportant 的元素。您不知道道这个最关键的物品是1个段落、1个短语、1个目录项還是1个小标题题目。您只了解每一个文本文档都会有这么1个最关键的內容,它将会在任何元素中,并且只能出現1个。在这类状况下,能够撰写以下标准:

#mostImportant {color:red; background:yellow;}

这个标准会与下列各个元素配对(这些元素不可以在同1个文本文档中另外出現,由于它们都有同样的 ID 值):

<h1 id="mostImportant">This is important!</h1>
<em id="mostImportant">This is important!</em>
<ul id="mostImportant">This is important!</ul>

区别尺寸写

请留意,类挑选器和 ID 挑选器将会是区别尺寸写的。这取决于文本文档的語言。HTML 和 XHTML 将类和 ID 值界定为区别尺寸写,因此类和 ID 值的尺寸写务必与文本文档中的相应值配对。因而,针对下列的 CSS 和 HTML,元素不容易变为粗体:

#intro {font-weight:bold;}
<p id="Intro">This is a paragraph of introduction.</p>

因为字母 i 的尺寸写不一样,因此挑选器不容易配对上面的元素。

以上便是本文的所有內容,期待对大伙儿的学习培训有一定的协助,也期待大伙儿多多适用脚本制作之家。