css外边距
//居中auto
margin:0 auto;
第一个0是上下边距为0,auto是左右根据窗口大小相对居中
//上、下、左、右外边距
margin-top:
margin-bottom:
margin-left:
margin-right:
//综合声明外边距
-----两个值
margin:x y;
x:上下
y:左右
-----三个值
margin:x y n;
x:上
y:左右
n:下
-----四个值
margin:x y n z;
x:上
y:右
n:下
z:左
css内边距
//上、下、左、右内边距
padding-top:
padding-bottom:
padding-left:
padding-right:
//综合声明内边距
-----两个值
padding:x y;
x:上下
y:左右
-----三个值
padding:x y n;
x:上
y:左右
n:下
-----四个值
padding:x y n z;
x:上
y:右
n:下
z:左
css列表属性
//不显示li的点
list-style:none;
//替换li前面默认图标
list-style-image
//定义列表排序位置
list-style-position:
outside:表示列表排序标记的位置不在文本内容里面,并且文本内容不与列表排序的标记对齐
inside:表示列表排序标记的位置在文本内容里面,并且文本内容与列表排序的标记对齐
//定义列表排序符号样式
list-style-type:
//综合声明列表属性list-style
list-style:url/样式 position属性;
css伪类和伪元素
//未访问的链接伪类:link
a.选择器:link{属性:属性值}
<style type="text/css">
a.ni:link{
color:#F00;
font-size:50px;
}
</style>
</head>
<body>
<a class="ni" href="http://www.baidu.com">百度</a>
</body>
</html>
//已访问的链接伪类:visited
a.选择器:visited{属性:属性值}
//鼠标经过时的链接伪类:hover
a.选择器:hover{属性:属性值}
//鼠标按下时的链接伪类:active
a.选择器:active{属性:属性值}
伪元素
//首字母样式设置first-letter
a 选择器:first-letter{属性:属性值}
//使用伪元素只能用修饰文本的属性来对伪元素进行修饰,不能用修饰框架之类的属性来对伪元素进行修饰
//首行样式设置first-line
a 选择器:first-line{属性:属性值}
//还有:before、:after
脚本
基本写法就不用说了
//替换文本
<noscript>替换文本</noscript>
noscript 元素用来定义在脚本未被执行时的替代内容(文本)。
此标签可被用于可识别 <script> 标签但无法支持其中的脚本的浏览器。
//嵌入对象
<object codetype="application/java-archive" classid="Dao.java" codebase="Dao.java">
</object>
单击/双击事件
//单击事件onclick
<body>
<span onclick="name();">你好</span>
</body>
<script type="text/javascript">
function name(){
alert(0);
}
</script>
//双击事件ondblclick
<body>
<span ondblclick="name();">你好</span>
</body>
<script type="text/javascript">
function name(){
alert(0);
}
</script>
鼠标触发事件
//鼠标按下事件onmousedown
<body>
<span onmousedown="name();">你好</span>
</body>
<script type="text/javascript">
function name(){
alert(0);
}
</script>
//鼠标释放事件onmouseup
<body>
<span onmouseup="name();">你好</span>
</body>
<script type="text/javascript">
function name(){
alert(0);
}
</script>
//鼠标停留事件onmousemove
<body>
<span onmousemove="name();">你好</span>
</body>
<script type="text/javascript">
function name(){
alert(0);
}
</script>
//鼠标经过事件onmouseover
<body>
<span onmouseover="name();">你好</span>
</body>
<script type="text/javascript">
function name(){
alert(0);
}
</script>
//鼠标离开事件onmouseout
<body>
<span onmouseout="name();">你好</span>
</body>
<script type="text/javascript">
function name(){
alert(0);
}
</script>
键盘触发事件
//按下键盘按键事件onkeydown
<input type="text" onkeydown="alert('键盘按下');"/>
//按下并任意释放一个键事件onkeypress
<input type="text"
onkeypress="alert('按下键盘按键并释放按键');"/>
//释放键盘按键事件onkeyup
<input type="text" onkeyup="alert('按下键盘按键并释放按键');"/>
页面事件
//图片下载时被中断事件onabort
<img src="bd_logo1.png" onabort="alert(0);"/>
只支持img标签
//当前页面的内容将要被改变时触发事件 如:关闭页面
<body onbeforeunload="alert(0);">
//页面出错事件
<img src="image.gif" onerror="alert(0);" />
支持<img>, <object>, <style>标签
支持javasrcipt对象:window, image
//页面加载完事件
<body onload="alert(0);">
支持<body>, <frame>, <frameset>, <iframe>, <img>, <link>, <script>标签
支持javasrcipt对象:image, layer, window
//改变浏览器的窗口大小时触发事件
<body onresize="alert(0);">
支持标签.....等
支持javasrcipt对象:window
//拖动滚动条事件
<body onscroll="alert(0);">
//离开页面事件
<body onunload="alert(0);">
支持<body>, <frameset>标签
支持javasrcipt对象:window
表单事件
//选定元素失去焦点
<input type="text" onblur="alert(0);"/>
//选定元素发生改变事件
<input type="text" onchange="alert(0);" value="0"/>
//当元素获得焦点
<input type="text" onfocus="alert(0);"/>
//表单重置事件
<form onreset="alert(0);">
<input type="text" />
<input type="reset" />
</form>
//表单提交事件
<form onsubmit="alert(0);">
<input type="text"/>
<input type="submit"/>
</form>
滚动字幕事件
//字幕内容滚动至显示范围之外事件onbounce
<marquee behavior="scroll" onbounce="alert(0);" width="300px;">滚</marquee>
//完成需要显示的内容后事件
<marquee behavior="scroll" onfinish="alert(0);" width="300px;">滚</marquee>
//开始显示内容事件
<marquee behavior="scroll" onstart="alert(0);" width="300px;">滚</marquee>
编辑事件
//出现菜单事件
<body oncontextmenu="alert(0);">
//内容被复制后事件
<body oncopy="alert(0);">
//内容被剪切时事件
<body oncut="alert(0);">
//鼠标拖动事件
<body ondrag="alert(0);">
//失去鼠标移动所形成选择焦点事件
<body onlosecapture="alert(0);">
//内容不粘贴事件
<body onpaste="alert(0);">
//内容被选择时事件
<body onselect="alert(0);">
//内容选择将开始发生时事件
<body onselectstart="alert(0);">
数据绑定
//数据完成由数据源对象的传送事件
onAfterUpdate
//数据来源发生变化时事件
onCellChange
//数据接收完成时事件
onDataAvailable
//数据源发生变化时事件
onDatasetChanged
//全部有效数据读取完毕事件
onDatasetComplete
//取消数据传送事件
onBeforeUpdate
//取消数据传送时,代替onAfterUpdate事件onErrorUpdate
取消数据传送时,代替onAfterUpdate事件是指当使用onBeforeUpdate事件触发取消了数据传送,onError事件用来代替onAfterUpdate
外部事件
//文档被打印后事件
onAfterPrint
<body onAfterPrint="alert(0);">
//文档即将被打印时事件
onBeforePrint
<body onBeforePrint="alert(0);">
//滤镜效果发生变化时事件
onFilterChange
<开始标签 onFilterChange=""></闭合标签>
//按下F1或者帮助选择时事件
onHelp
<body onHelp="alert(0);">
//对象的属性之一发生变化时事件
<开始标签 onPropertyChange=""></闭合标签>