CSS3 Property Increase

I. Why use CSS
1. Effective delivery of page information
2. Use CSS to beautify the page text, make the page beautiful, beautiful, attract users
3. Can highlight the theme content of the page, so that users can see the main content of the page at the first glance
4. Have a good user experience

Two. Font style properties

1.font-family: English font, Chinese font (type)
Font-family:times, "Times New Roman", "italics";

2.font-size: Value units (size)
Unit
PX (pixels)
EM, REM, CM, MM, PT, PC

3.font-style:normal (normal), italic (italic) and oblique (tilt) (style)
P span{
font-weight:700;
}

4.font-weight:700 (font weight)

Normal default value, define standard font
Bold Bold Font
Bolder more coarse fonts
Lighter finer fonts
100, 200, 300, 400, 500, 600, 700, 800, 900 define the font from thin to thick
400 equals normal,700 equivalent to Bold

5.font: font style → font weight → font size → font type
Font:oblique bold 12px "in italics";
Three. Text Style
1.color
RGB (0,0,0) value between 0~255
RGBA (0,0,0,0) The last one represents transparency, and the value is between 0~1

2. Text Horizontal alignment Text-align
Left to arrange the text to the Ieft. Default value: determined by the browser
Right, arrange the text to the left.
Center arranges text in the middle
Justify the effect of aligning the two ends

3. Indent in first line
text-indent:20px;

4. Row height
line-height:30px;

5. Text Decoration
Text-decoration
None default value, defined standard text
Underline setting the underline of text
Overline to set the underline of text
Line-through to set strikethrough for text

6. Vertical alignment of text
Vertical-align
Top: Align Top
Bottom: Bottom Align
Middle: Middle Alignment
7. Text Shadows
Text-shadow: Color x axis move position y axis move position blur radius (0 for No)

Four. Hyperlink pseudo-Class
A:link hyperlink style is not clicked when accessed A:link{color: #9ef5f9;}
a:visited Click the hyperlink style after access a:visited {color: #333;}
a:hover hyperlink style on mouse hover a:hover{color: #ff7300;}
A:active mouse click the hyperlink style that was not released a:active {color: #999;}

Five. List style
List-style-image:url (image/arrow-icon.gif); Image before list item
List-style-type to specify the front icon of a list item
None unmarked symbol list-style-type:none;
Disc solid circle, default type List-style-type:disc;
Circle Hollow Circle List-style-type:circle;
Square Solid Square list-style-type:square;
Decimal digit List-style-type:decimal

Six. Background colors and images
Color: Background-color
Image: Background-repeat:url (path)
Repeat: tile horizontally and vertically in two directions
No-repeat: Uneven shop, that is, show only once
Repeat-x: Tile Horizontally only
Repeat-y: Tile only in vertical direction
Seven. Gradients
-Browser kernel-linear-gradient (direction, start color, end color)
Background:linear-gradient (to Left,red,blue);
Background:-webkit-linear-gradient (to Left,red,blue);

CSS3 Property Increase