HTML learning CSS Control wide background

This note for self-study HTML design notes, all the knowledge points for their own collation, if you have questions please browse the 18 php tutorial, tutorial links, click here.

Knowledge Carding: 1, the HTML

2. How to introduce CSS

① external link to a CSS file, we indicate in the HTML header: <link href= "Css/my.css" rel= "stylesheet" type= "Text/css"/>

② header directly written to CSS: <style type= "Text/css" > div{margin:0;padding:0;border:1px solid red;} </style>
③ when you add multiple CSS files: <style type= "text/css" > @import url (my.css); </style>
④ directly in the HTML tag to write the CSS control of this tag, such as: <div style= "border:1px solid red;" > Test Information </div>

3. Defining block attributes in HTML can be defined in the head, for example

<styletype= "Text/css">Div{Height:300px;width:500px;background:Red;}</style>

The above example implements all DIV properties as defined, and if you want to implement a custom div property, you can implement the following example

<styletype= "Text/css">Div{Height:300px;width:500px;background:Red;}#up{background:Green;}#center{background:Blue;}#bottom{background:Black;}</style>

Body part: CSS Control width height

Use div to control width height

        <id= "Up"></div>        <   ID= "center"></div>        <  ID= "Bottom"></div>

Use float to control the left and right layout of blocks

Example

#up {    background:green;    Float:left;}

Clear floating

    Clear:left;        Clear:both;    

Use margin to set spacing values in four directions

margin:10px;margin-top:10px;margin-right:10px;margin-left:10px;margin-bottom:10px;

Three elements of border: width, shape, and color

Distance between box and text set spacing with padding

HTML learning CSS Control wide background