CSS style Sheets

CSS style sheet

CSS works by beautifying HTML pages.

/* Comment */--comment syntax

1. Basic concepts of style sheets

1-1 Style Sheet classification

(1) Inline style sheet

Combined with HTML display, the control is accurate, but reusability is poor, redundancy is many.

Example: <p style= "FONT-SIZE:14PX;" > Inline style Sheets </p>

(2) Inline style sheet

embedded in a Web page as a separate area must be written inside the head tag.

<style type= "Text/css" >

P

{

Style

}

</style>

(3) External style sheet

Create a new CSS file to place 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 → attach a style sheet. The link connection method is generally used.

<style type= "Text/css" >

*//format works on all labels

{

margin:0px; Up and down margins are 0 pixels

padding:0px; Left and right margins of 0 pixels

}

1-2 Selector

(1) Tag Selector. Use the tag name to make the selector.

<style type= "Text/css" >

P//format works on P tags

{

Style

}

</style>

(2) class selector. It's all "."   Beginning. <div class= "style name" >

<style type= "Text/css" >

. Main
{
Background-color: #3C0;
font-size:28px;
}

</style>

<body>

<div class= "main" > //Call class style

</div>

</body>

(3) ID selector. Start with "#" <div id= "style name" >

<style type= "Text/css" >

#main
{
Background-color: #3C0;
font-size:28px;
}

</style>

<body>

<div id= "main" > //Call ID Style

</div>

</body>

(4) Composite selector.

1) separated by "," to indicate the juxtaposition

2) separated by spaces, indicating descendants

3) use "." Separate to indicate filtering

CSS style sheet