HTML Basics Must-Read - Comprehensive Understanding of CSS Style Sheets

CSS (Cascading Style Sheet) is used to beautify HTML web pages.

/*Comment area*/This is the comment syntax

1. Style Sheet

1. Classification of style sheets

1. Inline Style Sheets

Displayed jointly with HTML, the control is precise, but the reusability is poor and there is a lot of redundancy.

Example: <p style="font-size:14px;">Inline style sheet</p>

2. Embedded Style Sheets

As an independent area embedded in the web page, it must be written in the head tag.

<style type="text/css">

p //The format works on the p tag

{

style;

}

</style>

3. External Style Sheets

Create a new CSS file to store the style sheet. If you want to call a style sheet in an HTML file, you need to right-click in the HTML file → CSS Style Sheet → Attach Style Sheet. Generally, the link connection method is used.

Note: There is no need to write style tags in the css file

Some tags have default margins, which are usually removed when writing stylesheet code (other styles can also be set), as follows:

Note: The above picture shows that the margins and spacing are removed first.

(ii) Selector

1. Tag selector. Use tag names as selectors.

2.class selector. They all start with "." .

Note: The class selector can be superimposed with the tag selector to show different effects.

3.ID selector. Starts with “#” .

Note: The ID selector can be superimposed with the tag selector to show different effects.

<div id="style name">

4. Compound Selectors

(1) Use “,” to separate two items to indicate parallel order.

(2) Separated by spaces, indicating descendants.

(3) Filter “.”

2. Style attributes

1. Background and prospects

1. Background:

2. Foreground font:

2. Boundaries and borders

border (table border, style, etc.), margin (table spacing). padding (content and cell spacing).

3. Lists and blocks

width , height , ( top , bottom , left , right ) are only useful in the case of absolute coordinates.

The css stylesheet code shows:

CSS file code:

HTML file code:

The running effect shows:

The above article "Must-Read on HTML Basics - Comprehensive Understanding of CSS Style Sheets" is all the content that the editor shares with you. I hope it can give you a reference. I also hope that you will support 123WORDPRESS.COM.

Original URL: http://www.cnblogs.com/H2921306656/archive/2016/07/10/5658628.html