可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效,请关闭广告屏蔽插件后再试):
问题:
I was just looking at my CSS and the h1 tag is defined like this:
h1 { .... }
When everything else either has an id "#" or a "." class preceding it. What is the reason header tags don't need this? Have I infact made a mistake and they do need one?
回答1:
This means that all occurences of h1 will share the same style. Similarly, you can have a style defined for any other element, e.g.:
p { font-family: Helvetica; }
That means all p tags will use the Helvetica font.
Note that it's also a best practice to have just one h1 element in a page.
You can find a brief overview what different types of selectors mean here.
回答2:
It's said in the doc:
5.4 Type selectors
A type selector matches the name of a document language element type. A type selector matches every instance of the element type in the document tree.
So any valid element may be selected just by specifying its name. It also works in more complex selectors, by the way.
回答3:
Its not just header tags. All elements are "selected" simply by their name alone. '#' is used to "select" by id and "." is used to "select" by class.
回答4:
The idea is not that the "h1" tag does not need to have "class or id". It can have a class or id just like other tags. It is just up to you, and how you use it. As mentioned in other answers if you want to apply a specific style to all your h1, then you will have it without a class and your CSS would be: h1{...}
But if you want to use specific styles to each "h1" tag you have, then you can use a class attribute to identify each one "h1", see the following example:
Let's say you have two "h1" tags in your HTML code and you want to style each one with a different color, then you can do the following:
HTML:
<h1 class="first-header">Hello World1</h1> <h1 class="second-header">Hello World2</h1>
CSS:
h1.first-header{color:red;} h1.second-header{color:blue;}
This will display your first h1 in red color and the second in blue.