The code format in css and the syntax structure of @ import, css @ import

The code format in css and the syntax structure of @ import, css @ import

Code Format in CSS

CSS is short for Cascading Style Sheet. It is a simple mechanism for adding styles to web documents and belongs to the layout language of the presentation layer.

1. Basic syntax Specification
Analyze a typical CSS statement:

P {COLOR: # FF0000; BACKGROUND: # FFFFFF}
"P" is called "selector", indicating that we want to define a style for "p;
Style declaration is written in a pair of braces;
COLOR and BACKGROUND are called "properties". Different properties are separated by semicolons;
"# FF0000" and "# FFFFFF" are attribute values ).
2. color value
The color value can be written in RGB format, for example, color: rgb (, 0, 0) or hexadecimal format, just like color: # FF0000 in the preceding example. If the hexadecimal value is repeated in pairs, the effect is the same. For example, # FF0000 can be written as # F00. However, it cannot be abbreviated if it is not repeated. For example, # FC1A1B must be filled with six characters.

3. Define the font
The following font definition method is recommended for web standards:

Body {font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica,, sans-serif ;}
The font is selected in the listed order. If your computer contains the Lucida Grande font, the document will be specified as Lucida Grande. If no, It is specified as the Verdana font. If no Verdana is available, it is specified as the Lucida font, and so on ,;
Lucida Grande fonts are suitable for Mac OS X;
Verdana fonts are suitable for all Windows systems;
Lucida is suitable for UNIX users
"" Is suitable for simplified Chinese users;
If none of the listed fonts are available, the default sans-serif font can be called;
4. Group Selector
When the style attributes of several elements are the same, you can call a declaration. elements are separated by commas (,): p, td, li {font-size: 12px ;}

5. Derivative Selector
You can use the derived selector to define a style for the child element in an element. For example:

Li strong {font-style: italic; font-weight: normal ;}
The child element strong under li defines a italic style that is not bold.

6. id Selector
The CSS layout is mainly implemented by the "div" layer, and the div style is defined by the "id selector. For example, we first define a Layer

<Div id = "menubar"> </div>
Then define in the style sheet as follows:

# Menubar {MARGIN: 0px; BACKGROUND: # fefefefe; COLOR: #666 ;}
Here, "menubar" is your own defined id name. Add "#" to the front.

The id selector also supports derivation, for example:

# Menubar p {text-align: right; margin-top: 10px ;}
This method is mainly used to define layers and those that are complicated and have multiple derived elements.

6. Category Selector
In CSS, a class selector definition starts with a vertex, for example:

. 14px {color: # f60; font-size: 14px ;}
On the page, use the class = "class Name" method to call:

<Span class = "14px"> 14 PX font </span>
This method is simple and flexible, and can be created and deleted at any time according to the page requirements.

7. Define the link Style
In CSS, four pseudo classes are used to define the link styles: a: link, a: visited, a: hover, And a: active. For example:

A: link {font-weight: bold; text-decoration: none; color: # c00 ;}
A: visited {font-weight: bold; text-decoration: none; color: # c30 ;}
A: hover {font-weight: bold; text-decoration: underline; color: # f60 ;}
A: active {font-weight: bold; text-decoration: none; color: # F90 ;}
The preceding statements define the style of "link, accessed link, mouse over, and mouse over. Note: The data must be written in the above sequence; otherwise, the display may be different from what you expected. Remember that their order is "LVHA ".

Link: https://zhidao.baidu.com/question/123035147.html

@ Import syntax structure
@ Import + space + url (CSS file path address );

1) in html

In the <Style type = "text/css">
@ Import url (CSS file path address); note: the path here can be an absolute or relative path, or a webpage link.
</Style>

The absolute path must be like (file: // D:/This is the parent folder of the new2.css file/new2.css) to be referenced by HTML.

@ Import in html

2) In css
Direct use
@ Import url (CSS file path address );

@ Import: Used in CSS code or CSS files

@ Import can be used in both css and html.

Link: http://www.divcss5.com/rumen/r431.shtml