Home >Web Front-end >CSS Tutorial >Some tips for using CSS overall layout declaration_Experience exchange

Some tips for using CSS overall layout declaration_Experience exchange

PHP中文网
PHP中文网Original
2016-05-16 12:07:151404browse

we should develop good coding habits. css overall layout declaration provides a way to simplify our code and improve operating efficiency. we list the more commonly used forms and add explanations. the function of the overall layout declaration is to summarize the goal as a whole and declare some identical or basically the same attributes and values, so as to avoid the need to define them separately in each tag in the subsequent code. if there are different attributes and values, they can be redefined later.

1. wildcard overall layout statement.

* { 
margin:0; 
padding:0; 
font-size:0.8em; 
... 
}

this type of statement is for the entire page. you can set properties common to page elements. instead of having to declare each element individually. in the above code, we declare the margins and padding to be zero, and the font size to be 0.8em. the declared attributes and values ​​are applied to all elements on the page. unless the values ​​of margin, padding, and font-size are defined again in the subsequent code, they will be displayed according to this definition.

2. tagged overall declaration

body { 
background:#fff; 
font-family: courier, "courier new", monospace; 
} 
或 
p { 
background:#fff; 
font-family: courier, "courier new", monospace; 
}

this type of declaration is for certain xhtml tags. if there is no special definition, this statement will apply. we define the background color and font of the body. therefore, all elements within the body apply it unless defined again. the definition principle for paragraph p is the same.

3. group overall statement


h1,h2,h3 {color:#00f; font-weight:100;}

this type of statement indicates the text color and font addition of h1, h2, h3 rough situation. in our actual operation, this is not necessarily the case. maybe some xhtml elements of class or id have the same attributes, and we can group them for coding. some differences can be redefined individually. for example, in this http://www.52css.com/article.asp?id=392 example of a refreshing css form design with small icons. we use this type of declaration.
 

the above are some usage skills and experience exchange content of css overall layout declaration. for more related content, please pay attention to the php chinese website (www.php.cn)!


Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn