Fifth chapter text Nature of CSS

The main function of this chapter C s S

This chapter is about text-related CSS directives. Usually the content of a Web site is the most of the text, through the text-related CSS instructions, you can make your page content of the beautiful. This chapter will be divided into two parts to introduce you, the first part is the font nature of the CSS directive, to control the various styles of text font, the second part introduces the text of the nature of the CSS directive, to control the appearance of the text paragraph and display way.

c s S instruction for font character

font-family Set Text font support: IE3, IE4 applicable: All elements possible values:<family-name> font name presets: Depending on the browser and inheritance: There is a general example: SPAN {family-name: "italic"} Coaxial Example:　<span style= "Family-name: Standard italic" >font-style set font style support: IE3, IE4, NC4 Use: All elements possible values: normal normal character italic italic oblique italic character preset: normal inheritance: There is a general example: SPAN {font-style:italic} coaxial example: <span style= "　Font-style:italic ">font-weight Set font weight support: IE3, IE4, NC4 With: All elements possible values: normal normal word bold bold bolder relative to parent element slightly thicker lighter relative to parent element slightly finer 100,200,300,400,500,600,700,800,900. Numbers from small to large represent strokes from thin to coarse normal=400 bold=700 preset values: Normal inheritance: There is a general example: SPAN {Font-weight:bolder} coaxial example: <span style= "Font-weight: Bolder ">font-size Set Text size support: IE3, IE4, NC4 applicable: All elements may be value:<absolute-size> absolute size, the available parameters from small to large respectively have seven items Xx-small, X-small, Small, medium, large, x-large, xx-large<relative-size> relative size, available parameters are larger, smaller two items with parent element font size benchmark <lenght> Length units, please refer to the description <percentage> percentage of the basic unit of the first chapter, with the parent element font size as the baseline preset: Medium inheritance: There is a general example: SPAN {font-size:12pt} coaxial example: <span Style= "font-size:12pt" >font-variant set text conversion support: IE3, IE4, NC4 apply: All elements possible values: normal normal word small-caps convert lowercase text to uppercase presets:Normal inheritance: There is a general example: SPAN {font-variant:small-caps} coaxial example: <span style= "Font-variant:small-caps" >font comprehensive set font character support Hold: IE3, IE4, NC4 apply: All elements possible values:<font-style> set font style <font-variant> set text conversion <font-weight> Set font weight < Font-size/line-height> set Text size and sizing (refer to Setting text height) <font-family> set text font preset: No inheritance: There is a general example: SPAN {Font:bolder Small-caps 12pt/120% Arial} coaxial example:< SPAN style= "Font:bolder small-caps 12pt/120% Arial" >

Character of the C s s instruction

Line-height Set Column height support: IE3, IE4, NC4 for: all elements possible values: Normal column height, depending on the font change reasonable altitude, depending on the browser <number> with the element font size multiplied by that number is the column height <length > Set length, please refer to the relevant description <percentage> percentage of the basic unit in chapter I, relative to the element font size is a proportional preset: normal inheritance: There is a general example: DIV {line-height:120%} coaxial example:<　DIV style= "line-height:120%" >text-align set Text to support: IE3, IE4, NC4 apply: block element Possible values: center right to the right of the left side of the justify about　Default: Dependent on browser inheritance: There is a general example: DIV {Text-align:center} coaxial example: <div style= "Text-align:center" >vertical-align set vertical to support: IE4 Use: Coaxial element possible value: top to the highest element of the same column top bottom to the bottom of the lowest element of the same column baseline to the bottom line middle to the central sub to place the element subscript super Place the element superscript text-top to the top of the text text-bottom to the bottom of the text <percentage> reference element itself column high, with the parent element baseline as the base displacement preset: Baseline inheritance: There is a general example: SPAN {vertical-align:sub} coaxial example: <span style= "　Vertical-align:sub ">text-decoration Set text decoration support: IE3, IE4, NC4 Use: All elements possible values: none ordinary word underline text plus the bottom line Overline text plus top lines Line-through text plus strikethrough blink set text blink preset: None Inheritance: There is a general example: SPAN {　Text-decoration:blink} Coaxial Example: <span style= "Text-decoration:blink" >text-transform set text conversion support: IE3, IE4, NC4 Use: All elements possible values: None ordinary character capitalize converts a letter in English word to uppercase UppercaSE converts all text to uppercase lowercase converts all text to lowercase presets: none Inheritance: There is a general example: SPAN {text-transform:uppercase} coaxial example: <span style= " Text-transform:uppercase ">letter-spacing Set letter interval support: IE4 applicable: All elements possible values: Normal does not change the letter interval, using the browser preset value <length> To add an extra interval length, you can set a negative value preset: normal inheritance: There is a general example: SPAN {letter-spacing:0.5pt} coaxial example: <span style= "letter-spacing:0.5pt" > Text-indent Set Text indent support: IE3, IE4, NC4 for: block element may value:<length> length units, please refer to the first chapter of the basic unit of the relevant instructions <percentage> Percent value preset with parent element width: 0 Inheritance: There is a general example: DIV {text-indent:3pt} coaxial example: <div style= "text-indent:3pt" >

The above is the fifth chapter text nature of CSS content, more relevant content please pay attention to topic.alibabacloud.com (www.php.cn)!

