Learn css to make Web pages: my Web naming standard

Source: Internet
Author: User
Tags add numbers
css|web| Standard | Web page OK, here's my web naming standard. In the article "setting up my own operating standards" Yesterday, I pointed out that the main way to improve development speed was to reduce duplication of effort. And today's topic is also to reduce the duplication of work in some of the prophase. Shut up and say less, I go straight to the point:

We are in the name of must pay attention to a little--id names cannot be sandwiched with style words. For example: #divBlue这样的DIV的ID就表明我这个DIV是蓝色的, however this div if the background is blue and the text is red or yellow, this div ID is difficult to be representative, in the long run: We in the revision when we want to make this div green, So this ID is a mistake!

Of course, is not to say class name can be folder with style, relatively speaking class will need to see the situation! For some specific style class names, it is necessary to add a style-related vocabulary to identify them. For example, we can make a ". Textred{color: #f00;}" To use, because we need to use such a class in some particular place to define the text as red. Of course this class we use very little!

So what is the right name to do? by function. For example: "Navigation bar", we are named "NAV", so no matter what style we use, the navigation bar is the navigation bar will not have any changes in nature. What if the navigation bar is multilevel? The child is named "Navchild" or "Childnav" I personally advocate the use of "Navchild" in line with the Chinese logic of thinking. So, what about the sub layer? It is named "Navchildchild" or "Nav2child". It is often difficult to meet more than three layers of navigation! There is also a situation where each option in the navigation is different, and you need to set the ID instead of the class. Then how to name it? At this point we cannot add numbers to each ID and need the name of this option, for example: #navMusic, this means that the ID of the music option in the navigation bar.

We've noticed! I always capitalize the first letter of the second word when I name it. It is convenient for us to read and understand the meaning of it. And when you want to add the name of its parent, this is to indicate the inheritance relationship of this ID.

It is clear that the current web label is not supported in Chinese, so we are choosing to use English or pinyin I think it depends on their preferences! The key is to form your own standards, so that you will find that your code is incredibly close to you.

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.