Chapter 3 HTML 3.2 CSS text related styles

3.2.1 CSS font style attributes

1.font-size: font size
Set the font size. The value of this property can use relative length units or absolute length units.
Insert picture description here
2. font-family: font
l For example, set the font of all paragraph text in the web page to Microsoft Yahei

p {font-family:"微软雅黑";}

You can specify multiple fonts at the same time. When the browser cannot recognize the first one, it is not separated by a comma in the middle.

body{font-family:"华文彩云""宋体""黑体"}

3.font-weight: font weight
Insert picture description here
4.font-variant: variant

The property applies to setting variations (font change). It is generally used to define small capital letters and is only valid for English characters.
Normal: the default value, the browser will display the standard font

small-capsule: The browser will display small uppercase fonts, and all lowercase letters will be converted to uppercase. However, all the letters in small capital letters have a smaller font size than the rest of the text.

5.font-style: font style
set italic, italic or normal font
normal: default, the browser will display the standard font style

italic: The browser will display the italic font style

oblique: The browser will display italic font styles

6.font: comprehensively set the font style and
basic syntax format

选择器{font:font-style font-variant font-weight font-size/line-height font-family;}

3.2.2 CSS text appearance properties

1.color: text color
There are three
pre-defined values red blue yellow
hex # FF0000 # FF6600 # 29D794
RGB code red can be expressed as rgb (255.0.0) or rgb (100%, 0%, 0 %)

2.letter-spacing: word spacing
Word spacing is the space between characters.
Attribute values ​​can be attribute values ​​of different units. Negative values ​​are allowed. The default is normal

3. word-spacing: word spacing
The Chinese characters that define the spacing between English words are invalid

4.line-height: line spacing
The vertical spacing of characters, generally called line height

5.text-transform: text conversion is
used to control the capitalization of English characters
none: not converted (default)
capitalize: the first letter capitalized
uppercase: all characters converted to uppercase
lowercase: all characters converted to lowercase

6.text-decoration: text decoration
Set the decorative effects such as line drawing and line deletion of text underline
none: underline
underline:
overline overline: overline
line-through: delete line

7.text-align: horizontal alignment method is
used to set the horizontal alignment of text content, which is equivalent to the align alignment property in HTML
left: left alignment (default)
right: right alignment
center: center alignment

8.text-indent: Indent the first line

9.white-space: white space processing normal : spaces in
regular (default) text, blank lines are invalid, and new lines are automatically wrapped after full lines (reaching the boundary of the area)
pre: pre-formatted, spaces are reserved according to document writing format, empty line is displayed as
nowrap: blank blank line is invalid, can not be forced to wrap text, except when line break
is beyond the boundaries of the elements is not wrapped, if beyond the browser page will automatically increase the scroll bar

Published 28 original articles · Like1 · Visits 1701

Guess you like

Origin blog.csdn.net/qq_45870494/article/details/103509006