CSS overview, CSS style sheet classification, selector classification, CSS base style

1. style sheet Cascading Style SheetCSS Benefits:

• Separation of content from performance
• Web page performance is unified, easy to modify
• Rich styling to make Web page layouts more flexible
• Reduce the amount of Web page code, increase the browsing speed of Web pages, save network bandwidth
• Use Web-independent CSS to facilitate web pages to be indexed by search engines
• Embed id> external id> embed class> external class> embed tags > external tags

1.1 Introduction MethodFour Kinds

• Style= "" In-line style sheet
• <style> Internal style sheet
• <link rel= "stylesheet" href= ""/> External style sheet (most used)
• <style> @import "" </style> Import mode, try not to use!!!

1.2 Introduction-mode priority inline > Internal > External > Import 1.3 The difference between a link and an import:

• The <link/> tag belongs to XHTML, @import belongs to CSS2.1;
• Use the <link/> link CSS file to load the Web page first, then compile the display;
• Using @import imported CSS file, the client displays the HTML structure, and then loads the CSS file into the Web page;
• @import is CSS2.1 unique, for incompatible CSS2.1 browser is invalid;

2. selector 2.1 What kinds of selectors and its priorityID Selector # There can be only one ID in an HTML document with the same nameclass selector. can have multipleelement Pwildcard characters *2.2 Priority of selectorsID > CLASS > Element > *  3. Basic Several styles (commonly used for text, pictures, lists)

Background background

    1.background-color background color (16 binary RGB RGBA English name)   

    2.background-image Background Map

    3.background-size background size (pixels, percent)

    4.background-repeat (repeat-x repeat-y no-repeat) 

    5.Background-position (specified by direction value, specified by percent, specified by exact pixel value ) 

    6.If the background-attachment is scrolling with the browser, the image will be pinned relative to the browser (bg-position and bg-attachment do not work together)  

    7.Background Composite Properties can define the previous attribute in this one,"    General Writing Order: color, picture, whether duplicate, fixed, location "   

Color colors

1. color Specifies the colors of the text
2. Opacity set element Transparency ,1 opaque 0 fully transparent

Font fonts

1. Font-style the font style of the specified text ( normal, italic )
2. FONT-VARIANT Specifies whether the text is a small capital letter (works with English)
3. Font-weight the thickness of the specified text ( only two styles ) bold bold
4. Font-size specifying text font size
5. Font-family defining text using a font

Chinese font font-family common list http://www.cnblogs.com/jihua/p/cnfont.html

Font Composite Properties

General Order: Font style, whether it is lowercase, font weight, size, font

Text Property

Color, text-align, Line-height, letter-spacing, Vertical-align, Text-indent, text-decoration;

-----"vertical-align----->1. Commonly used for text box input, 2. Combine {Display:table-cell;} Can be used to center the picture vertically "

-----"valign-----> applies only to cells in table, such as <td valign= ' top ' height= ' 100px ' >this is cell</td>"

-----"align-----> for <HR/>, for example:

<table>, for example: <table border= "1" width= "+" align= "center" > </table>;

, for example: <span> text display </span> relative to the top of the picture;

····· And so on, no longer enumerated;"

     <------Study notes, if you have any mistakes, please correct me! -------> 

CSS overview, CSS style sheet classification, selector classification, CSS base style