CSS标签对象

标签对象
CSS操作
CSS样式表是对HTML标签的外观进行定义，几乎所有的HTML标签都有Class属性和Style属性
CSS操作
HTML中与CSS相关的标签属性
class属性
style属性
同时包含有class属性和style属性
标签将使用class和style属性指定的所有样式
如果class和style属性指定了两个相同的样式，那么使用style属性定义的样式取代class属性定义的样式
使用JavaScript可以动态改变style属性，从而改变标签的样式，也就是改变标签的显示方式
style属性-语法：
<element>.style.<sheettype>=<value>
element   需要改变样式的标签对象
style   标签对象的style属性
sheettype  样式的类型
注意：在JavaScript中书写方式和CSS样式表和Style属性中样式书写方式有所不同
style属性 - css样式表和style属性之间的关系：
如果是简单样式类型，即只有一个英文单词的样式类型，那么两者的书写方式相同。
如果是复合样式类型，即有两个英文单词的样式类型，那么JavaScript中的书写方式为第一个单词全部小写，第二个单词的首字母大写，其余小写；在css和style中，两个单词全部使用小写，单词之间使用“-”符号分隔
style属性 - css样式表和style属性之间的关系：
例如：
css书写方式 JavaScript书写方式
color color
font-size fontSize
background-image backgroundImage
注意：使用style属性可以改表标签style属性定义的样式，不可以改变class属性定义的样式
css样式表可以定义标签外观，在标签中引用css样式表使用class属性，在JavaScript中使用className属性来引用标签对象的样式

class属性-语法
<element>.className=<cssName>
element   需要改变样式的标签对象
className  表示引用标签的class属性
cssName  样式表名称css样式表和style    属性之间的关系

DIV操作
DIV标签与层
DIV标签在HTML语言中有着重要作用，DIV标签在网页上表示为层。层是网页上的一个容器，它可其他的标签。DIV标签的位置有两种，一种的相对位置，一种是绝对位置。相对位置表示层的位置由包含DIV标签的上层标签的位置确定，绝对位置是指直接在DIV标签中指定在页面上的坐标。
绝对位置的层可以叠加，也就是说一个层可以位于另外一个层的上面，上面的层覆盖下面的层。也就是说，绝对位置的层由三个方向，X方向代表着离网页左边界的位置，Y方向代表离网页上边界的位置，Z方向表示层的叠加顺序。
DIV标签的重要属性
ALIGN   ?设置或获取对象相对于显示或表格的排       列方式
CLASS   ?设置或获取对象的类。
DISABLED  ?设置或获取控件的状态。
NOWRAP  ?设置或获取浏览器是否自动执行换行
ID   ?获取标识对象的字符串 。
STYLE   ?为该设置元素设置内嵌样式。
TABINDEX  ?设置或获取定义对象的 Tab 顺序的索引

JavaScript中DIV对象的重要属性
align 设置或获取对象相对于显示或表格的排列方式
className 设置或获取对象的类
clientHeight/ clientWidth/ clientTop/ clientLeft 获取对象的高度 、宽度、上和左坐标

disabled 设置或获取控件的状态
innerHTML 设置或获取位于对象起始和结束标签内的 HTML
offsetHeight /offsetWidth /offsetTop /offsetLeft 获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度、宽度、上和左坐标
offsetParent 获取定义对象 offsetTop 和 offsetLeft 属性的容器对象的引用
parentElement 获取对象层次中的父对象
scrollHeight /scrollWidth /scrollTop /scrollLeft 获取对象的滚动高度、宽度、上和左坐标

移动DIV层

DIV标签的事件
onblur   在对象失去输入焦点时触发。
onclick   在用户用鼠标左键单击对象时触发。
onfocus   当对象获得焦点时触发。
onkeydown  当用户按下键盘按键时触发。
onkeypress  当用户按下字面键时触发。
onkeyup   当用户释放键盘按键时触发。
 当用户将鼠标划过对象时触发。
 当用户将鼠标指针移出对象边界时触发。
 当用户在鼠标位于对象之上时释放鼠标按钮时触发。

event 对象
clientX /clientY 设置或获取鼠标指针位置相对于窗口客户区域的 x 坐标/y坐标，其中客户区域不包括窗口自身的控件和滚动条
clientX /clientY 设置或获取鼠标指针位置相对于窗口客户区域的 x 坐标/y坐标，其中客户区域不包括窗口自身的控件和滚动条
offsetX /offsetY 设置或获取鼠标指针位置相对于触发事件的对象的 x 坐标/y坐标
altKey /ctrlKey/shiftKey 设置或获取 Alt 键/CTRL键/ SHIFT键的状态
altLeft /ctrlLeft/shiftLeft 设置或获取左 Alt 键/CTRL键/SHIFT键的状态
returnValue 设置或获取事件的返回值
srcElement 设置或获取触发事件的对象
Type 从 event 对象中获取事件名称
fromElement 设置或获取事件发生时激活或鼠标将要离开的对象
keyCode 设置或获取与导致事件的按键关联的 Unicode 按键代码
propertyName 设置或获取对象上发生更改的属性名称
onmouseout 当用户将鼠标指针移出对象边界时触发
onmouseup 当用户在鼠标位于对象之上时释放鼠标按钮时触发

本文出自 “飞翔我的世界” 博客，谢绝转载！