Five guidelines to help you write maintainable CSS code
|
1. Add a comment block at the beginning of the style sheet to describe the creation date, creator, tags and other notes of the style sheet. Copy code The code is as follows:Example Source Code: /* --------------------------------- Site: Site name Author: 52CSS.com Updated: Date and time Updated by: Name --------------------------------- */ 2. Including public color marking Copy code The code is as follows:Example Source Code: /* --------------------------------- COLORS Body background: #def455 Container background: #fff Main Text: #333 Links: #00600f Visited links: #098761 Hover links: #aaf433 H1, H2, H3: #960 H4, H5, H6: #000 --------------------------------- */ 3. Give ID and Class meaningful names <br />Not recommended naming method: Example Source Code: Copy code The code is as follows:.green-box { ... } #big-text { ... } Recommended naming convention: Example Source Code: Copy code The code is as follows:.pullquote { ... } #introduction {... } 4. Integrate related style rules Example Source Code: Copy code The code is as follows:#header { ... } #header h1 { ... } #header h1 img { ... } #header form { ... } #header a#skip { ... } #navigation { ... } #navigation ul { ... } #navigation ul li { ... } #navigation ul li a { ... } #navigation ul li a:hover { ... } #content { ... } #content h2 { ... } #content p { ... } #content ul { ... } #content ul li { ... } 5. Add clear comments to styles Example Source Code: Copy code The code is as follows:/* --------------------------------- Header styles --------------------------------- */ #header { ... } #header h1 { ... } #header h1 img { ... } #header form { ... } /* --------------------------------- navigation styles --------------------------------- */ #navigation { ... } |
<<: JS ES new feature of variable decoupling assignment
>>: HTML form value transfer example through get method
Recommend
How to install MySQL for beginners (proven effective)
1. Software Download MySQL download and installat...
Use and optimization of MySQL COUNT function
Table of contents What does the COUNT function do...
JavaScript implements changing the color of a web page through a slider
Hello everyone, today when I was looking at the H...
Undo log in MySQL
Concept introduction: We know that the redo log i...
Solution to the MySQL server has gone away error
MySQL server has gone away issue in PHP 1. Backgr...
Detailed explanation of MySQL event modification events (ALTER EVENT), disabling events (DISABLE), enabling events (ENABLE), event renaming and database event migration operations
This article uses examples to describe the operat...
Nginx configuration PC site mobile site separation to achieve redirection
Use nginx to configure the separation of PC site ...
Detailed explanation of the usage and difference between nohup and & in Linux
Example: We use the Python code loop_hello.py as ...
Implementing WeChat tap animation effect based on CSS3 animation attribute
Seeing the recent popular WeChat tap function, I ...
Docker Swarm from deployment to basic operations
About Docker Swarm Docker Swarm consists of two p...
Sample code for using js to implement Ajax concurrent requests to limit the number of requests
Description of the problem: When the number of as...
Five guidelines to help you write maintainable CSS code
1. Add a comment block at the beginning of the sty...
The whole process of upgrading Angular single project to multiple projects
Table of contents Preface Development Environment...
Example of how to achieve ceiling effect using WeChat applet
Table of contents 1. Implementation 2. Problems 3...
Detailed explanation of Nginx Location configuration (Location matching order)
Location means "positioning", which is ...