网页制作--标签，表格，表单，框架
网页三部份内容：HTML CSS Javascript
路径：一般做网页的时候用的相对路径。
images/aaa.jpg 网页同一个目录中找images文件夹，再在images里面找aaa.jpg
images/1000/aaa.jpg 网页同一个目录中找images文件夹，再在images里面找1000文件夹，再在1000文件夹中找aaa.jpg
../images/aaa.jpg 找网页上一级文件，在网页上一级文件夹中找images文件夹，在images文件夹中找aaa.jpg
../../images/aaa.jpg 找网页上两级文件，在网页上两级文件夹中找images文件夹，在images文件夹中找aaa.jpg
一、body：
bgcolor 背景颜色
background 背景图片
topmargin
rightmargin
bottommargin
leftmargin
body以上的属性仅做了解。
二、标签：
（一）基本标签：
1.格式控制：
<font face="字体名称" color="颜色" size="大小"></font> 字体
<b></b>加粗 <strong></strong>
<i></i>倾斜 <em></em>
<u></u>下划线
<br> 空格</br>
<pre> 内容里面格式不变</pre>
<center>居中</center>
转义：——需要记住
——空格
<——小于号 <
>——大于号 >
&——&
© ——©
2.内容容器：
<h1></h1> ...<h6></h6> ——标题。默认情况下，加粗，独立一行
<p></p> ——段落。独立一段，默认情况下，段落前后都会有一行大小的空白。
<div></div>——区域标签，层标签。用来划分网页区域，进行页布局。前后换行。
<span></span>——区域标签，层标签。前后不换行。
<ul></ul>——无序列表标签。
<ol></ol>——有序列表标签。
<li></li>——列表项标签，用来放在ol或ul里面的。
（二）常用标签：
1. 超链接
<a href="超链接的路径" target="_blank">超链接显示的内容</a>
书签：
第一步：定义书签 <a name="书签名">内容</a>
第二步：定义超链接 <a href="页面名#书签名">超链接文字</a>
2.图片
<img src="路径（相对）" width="" height="" alt=""/>
3.图片超链接
<a href="超链接的路径"> <img src="图片路径"/> </a>
演示
<body bgcolor="#99CC33" > <font color="#0066ff" face="华文行楷" size="5">字体控制 </font><!--注释--><br> <b>字体加粗</b><br> <i>字体倾斜</i><br> <u>下划线</u><br> <strong>加粗</strong><br> <em>倾斜</em><br> <center>居中</center><br> 回<br>车<br> 空 格<br> <br> <br> <h1>标题1</h1> <h2>标题2</h2> <h6>标题6</h6> <p>段落1</p> <p>段落<br> 2</p> <font>第一种<div>层标签</div><font> <font>第二种<span>层标签</span></font> <ol type="I">有序列表 <li>序号1</li> <li>序号2</li> <li>序号3</li> </ol> <ul type="circle">无序列表 <li>第一</li> <li>第二</li> <li>第三</li> </ul> <img src="images/1.gif"jpg" alt="这是一张图片" width="200"/><br> <a href="http://www.baidu.com.cn"> <img src="images/0.gif"width="200"/> </a><br> <img src="images/5.gif" width="200"/><br>
（三）表格：
<table></table>
bgcolor：背景色。
align：表格在页面中的对齐方式。
width:宽 像素，百分比。
border：边框宽度
cellpadding：边距
cellspacing：间距
<tr></tr>
bgcolor：背景色
align：这一行中的文字的对齐方式
height:高度，一般是像素，也可设百分比。
<td></td>
bgcolor:背景色
align：水平对齐
valign：竖直对齐
width:宽
height:高
colspan：列的跨度。
rowspan：行的跨度。
注意：合并单元格的时候，一定要算好格好。
表的演示
<title>2015年1月16日NBA战况</title> </head> <body bgcolor="#FFFFFF" width="33%" > <table bgcolor="#000000" border="0" cellpadding="0" cellspacing="1"> <tr bgcolor="white" align="center"> <td>交战双方</td> <td>比分</td> <td>mvp</td> <td>数据</td> </tr> <tr bgcolor="white" align="center"> <td colspan="2" width="25%">火箭vs雷霆112:101</td> <td rowspan="2" width="25%">哈登<br>勒布朗詹姆斯</td> <td width="25%">32分9篮板10助攻</td> </tr> <tr bgcolor="white" align="center"> <td>骑士vs湖人</td> <td>109:102</td> <td>36分5篮板6助攻</td> </tr> </table> </body> </html>
（四）表单：
<form id="" name="" action="" method=""></form>
1.文本类
单行文本框：<input id="" name="" type="text" value="内容"/>
多行文本框：<textarea id="" name="" rows="行数" cols="列数">内容</textarea>
密码框：<input id="" name="" type="password" value="内容"/>
隐藏域：<input id="" name="" type="hidden" value="内容"/>
2.按钮类
普通按钮：<input id="" name="" type="button" value="按钮上的文字"/>
提交按钮：<input id="" name="" type="submit" value="按钮上的文字"/>
重置按钮：<input id="" name="" type="reset" value="按钮上的文字"/>
图片按钮：<input id="" name="" type="image" src="图片的路径" width="宽" height="高"/>
表单演示
<form id="f1" name="f1" action="" method=""> <input id="" name="" type="text" value="请输入用户名"/><br> <input id="" name="" type="password" value="请输入用户名密码"> <input id="" name="" type="submit" value="登陆"/><br> <input id="" name="" type="text" value="请输入支持的球队"/><br> <textarea id="" name="" rows="5"cols="20" >请输入支持的原因，字数200字以内</textarea><br> <input type="button" name="" id="" value="火箭支持率"/><br> <input type="button" name="" id="" value="雷霆支持率"/><br> <input id="" name="" type="submit" value="重置"/><br> <input id="" name="" type="image" src="images/png-0035.png"/>联系我们© </form>
（三）、选择类：
1.单选
<input id="" name="组名" type="radio" value="运算的值" checked="checked"/>
2.复选
<input id="" name="组名" type="checkbox" value="运算的值" checked="checked"/>
3.列表
下拉列表:
<select id="" name="">
<option value="1">送餐</option>
<option value="2">取餐</option>
<option value="3">订餐</option>
<option value="4">进餐</option>
</select>
列表：
<select id="" name="" size="大于1的数字" multiple="multiple">
<option value="1">送餐</option>
<option value="2">取餐</option>
<option value="3">订餐</option>
<option value="4">进餐</option>
</select>
4.文件
<input id="" name="" type="file"/>
五、框架
（一）frameset
frameset主要用来分隔浏览器窗口，它所在的页面是用<frameset></frameset>来替换<body></body>
属性：
rows="100,*,100"
cols="100,*"
frameborder="no"
子元素：
<frame name="名称" src="页面的路径" noresize="noresize" scrolling="yes|no|auto"/>
（二）iframe
它是嵌入在body里面的。
<iframe width="300" height="400" frameborder="0" scrolling="no" src="Untitled-3.html"></iframe>
