Text of the snake
css as the text line to deal with, put them inside an invisible box. Bounding box outer face of the container-wrap. All text attributes are applied to this case, rather than a container containing text.
The most useful of eight text attributes
Text-indent (text-indent)
Set the starting point of the text box, the default is within the margins from inside the box. It is indented positive effect, negative effect do hide.
Note: This value can be inherited, child elements inherited value is the end result of the parent element indented. Parent element width 100px; indentation 10% value, the result is indented 10px. Child element inheritance is indented 10px instead of 10%.
Character spacing (letter-spacing)
1, is adjusted in the browser default spacing basis.
2, the control character spacing is the distance in the horizontal direction, between the two words.
3, Chinese and English are applicable.
Word spacing (wrold-spacing)
css will have spaces on both sides of the characters are treated as words.
Decorative text (text-decoration)
underline: Underline
Crossed on: overline
line-througn: strikethrough (original price effect)
Line height (line-height)
Often used for vertically centered text. = Distance of the vertical text (line height - text height) / 2. A line of text is 12p, line height is 20, then the browser will increase 4px in this line of text up and down.
Text conversion (text-transfrom)
Conversion element in the case of text, only the English text data processing can be used when this property better than js defined filter performance.
capitalize: each word beginning with a capital letter.
uppercase: defined only capital letters.
lowercase: defined only lowercase letters.
inherit: inherited text-transfrom specified value from the parent element.
Vertical alignment (vertical-align)
1 to move up and down with reference to the text baseline, and the elements can be controlled within the row line-block.
2, baseline set in the font file can not be modified directly.
top: the top row to the top of the inner frame element row of the frame containing the element is aligned.
Align bottom row box element row bottom end of the inner frame with the element comprising: bottom.
text-top: top end of the inner frame element row is aligned with the top of the parent element's content area.
text-bottom: ditto negated.
middle: One point 0.5ex aligned in the vertical midpoint of the parent element row inner frame baseline.
Baseline : css design of a foreigner, to be exact is designed for people in English. Initially did not consider Chinese characters. English is the baseline of four-wire three grid. reference is that vertical-align three text lines to control its vertical mode.
Inline boxes : height equal line-height, the elements of the row replacement block is equal to the height of the content area. Line spacing will be described by adding to the content area.
Line box height : Close inspection shows there is a line of text in the highest and lowest points. Is a line of text line box height from the lowest point to the highest point.
em box : font-size determines the height em box.
Content area : em character strings with each frame thereof.
EX : Use lowercase font length x. Most small font letters is one-half the size of the letters. 1em ~ = 2ex (depending on the display resolution of the device)
