CSS style sheet (i)

There are three ways to add styles to each label in HTML inline, inline, and external style sheets. Inline is to add the style= "style" directly inside the tag, embedded in the page directly, in

In the use of inline and external, you need to use the selector, in the style table to be used, so that it can find the label, you need to enter "id" or "class" in the tag, it is written as: selector {style sheet}. The selector has: "#" represents the selection by ID, but because an ID can only represent one (note: The ID must start with a letter), so the selector can only select one; "." The delegate can select multiple tags by class, and the tag name selector can change the style of all the tag names by typing the tag name directly; "*" means all, even if the style of all elements in the site changes. Use the selector style to add units within the style and use ";" To separate, as width:300px; height:300px;. The priority of the selector is:id>class> tag name >*. The selector also has a combination effect: "#a, #b", "represents a side relationship," #c Li "(space) represents a descendant relationship;" Div.d "." The representative is filtered out by class. To break the priority relationship, you need to add "!important" to the style at the end.

Styles in a style sheet are decorated with the text that is displayed within the page, changing its appearance, the style has the size of the content, the background, the font, the way you modify it, and the indirect border, list box, format and layout, and some other modifications.

The change in size is the change of width and height, which is the modification of widths and heights. The background modification is: "Background-color" to modify the background color; "Background-img:url" to add a background picture; "Background-repeat" is a tiling method, the general choice "No-repeat" means the uneven shop; Background-position "is the position of the picture, it can enter two directions at the same time and add a certain number to indicate the distance to move in a certain direction and how many pixels from the border, such as top 20px right 20px, which means moving to the upper direction, and the distance between the top and right border is 20 pixels, "background-attachment" for whether you can scroll, often fixed do not scroll; "Background-size" is the size of the picture, where the width and height of the input settings, such as 500px 500px , which means 500 pixels wide and 500 pixels high.

The font settings are: "Colo" to set the font color; "font-family" is the style of the font, the most commonly used fonts in the Web page is "Microsoft Jas Black", "font-size" is the size of the font, and several commonly used font size is 12px (commonly used in header and footer), 14PX (for body) and 16px (commonly used for labeling), "font-weight" font weight, generally bold with "bold" font, "Font-style" for font style, use "italic" when using Tilt; "Text-decoration" For some of the commonly used lines in the font, "Line-through" is Strikethrough, "overline" is underlined, "underline" is underlined, "none" is used to remove the underscore, usually for the <a> bring the underline to delete the effect.

There is a way between the text: "Text-aline" is a horizontal pair of aligns, which is generally centered with "center", "Line-height" is set to row height, "Ertical-aline" is vertically aligned, and "middle" is used to center It needs to be used in conjunction with the row height to show the effect; "Text-inden" means the first line indent, and the general 30px is indented two characters.

Set its bounding border, such as setting a <div> 's internal and external margins and the bottom border with: "margin" set the margin, can be based on the left (clockwise) in order to enter its size, or only set two values, indicating the same size, the same size, "Auto" means the center; The "padding" sets the inner border, also enters its size in a clockwise direction, and if the padding is added, the element becomes larger; "Boder" is the bottom border, and the input is 1px (border thickness) solid (solid line) (select color).

The list box is typically used to set the symbol for the front-end of the list: "List-style" is the symbol used in front of the list, usually "none" to remove the symbol; "List-style-image" represents the symbol for the front end of the list as a picture.

CSS style sheet (i)