div+css学习笔记(一)

• Font 字体：

Color
font-family -- 字体
font-size -- 字体大小
font-style : normal | italic | oblique
normal : 正常的字体 italic : 斜体 oblique : 倾斜的字体
font-weight : normal | bold | bolder | lighter | number
normal : 正常的字体 bold : 粗体
text-decoration : none || underline || blink || overline || line-through
none : 无装饰 blink : 闪烁underline : 下划线line-through : 贯穿线
overline : 上划线
line-height : normal | length 行高
letter-spacing : normal | length 字间距

• text 文本:

text-indent : length文本的缩进
vertical-align : baseline |sub | super |top |text-top |middle |bottom |text-bottom |length垂直对齐
text-align : left | right | center | justify文本对齐方式

• background 背景:

background-color : transparent | color背景颜色
background-image : none | url (url) 背景图像
background-position : length || length背景图像位置

• position 定位:

position : static | absolute | fixed | relative
static :无特殊定位，absolute :绝对定位。relative : 相对，对象不可层叠
z-index : auto | number
top : auto | length
right : auto | length
bottom : auto | length
left : auto | length

• Dimensions 尺寸:

height : auto | length
max-height : none | length
min-height : none | length
width : auto | length
max-width : none | length
min-width : none | length

 

• Layout 布局:

clear : none | left |right | both
none :允许两边都可以有浮动对象
both :不允许有浮动对象
left :不允许左边有浮动对象
right :不允许右边有浮动对象
float : none | left |right
none :对象不浮动
left :对象浮在左边
right :对象浮在右边
visibility : inherit | visible | collapse | hidden
inherit :继承上一个父对象的可见性
visible : 对象可视
hidden : 对象隐藏

• Margins 边界/外补丁:

margin : auto | length
margin-top : auto | length
margin-right : auto | length
margin-bottom : auto | length
margin-left : auto | length

• Outlines 轮廓:

outline-style : none |dotted |dashed |solid |double |groove |ridge |inset |outset
none :无边框。与任何指定的outline-width值无关
dotted : 点线边框
dashed :虚线边框
solid :实线边框
double : 双线边框。两条单线与其间隔的和等于指定的oueline-width值
groove : 根据outline-color的值画3D凹槽
ridge : 根据outline-color的值画菱形边框
inset :根据outline-color的值画3D凹边
outset :根据outline-color的值画3D凸边

• border 边框:

border-color : color
border-style : none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset
none : 无边框。与任何指定的border-width值无关
hidden :隐藏边框。IE不支持
solid : 实线边框
double :双线边框。两条单线与其间隔的和等于指定的border-width值
border-width : medium | thin | thick | length
border-top : border-width || border-style || border-color
border-top : border-width || border-style || border-color

 

Paddings 内补丁/填充：

padding : length
padding-top : length
padding-right : length
padding-bottom : length
padding-left : length

Lists 列表 :

list-style：
list-style-image : none | url (url) 列表项标记的图像
list-style-type : disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none | armenian | cjk-ideographic | georgian | lower-greek | hebrew | hiragana | hiragana-iroha | katakana | katakana-iroha | lower-latin | upper-latin
disc : 　CSS1　实心圆
circle : 　CSS1　空心圆
square : 　CSS1　实心方块
decimal : 　CSS1　阿拉伯数字
lower-roman : 　CSS1　小写罗马数字
upper-roman : 　CSS1　大写罗马数字
lower-alpha : 　CSS1　小写英文字母
upper-alpha : 　CSS1　大写英文字母
none : 　CSS1　不使用项目符号
armenian : 　CSS2　传统的亚美尼亚数字
cjk-ideographic : 　CSS2　浅白的表意数字
georgian : 　CSS2　传统的乔治数字
lower-greek : 　CSS2　基本的希腊小写字母
hebrew : 　CSS2　传统的希伯莱数字
hiragana : 　CSS2　日文平假名字符
hiragana-iroha : 　CSS2　日文平假名序号
katakana : 　CSS2　日文片假名字符
katakana-iroha : 　CSS2　日文片假名序号
lower-latin : 　CSS2　小写拉丁字母
upper-latin : 　CSS2　大写拉丁字母

Pseudo- Classes 伪类:

• :link
• :hover
• :active
• :visited

Length 长度:

• px
• em
• ex
• pt
• pc
• in
• mm
• cm
颜色 Color
• rgb(RGB)
• #RRGGBB
• Color Name