CSS 初识

CSS样式表 初识
1.CSS的作用
让结构和样式进行分开,提升效率;


2.css属性详解
font-family 设置字体
例如:
font-family:<font1>,<font2>...<fontn> 浏览器会依次查询设置的字体,如果都没有,则使用默认的字体.


font-style 字体风格
例如:
font-style:normal|italic|oblique 分别是:默认,斜体,倾斜显示


font-variant 字体变形
例如:
font-variant:normal|small_caps 分别是:默认,小型大写字母


font-weight 字体加粗
例如:
font-weight:normal|bold|bolder|lighter|100|200 分别是:默认为7,约为400;粗体,约为700;粗体再加粗,约为900;比默认的还小;数字越小,字体越细


font-size 字号的控制
例如:
font-size:35px;//px是浏览器通用的.还有其他的单位.pt...


text-transform 文字的更改
例如:
text-transform:uppercase|lowercase|capitalize|none 分别是:大写,小写,首字母大写,正常显示


text-decoration 文字修饰
例如:
text-decoration:underline|overline|line-through|blink|none 分别是:下划线,上划线,删除线,文字闪烁,无上述效果,正常显示;


font 字体属性
例如:
font:font-family|font-style|font-variant|font-weight|font-size 


word-spacing/letter-spacing  设置字间距以及字母间距(单词,字母)


line-height 设置行距


text-align/vertical-align  文字对齐
例如:
text-align:left|right|center|justify
vertical-align:top|bottom|text_bottom|baseline|middle|sub|supper


text-indent 首行缩进
例如:
text-indent:数字|百分比 


color 颜色
例如:
color:red;


background-color 背景颜色
例如:
background-color:red;


background-image 背景图像属性
例如:
background-image:<url>|none;


background-repeat  背景图片重复属性
例如:
background-repeat:repeat|repeat-x|repeat-y|no-repeat


background-attachment 固定背景图片属性
例如:
background-attachment:scroll|fixed 
表示:背景图片是随内容滚动的还是固定的.


background-position 背景图片的位置
例如:
background-position:百分比|长度|关键字
background-positon:X% y%|x y|


background  背景
例如:
background:上述背景的属性.


标签<a> 对应的anchor的语法说明:
a:link 尚未链接过的超链接文字的样式
a:sisited 已经链接过的超链接的文字
a:active 鼠标单击超链接后,链接文字的显示样式
a:hover 鼠标拖动到超链接文字上时,超链接显示的文字效果


cursor  设置光标的属性


margin,border padding来控制段落.图片和表格等对象的样式
例如:
margin-(top,right,bottom,left):长度|百分比|auto


border-width 是指边框的宽度
例如:
border-width:thin|medium|thick|长度


border-style 设置边框的样式
例如:
border-style:none|solid|double|dotted|dashed|groove|ridge|inset|outset  分别是:实线,双直线,小点虚线,大点虚线,3D凹线,


padding-(top,right,left,bottom) 设置内边界
例如:
padding-(top,right,left,bottom):长度|百分比