1、<html>
<head>
<title>xx</title>
</head>
<body>
<h1>xx
</h1>
</body>
</html>
<a href="/downloads/xx.zip">xx</a>
<br />换行
<hr />水平横线
标题：<h1>......<h6>
2、<div style="color:green">
body{
font-size:10pt;
font-family:Verdana,Geneva,Arial,Helvetica,sans-serif;
color:black;
line-height:14pt;
padding-left:5pt;
padding-right:5pt;
padding-top:5pt;
}
h1{
font:14pt Verdana,Geneva,Arial,Helvetica,sans-serif;
font-weight:bold;
line-height:20pt;
}
img{
padding:3pt;
float:right;
}
a{
text.decoration:none;
}
a:link,a:visited{
color:#8094d6;
}
a:hover,a:active{
color:#FF9933;
}
div.footer{
font-size:9pt;
font-style:italic;
text-align:center;
}
<link rel="stylesheet" type="text/css" href="style.css">
3、css属性：
display:block(显示在下一行)/list-item(有项目符号)/inline/none(隐藏)
width:200px
height
border:建立边框:border-width/border-color/border-style/border-left/border-right/border-top/border-bottom/border所有边。border-style:solid/double/dashed/dotted/groove/ridge/inset/outset/none。border:10px double red;
text-align:center;
text-indent:12px;
font-family:
font-size:
font-style:
font-weight:
padding:
text-decoration:underline/italic/line-through
line-height:
color:
4、h1.hehe 创建类
<hr class='hehe'>
hehe
<hr id="hehe">
hr#hehe 属于hr的hehe ID
<style type="text/css">
</style>
5、列表
<ul>
<li></li>
</ul>
<ol>
<li></li>
</ol>
<dl>
<dt></dt>
<dd></dd>
</dl>
<ol style="list-style-type:upper-roman">
image.png
6、字体
<p style="font-weight:bold;font-style:italic">
几种不常用标签
image.png
7、表格
<table>
<tr>
<th></th>
</tr>
<tr>
<td></td>
</tr>
</table>
<td style="width:20%">
<table border="2" cellpadding="4" cellspacing="2" width="100%">
<tr style="backgroud-color:red;color:white">
<th colspan="2">
<tr style="vertical-align:top">
image.png
image.png
8、<a href="#a">跳到id为a
image.png
9、颜色
10、图像
<img src="myimage.gif" alt="my image">
image.png
<img style="float:right;padding:6px;">
垂直对齐图像
image.png
背景图片
image.png
body{
background:#ffffff url('image.gif') no-repeat top right;
}
11、多媒体
object嵌入多媒体文件
image.png
image.png
image.png
12、框架
image.png
13、边距、填充、对齐、浮动
margin:边距，上下左右
image.png
padding:填充
image.png
text-align:/vertical-align:left/right/center/justify 对齐方式 top/middle/bottom/text-top/baseline/text-bottom
float:浮动left/right
14、CSS水平导航菜单/CSS垂直导航菜单
15、鼠标事件：
image.png
16、打印友好页面
17、表单控件