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

This article mainly shows you "how to use CSS cascading style sheets to improve productivity", the content is easy to understand, well-organized, hope to help you solve your doubts, the following let the editor lead you to study and learn "how to use CSS cascading style sheets to improve productivity" this article.

Basic syntax of CSS

A CSS rule consists of two main parts: a selector and one or more declarations (declaration).

Selectors are usually HTML elements that you need to change the style.

Each declaration consists of an attribute and a value, separated by colons and surrounded by curly braces {}.

The property is the style attribute you want to set, and each property has a value (value).

The format is as follows:

Selector {declaration1; declaration2;... DeclarationN} selector {property: value}

Example

H2 {color:red; font-size:14px;}

Note: the purpose of the above line of code is to define the text color within the H2 element as red and set the font size to 14 pixels.

Tip: in this example, H2 is the selector, color and font-size are properties, and red and 14px are values.

Different writing methods and units of values

In addition to the English word red, we can also use the hexadecimal color value: # ff0000.

To save bytes, we can use the abbreviation of CSS: # f00.

We can also use RGB values in two other ways: rgb (255, 0) and rgb (100%, 0%, 0, 0, 0).

When using RGB percentages, write a percentage symbol even when the value is 0. But in other cases you don't need to do this. For example, when the size is 0 pixels, you don't need to use px units after 0, because 0 is 0, no matter what the unit is.

Example: different ways to write the color value in red

P {color: red;} p {color: # ff0000;} p {color: # f00;} p {color: rgb (255 color 0);} p {color: rgb (100%, 0%);}

Tip: note that when using RGB percentages, write a percentage symbol even when the value is 0.

Remember to write quotation marks

If the value is several words, enclose the value in quotation marks (either single quotation mark or double quotation mark):

P {font-family: "Microsoft Yahei", Arial, "sans serif";}

Multiple declaration

If you want to define more than one declaration, you need to separate each declaration with a semicolon.

The last rule does not require a semicolon, because a semicolon is a separator in English, not a closing symbol. However, most experienced designers put a semicolon at the end of each declaration, which has the advantage of minimizing errors when you add or subtract statements from existing rules.

Example

P {text-align: center; color: black; font-family: arial;}

Note: the above example defines a central paragraph with a font of arial text in black.

Tip: describe only one attribute per line, which enhances the readability of the style definition.

Spaces and case

Most stylesheets contain more than one rule, while most rules contain more than one declaration. The use of multiple declarations and spaces makes stylesheets easier to edit.

Whether or not to include spaces does not affect how CSS works in the browser, and again, unlike XHTML, CSS is not case-sensitive. There is one exception: class and id names are case-sensitive when it comes to working with HTML documents.

Example

Body {color: # 000; background: # fff; margin: 0; padding: 0; font-family: Georgia, Palatino, serif;} these are all the contents of the article "how to use CSS cascading style sheets to improve productivity". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow 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.