What are the three types of css rules?

Three types of css rules: 1. Inline style sheet, use the style attribute to directly add CSS code to the HTML markup, the syntax " ". 2. In the internal style sheet, write the css style in the "

" tag and declare it with the "

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

CSS is a programming language used to represent html styles. It is a style language that can separate web pages and content.

CSS is mainly used to design the style of web pages and beautify web pages; it can not only statically modify web pages, but also dynamically format various elements of web pages in conjunction with various scripting languages.

CSS can perform pixel-level precise control over the layout of element positions in web pages, supports almost all font size styles, and has the ability to edit web page objects and model styles.

CSS styles mainly include the following three types: inline styles (inline styles), internal styles (inline styles), external styles (outline styles)

1. Inline style (embedded style): Inside the

structure, that is, the style written within the tag; written inside the beginning part of the tag, the style attribute among.

<标记 style="样式的属性名1：样式的属性值1；属性名2：属性值2；......"></标记>

Example:

<h1 style="color:red;">style属性的应用</h1>

With this method, you can easily define a style for an element individually.

Advantages:

• Without the style sheet file, efficiency can be improved at some point;

• The style effect using the style attribute will be the strongest and will override the same style effect of other introduction methods.

Disadvantages:

• It is difficult to share styles with multiple elements, which is not conducive to code reuse;

• HTML and CSS code are mixed, making it difficult for programmers and search engines to read.

2. Internal style (inline style):

is written inside the HTML page and stored in the head tag Among them, the style is written in the style tag.

<style>选择器 {属性名：属性值；属性名：属性值；......}</style>

Example:

##Advantages: Same as inline style sheets and no additional requests will be generated , and it initially realizes the separation of structure and style, which is more suitable for single-page website applications.

Disadvantages: Since the internal style sheet is written in the HTML file, the page is impure, the file size is large, it is not conducive to web crawlers to obtain information, it is not conducive to maintenance, and styles cannot be shared between pages

3. External style (external style):

The code is written in the css file. Then link to the page through the link tag, and the link statement must be placed in the tag area of ​​the page.

If the CSS style is placed in a file outside the web page document, it is called an external style sheet. A CSS style sheet document represents an external style sheet.

In fact, the external style sheet is a text file with the extension .css. When you copy the CSS style code into a text file and save it as a .css file, it is an external style sheet.

As shown below is an external style sheet:

How to introduce an external style sheet:

There are two ways for HTML files to reference a style sheet with a .css extension: link type and import type.

1), CSS link style

Link style refers to defining a CSS style sheet externally and forming a file with a .CSS extension, and then linking it in the page through the link tag to the page, and the link statement must be placed in the tag area of ​​the page.

Grammar:

<link type="text/css" rel="styleSheet"  href="CSS文件路径" />

2), CSS import style

The import style is declared in the