CSS basic Syntax (2)
First, text font properties
1. Text Properties: Line-height,text-align,letter-spacing,text-decoration,white-space
2. Font properties: Font,font-family,font-size,font-weight
123<meta http-equiv="Content-type"Content="text/html; charset=gb2312"/>4<style type ="Text/css">5 li{6 font:15px song body;7text-Align:left;8line-height:28px;9 }Ten . title{ Oneletter-spacing:5px; Awhite-Space:nowrap; -text-Decoration:underline; - } the . bigfont{ -font-size:16px; - color:red; - } +</style> - +<body> A<div> at<ul> -<liclass="title">CSS Basic Syntax (2) </li> -<liclass="Bigfont"> Perseverance, hard to learn CSS basic grammar, to become a master of CSS and strive! </li> -Text attributes for <li>css </li> -<liclass="Bigfont"> The next step in learning CSS is to work harder to learn javascript! </li> -Font properties for <li>css </li> in</ul> -</div> to</body> +View CodeSecond, background properties
Background attribute parameters: Background, Background-color, background-img, Background-repeat, background-position
1, the value of the Background-repeat property:
Repeat horizontal and vertical tiling, default values
Repeat-x Horizontal Tiling
Repeat-y Tile Vertically
No-repeat background map does not overlap tiles
2, the value of the Background-position property
Xpos Ypos x indicates that the horizontal direction y represents the vertical direction (positive value is the positive offset, while the negative value indicates reverse offset, and up to right)
Percent Y% use percentage to indicate the position of the background (30% 50% vertically centered, offset horizontally 30%)
x Direction keyword y direction keyword horizontal direction keyword left, Center ,rightvertical keyword Top,center,bottom
123<meta http-equiv="Content-type"Content="text/html; charset=gb2312"/>4<style type ="Text/css">5 div{6Background:url (img/test.jpg) no-repeat;7background-position:-100px 0px;8 }9</style>Ten One<body> A<div> - This isA test of background! - This isA test of background! the This isA test of background! - This isA test of background! - This isA test of background! - This isA test of background! +</div> -</body> +View CodeThird, list of common properties
1. The List-style attribute is used to define the various styles of the list item, and the List-style attribute value is described as follows:
None No modifier
Disc Solid Circle
Circle Hollow Circle
Square Solid Square
Decimal number
2. The Float property is used to define the floating direction of the element.
123<meta http-equiv="Content-type"Content="text/html; charset=gb2312"/>4<style type ="Text/css">5 li{6 width:150px;7 color:red;8 font:28px;9list-Style:none;Ten float: Right; One } A</style> - -<body> the<div> -<ul> -<li> Pencils </li> -<li> pens </li> +<li> Fountain pen </li> -<li> Brushes </li> +<li> Brushes </li> A</ul> at</div> -</body> -View CodeInsist on a little further every day, refueling!
CSS basic Syntax (2)