Shulou(Shulou.com)06/01 Report--

Most people do not understand the knowledge points of this article "what matters should be paid attention to in CSS development", so the editor summarizes the following content, detailed content, clear steps, and has a certain reference value. I hope you can get something after reading this article. Let's take a look at this "what matters to pay attention to in CSS development" article.

1. Do not abuse the class

Use ID instead of classes where it makes sense. This is a way to enable browsers to access DOM elements faster.

two。 Don't throw everything into one CSS file

Partition CSS makes it easier to manage. Each CSS file can be decomposed into logical components such as header.css, footer.css, and so on.

3. Do not name the selector ".red-with-green-dashed-lines" (red and green dotted lines)

Name your selector according to the components on the page.

4. Don't forget to comment.

Annotations are important in CSS to understand how each style is associated with other styles and what color scheme applies to which components.

5. Don't be afraid of development tools.

Each browser now has its own set of development tools, usually by pressing F12. These tools are critical when "debugging CSS".

6. Don't be afraid to cover

Of course, CSS frameworks, such as Bootstrap and Foundation, are huge, but each needs to be adapted to your needs. When you get an updated framework, it will overwrite your changes. Instead of digging deep into the huge CSS file, you might as well create an bootstrap-overrides.css file and adjust the framework according to your wishes, just...

7. Don't abuse it! It's important.

The overall idea of CSS is to "cascade" styles from one to another. ! The point is to remember that demining is the same as stepping through all previous styles.

8. Do not use a large number of web fonts

This is also obvious, but some people just like to make their own typesetting. Use only one or two (up to three) web fonts on the site, and then return to the browser default settings to keep the site optimized.

9. Do not manually encode all CSS

To maintain the DRY of CSS, you can use a CSS preprocessor such as LESS or SASS. The biggest advantage of using these preprocessors is that you can define variables.

10. Don't make CSS too "bloated"

Spaces take up space in the CSS file. Since we all want our CSS to load quickly, it's best to use the CSS compression tool to lose weight before deploying to the site.

Do not use too small pictures for background tiling

That's why a lot of people don't use 1px. The width-height 1px image tiles out a wide-height 200px area, which takes up 40,000 times and takes up resources.

12. No border

The recommended way to write it is border:none;,. Haha, I've been using this. Border:0; only defines the border width as zero, but the border style and color will still be parsed by the browser and take up resources.

13. Be cautious in using * wildcards

The so-called wildcard is to initialize all the tags in CSS, useless, outdated, advanced, equal, so that it takes up a lot of resources. There should be a selected initialization label.

14. Hexadecimal color code abbreviation for CSS

Accustomed to abbreviations and lowercase, I know that it is not the recommended writing method, in order to reduce the resources occupied by parsing. But it also increases the size of the file. Which is better or worse needs to be carefully examined.

15. Put the style on your head and the script under your feet. Not embedded, only outside the chain.

16. Never use CSS expressions.

Use a reference stylesheet instead of importing through @ import.

Generally speaking, PNG is smaller and much smaller than GIF. Furthermore, how many colors in GIF are wasted is worth optimizing.

19. Never scale a picture in HTML, one is not good-looking, and both take up resources.

20, the text font had better use even number, 12px, 14px, 16px, the effect is very good. Special case, 15px.

21, block, ul, ol, etc. leave at least double line spacing up and down, at least twice the line spacing on the left side, and at will on the right side.

22. There should be at least double line spacing between paragraphs.

23. Forcibly specify the line-height of some elements, 1.6times the text size and 1.3times the title.

24. Full-width punctuation in Chinese. English is mixed with Chinese, left and right spaces, half-width.

25. The bold and italic characters of Chinese fonts should be kept away from them, which is beneficial to the people and themselves.

The above is about the content of this article on "what matters should be paid attention to in CSS development". I believe we all have a certain understanding. I hope the content shared by the editor will be helpful to you. If you want to know more related knowledge, please pay attention to the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.