The ingenious use of selector in CSS design

ID is used to identify the unique element of the page, the name of the ID is the means to control a piece of content, by placing a block of content in the div and giving it a unique ID, you can use a CSS selector to precisely define the appearance of each page element, including a title, list, picture, link, or paragraph, and so on. For example, if you write a CSS rule for #header, it can be completely different from the #content picture rules.

You can define link styles in different pieces of content through different rules. Like this: #nav a:link or #main a:link or #footer a:link. You can also define styles for the same elements in different content blocks. For example, the styles of #main p and #sider p are defined by #main p and #sider p respectively. Structurally, your page is made up of pictures, links, lists, paragraphs, and so on, and these elements don't have any effect on what network devices (PDAs or mobile phones or network TVs) are displayed, and they can be defined as any appearance of appearances.

A carefully structured HTML page is very simple, and each element is used for structural purposes. When you want to indent a paragraph, you don't need to use the blockquote tag, just use the P tag, and add a CSS text-indent rule to p to achieve indentation. P is a structured label, Text-indent is the performance attribute, the former belongs to HTML, the latter belongs to CSS. (This is the legendary separation of structure and performance)

Well structured HTML pages have almost no label for performance attributes. The code is very clean and concise. For example, the original code <table width= "778" cellpadding= "3" border= "0" align= "center", which can now be written only in HTML <table id= "Mrjin"; Everything that controls performance is written into CSS, and in structured HTML the table is a table, not something else (not to be used for layout and positioning).

Of course, CSS selectors are not just that simple, except for the ID and class as well as the descendant selector, the attribute selector, and so on.