css定义
1.链接外部文件
<head>
<title>xx</title>
<link rel=stylesheet href="css文件地址" type="text/css">
</head>
2.定义内部样式
<head>
<style type="text/css" >
body{font-size :10px ;color:black}
<style>
</head>
css规则结构
选择器,属性,值 selector{property:value;} eg:font{color:red;}
class(类)选择符
class选择器对应一个“.”符号,eg: .fontSize{font-size:14px} <h1 class ="fontSize">
ID选择符
id选择符对应“#”字符,eg: #txtColor {color:red;} 对应html:<p id="txtColor">这个段落是红色字体。</p>
class和ID选择符的区别
a.id应该具有唯一性。 b.class可以多次出现。c.id优先级高于class。
CSS字体
color :字体颜色
font-family :字体
font-size:字号
font-weight:字体粗细(bold,normal)
font-style:字体格式(italic斜体,oblique标准斜体)
text-decoration:字体修饰(Underline下划线,overline"上划线",line-through"删除线",blink霓虹灯效果
CSS颜色及背景
background-image:url("地址")
background-repeat:背景图片排列方式(repeat:在水平和垂直方向排列反复显示;repeat-x:只在水平方向重复显示;repeat-y:只在垂直方向重复显示;no-repeat:只显示一张,无重复。
background-position:显示位置(数值/%设置,left和top的值相当于0%,center相当于50%,right和bottom相当于100%;如果只指定一个,其余默认为center)
background-attchment:是否固定(fixed固定,scroll滚动)
CSS文本属性
text-indent:文本缩进(数值)
text-align:文本对齐(left,right,center,justify)
white-space:空白处理(normal:默认,空白会被浏览器忽略;pre:空白被浏览器保留。nowrap:文本不换行;pre-wrap:保留空白符序列,正常换行;pre-line:合并空白符序列,但保留换行符。
line-height:行高(normal:默认;number:设置数字)
length:设置固定的行间距(%基于当前字体尺寸的百分比间距)
vertical-align:垂直对齐(baseline:默认,元素放置在父元素的基线上;sub:垂直对齐文本的下班。。。)
word-spacing:单词间距
letter-spacing:字母间隔
text-decoration:文本修饰(none:默认;underline:定义文本下的一条线;overline:文本上的一条线;line-through:穿过文本一条线)
blink:闪烁的文本
定位
position
static:默认,始终处于页面流给予的位置(static元素会忽略任何top,bottom,left或right声明)
relative:相对定位。位置被设置为relative的元素,可将其移至相对于其正常位置的地方,因此,“left:20"将向元素的left位置添加20个像素。
absolute:绝对定位,位置设置为absolute的元素,可定位于相对包含它的元素的指定坐标。此元素的位置可通过”left","top","right"及“buttom"属性来规定。
fixed:位置设置为fixed的元素,可定位与相对浏览器窗口的指定坐标。此元素的位置可通过”left","top","right"及“buttom"属性来规定。不论窗口滚动与否,元素都会留在那个位置
关键字:padding,margin,border,position,relative,absolute,float,clear,overflow