Css overview, css style table classification, selector classification, css basic style, css style table
1.Style SheetAdvantages of Cascading Style Sheet css:
- Separation of content and performance
- Unified web page performance, easy to modify
- Rich styles to make the webpage layout more flexible
- Reduces Web Page code, increases web page browsing speed, and saves network bandwidth
- The use of CSS independent from web pages helps websites to be indexed by search engines
- Embedded ID> external ID> embedded class> external class> embedded tag> external tag
1.1 Introduction MethodFour Types
- Style = "" intra-row style sheet
- <Style> internal style sheet
- <Link rel = "stylesheet" href = ""/> external style sheets (most used)
- <Style> @ import "" </style> import method. Try not to use it !!!
1.2
Import mode priorityLine> internal> external> Import 1.3
What is the difference between link type and pilot type:
- <Link/> the tag belongs to XHTML and @ import belongs to CSS2.1;
- Use the <link/> link to first load the CSS file to the webpage, and then compile and display the file;
- Use the CSS file imported by @ import to display the HTML structure on the client and then load the CSS file into the webpage;
- @ Import is unique to CSS2.1 and is invalid for browsers that are not compatible with CSS2.1;
2.
Selector2.1 which selector and its priority ID selector # An HTML document can have only one id class selector with the same name. you can have multiple element p wildcards * 2.2 selector priority ID> CLASS> element> * 3.
Basic styles (commonly used in text, images, and lists)
Background
1. background-color background color (hexadecimal rgb rgba English name)
2. background-image background image
3. background-size background size (pixels and percentages)
4.background-repeat (repeat-x repeat-y no-repeat)
5. background-position (specified by the direction value, percentage, and exact pixel value)
6. Does the background-attachment scroll with the browser? The image with it will be fixed relative to the browser (bg-position and bg-attachment should not be used together)
7. The background compound attribute can be defined in this attribute ,【General writing sequence: color, image, repetition, fixation, and location]
Color
Font
Chinese font-family Common List http://www.cnblogs.com/jihua/p/cnfont.html
FontComposite attributes
General sequence: font style, whether it is a small font, font width, font size, font size
Text attributes
Color, text-align, line-height, letter-spacing, vertical-align, text-indent, text-decoration;
----- [Vertical-align -----> 1. Commonly Used in text box input, 2. Combined with {display: table-cell;} can be used to vertically center an image]
----- [Valign -----> only applies to cells in the table. For example, <td valign = 'top' height = '100px '> this is cell </td>]
----- [Align -----> applicable to
<Table>, for example: <table border = "1" width = "300" align = "center">... </table>;
, for example, <span> text is displayed relative to the top of the image </span>;
;]
<------ Study notes. If any error occurs, thank you for your correction! ------->