I. Background Properties Backgroundbackground property sets all background properties in a single life scroll: fixed on the rest of the page: pinned to a location in the window syntax structure: background:url (background image address) 1. Background positioning (background-position) Value: (1). x y% The first value is a horizontal position, the second value is vertical position (2). Xpx ypx (IBID.) (3). Left displays; (4) on the page or the containing element. Center displays; (5) in the middle of the page or the containing element. Right displays; (6) on the page or on the side of the containing element. Top Displays the; (7) on the page or the containing element. Bottom is displayed at the bottom of the page or containing element; 2. Background Paint area (background-clip) value: (1). Border-box: The background is cropped to the border box; (2). Padding-box: The background is cropped to the inner margin box; (3). Content-box: The background is clipped to the content box; 3. background-origin value of the positioning area of the background: (1). Border-box: The background image is positioned relative to the border; (2). Padding-box: The background image is positioned relative to the inner margin box; (3). Content-box: The background image is positioned relative to the content frame; Ii. Gradient Properties gradient refers to a smooth transition between two or more colors that can be used wherever a background image is used . linear gradients. Radial and repeating gradients . set with the Background-image property can take a value: (1). Linear-gradient: Linear gradient linear-gradient (angle,color-point1,color-point 2 ...) angle: Specifies the direction of the gradient, (2). Radial-grAdient: Radial gradient (3). Repeating-linear-gradient: Repeating linear gradient (4). Repeating-radial-gradient: Repeating radial gradient three. Text formatting overview 1. Font properties (for shorthand properties) Font:font-style font-variant font-weight font-size font-family; values not set, using default settings Control fonts (1). Specify font font-family:value,value2; & nbsp (2) Font size font-size:value; (3) font bold &N bsp;font-style:normal/bold/value; (4) Font style font-style:normal/ italic; (5) Small caps display font-variant:normal/amall-caps; & nbsp 2. Text properties (1) text color color:value; (2) text arrangement text-a lign:left/right/center; (3) text retouching text-decoration:none/underline; & nbsp (4) Row High line-height;value; (5) First line text indent text-indent:value; (6) Text Shadow Text-shadow:h-shadow V-shadow Blur color; (7) handling blank whit-space:normal/nowrap; (8) text overflow text-overflow:clip/ellipsis; line-up & nbsp (1) long word line word-wrap:normal/break-word; (2) Text wrapping word-break:normal/break-all/ keep-all; four. Table common style properties 1.border: Outside Box; 2.line-height: 3.text-align: .4.vertical-align: 5.border-collapse: Merge the borders between cells . only for table border use 6.border-spacing: Set spacing between two cells The first value is a horizontal space , the second value is vertically spaced . 7.caption-side: Set the position of the table header, values: top; bottom; 8.table-layout: Used to help the browser display or layout a table, both to set the display table cell. Row. Algorithm rules for columns Value: Auto: Column width is set by cell contents, default value, automatic table layout fixed: Column width is set by table width and column width, Fixed table layout . NOTE: The width and height of TD in auto:table varies depending on the content; & nbsp fixed: If it is Chinese, the width of TD is fixed, the height varies according to the content, there is no limit, if it is in English, the content width will overflow if it exceeds .
Background in CSS, formatting of gradient text, and common properties of tables