CSS的基础属性
控制队列的元素有:
[*]The list-style-type property and how it’s used to present different types of lists through a variety of marker styles for bulleted lists and numbered lists
Property
Value
list-style-type
disc | circle | square | decimal | decimal-leading-zero | lower-roman | upper-roman | lower-greek | lower-latin | upper-latin | armenian | georgian | none
Initial value: disc
[*]The list-style-image property and how it’s used to provide a custom marker for each list item
Property
Value
list-style-image
<uri> | none 如:list-style-image: url('arrow.png');
Initial value: none
[*]The list-style-position property and how it’s used to control the positioning of list item markers
Property
Value
list-style-position
inside | outside
Initial value: outside
这里的INSIDE和outside的意思是在元素的里面和外面
The list-style shorthand Property
Property
Value
list-style
<’list-style-type’> || <’list-style-position’> || <’list-style-image’>
Initial value: n/a
属性Backgrounds相关的设置:
[*]How to use the background-color property to set a background color
Property
Value
background-color
<color> | transparent
Initial value: transparent
[*]How to use the background-image property to specify a background image
Property
Value
background-image
<uri> | none
Initial value: none
[*]How to use the background-repeat property to control background tiling
Property
Value
background-repeat
repeat | repeat-x | repeat-y | no-repeat
Initial value: repeat
[*]How to use the background-position property to control how the background is positioned
Property
Value
background-position
[<percentage> | <length> ]{1,2} | [ || ]
Initial value: 0% 0%
[*]How to use the background-attachment property to control whether the background scrolls with the page or remains fixed in place with respect to the view port
Property
Value
background-attachment
scroll | fixed
Initial value: scroll
[*]How to use the background shorthand property to combine all the separate background properties into a single property
background
<’background-color’> || <’background-image’> || <’background-repeat’> || <’background-attachment’> || <’background-position’>
Initial value: n/a
Text Manipulation:
[*]The letter-spacing property and how it is used to add or subtract space between the letters that make up a word
Property
Value
letter-spacing
normal | <length>
Initial value: normal
[*]The word-spacing property and how it is used to add or subtract space between the words of a sentence
word-spacing
normal | <length>
Initial value: normal
[*]The text-indent property and how it is used to indent the text of a paragraph
word-spacing
normal | <length>
Initial value: normal
[*]The text-align property and how it is used to align the text of a document
text-align
left | right | center | justify
Initial value: left
[*]The text-decoration property and how it is used to underline, overline, and strikethrough text
text-decoration
none | [ underline || overline || line-through || blink
Initial value: none
[*]The text-transform property and how it is used to capitalize text or convert text to uppercase or lowercase letters
text-transform
capitalize | uppercase | lowercase | none
Initial value: none
[*]The white-space property and how it is used to control the flow and formatting of text
white-space
normal | pre | nowrap
Initial value: normal
fonts:
[*]The font-family property and how it is used to change the face of a font
Property
Value
font-family
[[ <family-name> | <generic-family> ] [, <family-name>| <generic-family>]* ]
Initial value: Varies depending on the browser or user agent.
[*]The font-style property and how it is used to make a font italic or oblique
font-style
normal | italic | oblique
Initial value: normal
[*]The font-variant property, a property similar to the text-transform property presented in Chapter 5, and how this property is used to create a small-caps effect
font-variant
normal | small-caps
Initial value: normal
[*]The font-weight property and how it is used to increase or decrease how bold or light a font appears
font-weight
normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
Initial value: normal
[*]The font-size property and how it is used to increase or decrease the size of a font
font-size
<absolute-size> | <relative-size> | <length> | <percentage>
Initial value: medium
[*]The font property and how it is used as shorthand to specify a number of other font properties
font
[ <’font-style’> || <’font-variant’> || <’font-weight’> ]? <’font-size’>
[ / <’line-height’> ]? <’font-family’> ] caption | icon | menu | message-box | small-caption | status-bar
The Box Model:
[*]The CSS box model
Property
Value
Margin
[ <length> | <percentage> | auto ] {1,4}
margin-top
margin-right
margin-bottom
margin-left
<length> | <percentage> | auto
[*]CSS box model properties, padding, margins, borders, width, and height
Property
Value
Margin
[ <length> | <percentage> | auto ] {1,4}
margin-top
margin-right
margin-bottom
margin-left
<length> | <percentage> | auto
[*]Controlling line height
Property
Value
Margin
[ <length> | <percentage> | auto ] {1,4}
margin-top
margin-right
margin-bottom
margin-left
<length> | <percentage> | auto
[*]Establishing minimum and maximum dimensions
Width
<length> | <percentage> | auto
initial value: auto
[*]Overflowing content
overflow
visible | hidden | scroll | auto
initial value: visible
CSS Buoyancy-Floating and Vertical Alignment:
[*]The float property and how it is used to change the flow of elements in a document - for instance, to place text beside an image
Property
Value
float
left | right | none
Initial value: none
[*]The clear property and how this property is used to cancel the effects of the float property
clear
none | left | right | both
Initial value: none
[*]The vertical-align property and how this property is used to control the vertical alignment of text to create subscript or superscript text or control vertical alignment in table cells
vertical-align
baseline | sub | super | top | text-top | middle | bottom | text-bottom | <percentage> | <length>
Initial value: baseline
Positioning:
[*]The position property and the four types of positioning that CSS has to offer: static, relative, absolute, and fixed
Property
Value
position
static | relative | absolute | fixed
Initial value: static
top
<length> | <percentage> | auto
Initial value: auto
right
<length> | <percentage> | auto
Initial value: auto
bottom
<length> | <percentage> | auto
Initial value: auto
left
<length> | <percentage> | auto
Initial value: auto
[*]The offset properties top, right, bottom, and left, and how these are used to deliver an element to a specific position in a web document
z-index
auto | <integer>
Initial value: auto
[*]The z-index property and how this property is used to layer the elements of a document
[*]Some practical applications of positioning, such as multicolumn layouts and vertically centering a positioned element
Tables:
[*]The optional table elements that can make it easier to style a table and that make the structure more intuitive
[*]Controlling placement of the table caption
Property
Value
caption-side
top | bottom
Initial value: top
[*]Controlling the layout of the table
[*]Controlling the spacing between table cells
border-spacing
<length> <length>? Initial value: 0
table-layout
auto | fixed
Initial value: auto
页:
[1]