简单的HTML制做：
html超文本标记语言
HTML文件主体结构：
<!DOCTYPE html>
<html> <!--htlm开始标记 -->
<head> <!--HTML头信息开始标记 -->
<title>本页面标题</title> <!--网页标题标记 -->
</head> <!--头信息结束标记 -->
<body bgcolor="black" text="#ffffff"> <!--网页主体标记 -->
<center> <!--格式标记中的居中标记-->
<h1>这是第一个html实列子</h1> <!--内容标题标记-->
</center> <!--居中格式结束标记-->
<hr width=80%> <!--输出分割线标记-->
<p>本页面显示黑色背景，白色文本</p> <!--段落标记对-->
</body> <!--页面体中内容结束标志-->
</html>
HTML文档头部元素<head></head> 文件的标题<title></title>元素 <base>元素只有一个b必须放在头部，放在任何包含URL地址的语句之前（作用：当遇到相对的URL时<base>实际上是将相对的url转化为完整的绝对的URL）
eg：<base href="URL"target="WINDOW_NAME"/>
<link>元素可用于创建到css样式表的链接{描述俩个文档之间文件链接的关系}
eg：<link rel="stylesheet"type="text/css"href="style.css"/>
<meat>元素：标记属性来定义文件信息的名称、内容。在HTML的头部可以标记任意多个<meat>标记，可以建立多种多样的效果和功能。
eg：<meat name="某个设置值"content="对该设置的值补充具体说明信息"/>
eg：<meat http-equiv="某个设置值"content="对该设置值进行具体补充说明"/>
以上是头部信息的一些基本用法
HTML文档主体标记<body></body>
| 属性 |
描述 |
| text | 设置页面文字的颜色 |
| background | 设置页面背景的图像 |
| bgcolor | 设置页面背景的颜色 |
| bgproperties | 设置页面背景图像为固定，不随页面滚动而滚动 |
| link | 设定页面默认的链接颜色 |
| alink | 设定访问后链接文字的颜色设定页面的上边距 |
| vlink | 访问后链接文字的颜色 |
| topmargin | 设定页面的上边距 |
| teftmargin | 设定页面的左边距 |
id设定标签的ID name设定标签的名称 class设定标签样式的类选择器 style设定标签样式的属性
格式标签：
<br>换行标签 <p>换行段落标签 <center>居中对其标签 <pre>与格式化标记，保留文字在源代码中的标记 <li>l列表项目的标记
<ul>无序列表 <ol>有序列表 <hr>水平分割线标签，用于段落与段落之间的分隔。
<!DOCTYPE html>
<html>
<head>
<title>格式标记测试网络</title>
</head>
<body>
<p>一段文本</p>
<center>这行文本在网页上居中显示</center>
<pre> 上边
左边 右边
下边
</pre>
<hr>
无序顺序列表
<ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
</ul>
有序顺序列表
<ol>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
</ol>
</body>
</html>
html表格
<table> <!--定义表格开始标记-->
<caption>表格名称</caption> <!--定义表格表标题的标记-->
<tr> <!--定义一行标记，在内部建立多组单元格-->
<th>标头单元格</th> <!--定义标头单元格，文字将一粗体显示-->
</tr> <!--行标记结束-->
<tr>
<td>单元格</td>
</tr>
</table>
文本标签
插入图片
HTML框架结构
1、划分框架
cols：用"像素"和"%"分隔左右窗口；“*”表示剩余部分；
rows：用像素和百分号表示剩余部分
frameborder：指定是否显示边框：01
border：设置边框粗细，默认值是像素5
2、子窗口<frame>标签的设定
属性：
src：指加载的URL路径
name：指框架名称，是链接标记的target所要的参数
noresize：指不能调节窗口大小，省略此项可调整
scrolling：指是否需要滚动条，aut根据需要自动出现yes表示有no表示无
frameborder：指是否要边框1显示边框0不显示
border：设置边框的粗细
3、窗口的名称和链接
主窗体代码：
<!DOCTYPE html>
<html>
<head>
<title>使用框架定义后台管理系统</title>
</head>
<frameset rows="85,*" frameborder="1" border="1">
<frame src="top.html" name="top" scrolling="no" noresize/>
<frameset cols="300,*">
<frame src="menu.html" name="menu" scrolling="no" noresize/>
<frame src="main.html" name="main" noresize/>
</frameset>
</frame>
</frameset>
<body>
</body>
</html>
顶部设置大类选项窗体文件：
<!DOCTYPE html>
<html>
<head>
<title>无标题文档</title>
</head>
<body>
<center><h2>后台管理平台</h2></center>
<p>
<a href="menu.html" target="menu">大类管理（一）</a>
<a href="menu2.html" target="menu">大类管理（二）</a>
<a href="menu3.html" target="menu">大类管理（三）</a>
</p>
</body>
</html>
左边设置菜单选项窗体文件：
<!DOCTYPE html>
<html>
<head>
<title>无标题文档</title>
</head>
<body>
<center><h3>大类（一）菜单</h3></center>
<p>
<a href="main.html" target="main">管理选项</a>
<a href="main2" target="main">管理选项二</a>
<a href="main3" target="main">管理选项三</a>
</p>
</body>
</html>
右边设置窗体文件：
<!DOCTYPE html>
<html>
<head>
<title>无标题文档</title>
</head>
<body>
<center><h4>大类管理一 > 管理选项2 > 内容设置</h4></center>
</body>
</html>
HTML表单设计
1、表单标签<from>
| 属性 | 描述 |
| name | 表单名称 |
| method | 定义处理程序从表中获取的信息，可取值GET和POST中的一个。省略.......... |
| action | 该属性的值是处理的程序名（如果值为空则文档的URL被使用，交表单时执行URL里面的程序） |
| enctype | 设置表单资料的编码方式 |
| target | 该属性和链接中的同名属性类似，用来指定目标窗口 |
<form>标签中必须加action属性并且不能为空；eg：<form action="login.php" method="post">
不需要使用也需要定义这个样子：<form actio="no">
2文本域和密码域
在<form>标签内定义的标签具有重要的地位，该标签是单个标签，没有结束标记
<input type="">标签来定义一个用户的输入；提供了9中类型的用户输入，由type属性来决定用那种类型
| 属性 | 描述 |
| type | 该属性的值为text表示为这是一个文本输入区，如果为password则表示这是密码输入区 |
| name | 定义空间名称 |
| value | 指定空件初始值，该值就是浏览器被打开时文本框中的内容 |
| size | 指定空件的宽度，表示该文本框可输入的最大字符数 |
| maxlength | 表示该用户允许用户输入的最大字符数 |
eg：<input type"text" name="field_name" value="field_value" maxlength="h">
eg：<input type="passworde" name="field_name" value="field_value" maxlength="h">
3、提交重置和普通按钮
在<input>标签中
当type属性值为“submit”时这是一个提交按钮
当type属性值为“reset”时这是一个重置按钮
当type属性值为“button”这是一个普通按钮
eg：<input type "submit" name="field_name" value="field_value">
4、单选按钮和复选按钮
单选按钮和复选框都有“选中”“未选中”俩种状态。同一组单选框中含有多个单选框这件相互排斥的，只允许用户选择其中的一个。
复选框和单选框的区别：复选框允许用户选中同一表中的多个或全部选项，也可以选其中一个
他么都只有在选中时数据才会被提交到服务器端，其语法格式：
eg：<input type="radio" name="field_name" value="field_value" checked> 单选按钮
eg：<input type="checkbox" name="field_name" value="field_value" checked> 复选框
单选按钮和复选按钮都可以通过checked属性设置为选中状态。
5、隐藏区域
type属性值为hidden建立一个隐藏区域name和value属性是必须的，用来隐藏域的名字和值，基本语法格式：
<input type"hidden" name="field_name" value="field_value">
6、多行文本域
在<form>标签中使用<textarea>标签制作多行文本域
eg：<textarea name="field_name" rows="value" value="field_value" >......（多行文本域设置默认值）....</textarea>
name属性指定多行文本的名称；通过rows和cols俩个属性分别指定多行文本域显示字符的行数和列数，单位是字符的个数
7、下拉列表域
在<form>标签中使用<slect>标签创建一个菜单的下拉列表域，该标签具有multiple、name和size属性，multiple属性不用赋值直接加入标签就可以使用；
size：设置列表的高度默认值为1，若没有设置multiple属性，显示的将是一个下拉式的列表域。name属性定一此表框的名称哈哈：
<select name="name" size="value"mulitiple>
<option value="value" selected>选项</option>
<option value="value">选项</option>
............
</select>
option标签是用来指定列表中的而一个选项，需要凡在<select></select>标签成对之间。此标签具有selected和value属性，selected属性用来指定默认像value用来给<option>标签指定的哪一个选项赋值，
综合实列：
<!DOCTYPE html>
<html>
<head>
<title>LAMP学员基本信息</title>
</head>
<body>
<table align="server" width="500" border="0" cellpadding="2" cellspacing="0">
<caption align="center"><h2>学员基本信息</h2></caption>
<form action="server.php" method="post">
<tr>
<th>姓名：</th>
<td><input type="text" name="usrname" size="20"></td>
</tr>
<tr>
<th>性别：</th>
<td>
<input type="radio" name="sex" value="1" checked>男
<input type="radio" name="sex" value="2" checked>女
<input type="radio" name="sex" value="0" checked>保密
</td>
</tr>
<tr>
<th>学历：</th>
<td>
<select name="edu">
<option>--请选择--</option>
<option value="1">高中</option>
<option value="2">大专</option>
<option value="3">本科</option>
<option value="4">研究生</option>
<option value="2">其他</option>
</select>
</td>
</tr>
<tr>
<th>选修课程</th><!--使用复选框定义选修输入框 -->
<td>
<input type="checkbox" name="course[]" value="4">Linux
<input type="checkbox" name="course[]" value="5">Apache
<input type="checkbox" name="course[]" value="6">MySQL
<input type="checkbox" name="course[]" value="7">PHP
</td>
</tr>
<tr> <!--使用多行文本输入框定义自我评价输入框 -->
<th>自我评价</th>
<td><textarea name="eval" rows="4" cols="40"></textarea></td>
</tr>
<tr><!--定义哦提交和重置俩个按钮-->
<td colspan="2" align="center">
<input type="submit" name="submit" value="提交">
<input type="reset" name="reset" value="重置">
</td>
</tr>
</form>
</table>
</body>
</html>
在浏览器可以浏览得到；
小结：html语言的全部语法，文档的主体结构，头部中个元素的作用和使用意义，全部格式标签属性，文本标签及其属性，图像标签的应用，表格，框架表单项的应用。
、