Myth 1. Polyp syndrome

Copy after login

The above situation of using redundant p tags is called "Polyp syndrome" should be simplified to the following

 Home
 About
 Concact

Copy after login

Misunderstanding 2. Multi-classclasssyndrome Note that class can be applied to any number of elements on the page, which is very suitable for identification Content type or other similar items
A piece of news (news title, news details)

Elastic Layout Example—View Source for the HTML and CSS

Lorem ipsum dolor sit amet. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Copy after login

The above class names are called "## if they use news-head and news-text. #Multi-category syndrome"Performance, there is no need for so many classes to distinguish element styles
It is better to use
p (pision) to represent part instead of having no semantics (most people misunderstand that p has no semantics! ! !), in fact, p can divide the document into several meaningful areas.
class name news to identify the entire news item. Then you can use the cascade style to identify news titles and texts. You should modify it as follows

Elastic Layout Example—View Source for the HTML and CSS

Copy after login

span togroupor identifythe inline elements

Andy wins an Oscar for his cameo in Iron Man

Public and on Februray 22nd, 2009 By Harry Knowles

Copy after login

Misunderstanding 3. Misunderstanding about the use of id is used to identify specific elements on the page (such as sitenavigation, header, footer) and must be unique; it can also be used to identify persistent Structural elements (such as main navigation, content area)

/*大量的使用id,很难找到唯一名称混乱*/ #andy, #rich, #jeremy, #james-box, #sophie { font-size: 1em; font-weight: bold; border: 1px solid #ccc; } /*只需一个普通类替代它*/ .staff { font-size: 1em; font-weight: bold; border: 1px solid #ccc; }

Copy after login

are used to identify specific elements on the page (such as site navigation, headers, footers) and must be unique; can also be used Identify persistent structural elements (such as main navigation, content area)

Detailed explanation of common misunderstandings in the use of HTML and CSS
The above is the entire content of this article. I hope that the content of this article can bring certain benefits to everyone's study or work. Help, and I hope you can support Script Home!

The above is the detailed content of Detailed explanation of common misunderstandings in the use of HTML and CSS. For more information, please follow other related articles on the PHP Chinese website!