样式表类型：
1.行内样式表
2.内嵌样式表
3.外部样式表
常用样式：
1.文本样式
名称 |
说明 |
font-size |
字体大小 |
font-family |
字体类型 |
font-style |
字体样式 |
color |
设置或检索文本的颜色 |
text-align |
文本对齐 |
2.背景样式
名称 |
说明 |
background-color |
设置背景颜色 |
background-image |
设置背景图像 |
background-repeat |
设置一个指定的图像如何被重复 |
3.组合属性样式
名称 |
说明 |
不带下划线的超链接样式 |
A{color:blue;
text-decoration:none;}
A:hover{color:red;} |
细边框样式 |
.boxBorder{border-width:1px;
border-style:solid;} |
图片按钮样式 |
.picButton{background-image:url(images/back2.jpg);
border:0px;
margin:0px; 图片不显示解决方案
padding:0px;
height:23px; width:82px;
和图片大小一致
font-size:14px;} |
改变字体大小的样式特效：
<a href="#" onmouseover="this.style.fontSize='24px'"
onmouseout="this.style.fontSize='14px'">免费注册</a>
当鼠标移动到“免费注册”上方时，字体变为：24像素
当鼠标离开“免费注册”时，字体变为：14像素
在CSS属性中使用短横线分隔其名称的属性名，而在Style对象的属性中为什么去掉了这个短横线？譬如：在CSS中，属性background-image、font-size、text-align中都有短横线，
而它们对应的Style对象的属性：backgroundImage、borderColor、fontSize、textAlign都去掉了短横线
其原因是：javascript的标识符不能包含短横线，并且若标识符中包含多个单词时，后面单词的首字母要大写，如属性名fontSize中的“S”字母必须是大写的
如：onmouseover="this.style.backgroundImage='url(images/back2.jpg)'"
通过className属性改变样式：
onmouseover="this.className='类样式名'"
注意：这里的className不能写成"class"
层的显示/隐藏特效：
显示属性display
语法：Object.style.display="value";
value常用取值：
参数值 |
说明 |
block |
默认值。按块显示，换行显示，用该值为对象之后添加新行 |
none |
不显示，隐藏对象 |
inline |
按行显示，和其他元素在同一行显示 |
对比：
1.display指定区域是否在浏览器中显示。设置为display:none 的对象根本就不会显示，在页面中放佛没有该对象一样。
2.visibility指定区域是否可见。设置为visibility:hidden 的对象扔占据着页面的空间，只是该空间看上去是空的。
表单元素定位有两种：
1.document.getElementByIdx_x_x_x_x("id").
2.document.Form名.表单元素名.
其他元素只有一种定位，即document.getElementByIdx_x_x_x_x("id")
常见错误：
onmouseover="this.style.fontSize='14px'"
onmouseover="document.getElementByIdx_x_x_x_x_x_x('id').style.fontSize='14px'"
onmouseover="this.style.backgroundImage='url(images/back2.jpg)'"
//用单引号，注意fontSize,S大写
onmouseover="this.className='mouseOutStyle'" //不是class
document.getElementByIdx_x_x_x_x_x_x('id').style.display="none"; //style属性下才有display属性