How to use id and class in div css webpage layout

Source: Internet
Author: User
How to use ID and CLASS? I have mentioned usage principles and skills in the title. The usage principles and skills here are my summary of experience. They are not from which books, so they are not authoritative discussions, please read this article with your own opinions, and do not be confused by my enchanting words.
Usage principles of ID and CLASS
It is said that W3C sets the ID and CLASS to be unique and the CLASS is universal. Therefore, the principle of use here is also based on this feature.
IDS cannot be repeated. Therefore, in the XHTML structure, IDs must be used for large structures. Such as logo, navigation, subject content, and copyright. The naming rules I have developed are # logo, # nav, # content, # copyright. Some people say that layout uses ID and color background uses CLASS. In fact, this is incorrect. ID has no direct relationship with layout, and the CLASS and color are not equal. Some people use IDs or all use classes for the sake of trouble. It is understandable that they all use IDs, which is contrary to ID uniqueness. If each ID is different, it is not exhausting. The principle I have summarized through practice is: ID must be unique and should be used in the periphery as much as possible. The CLASS is reproducible and should be used within the structure as much as possible. The advantage of this is that it is conducive to the maintenance and modification of website code in the later stage. This way will make all classes become sublevels of IDs or grandchildren.
You can have two sons, but can you have two fathers. When we write CSS, we can write it like this # father. child {...} Try not to include the Class ID,. father # child {...} It would be a bit silly to write it like this. Of course, this is not a matter of course. Special treatment is required in special cases. But in general, this form is not necessary.
The above is the usage principle of ID and CLASS. To sum up one sentence: ID is unique and parent, and CLASS can be repeated and sub-level.
Tips for Using ID and CLASS
1. The child-level naming contains the part of the parent name starting. This makes it easy to clarify the hierarchy when writing CSS.
2. It is best not to use ID for the child level in the CLASS. Of course, special circumstances are special.
3. It is best to use case-insensitive names for CLASS naming. For example, newMovie is the most suitable method to use the explicit relationship with the first statement. Note that browsers other than IE are very case sensitive. Also, it must start with a letter.
In fact, the above is all about what everyone understands, but I just picked it up and wrote it down first, which is a summary. I hope you will put forward new ideas and new ideas for the use of ID and CLASS. Summarize the most appropriate and efficient specifications.
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.