[HTML] 纯文本查看 复制代码
<ul>[/align] <li><a href="../案例一：网站信息页面的显示/案例一：网站信息页面的显示.html">传智播客</a></li>
<li><a href="http://www.baidu.com" target="_self">百度</a></li>
<li><a href="http://www.163.com" target="_blank">网易</a></li>
<li>百合</li>
</ul> * type属性
*disc ：实心点.
*circle ：空心圆
*square ：方块.
* type属性:
* 1 ：数字类型
* a ：英文类型
* i ：罗马字符
* start属性:从哪开始
超链接的target属性:
* _self
* _blank
* _parent
案例四：网站的首页的显示：
4.1 需求：网站的首页的设计：
4.2 分析：4.2.1 技术分析：【HTML的表格标签】
[HTML] 纯文本查看 复制代码
<table>
<tr>
<td></td>
<td></td>
</tr>
</table>
属性:
width :表格宽度
height :表格高度
border :边框
align :表格水平位置:
*left
*center
*right
<td>的属性:
*colspan=”列数”
*rowspan=”行数”
4.2.2 步骤分析：【步骤一】创建一个html的页面
【步骤二】创建一个8行1列的表格
【步骤三】为每行内容填充数据.
案例五：网站的注册页面的显示：5.1 需求：使用HTML完成注册页面的设计：
5.2 分析：5.2.1 技术分析【HTML的表单标签（*****）】
HTML的表单标签：<form>
* 常用属性:
*action属性:提交的路径.默认提交到当前页面
*method属性:请求的方式.GET和POST.默认是GET.
***** GET方式和POST方式的区别?
* GET :数据会显示到地址栏中.GET方式提交是有大小的限制.
* POST :数据不会显示到地址栏中.POST方式提交的是没有大小限制.
HTML中表单元素：
* <input type=”text”> :文本框.
* 常用属性:
* name :表单元素的名称.必须有name属性，然后后台才可以接收数据.
*value :文本框的默认值.
*size :文本框的长度.
*maxlength:文本框输入的最大长度.
*readonly:只读文本框.
* <input type=”password”> :密码框.
* 常用属性:
*name :表单元素的名称.必须有name属性，然后后台才可以接收数据.
*value :密码框的默认值.
*size :密码框的长度.
*maxlength:密码框输入的最大长度.
* <input type=”radio”> :单选按钮.
* 常用的属性:
*name :表单元素的名称.必须有name属性，然后后台才可以接收数据.
*value :单选按钮的默认值.
*checked:单选按钮默认被选中.
* <input type=”checkbox”> :复选按钮.
* 常用的属性:
*name :表单元素的名称.必须有name属性，然后后台才可以接收数据.
*value :单选按钮的默认值.
*checked:单选按钮默认被选中.
* <input type=”button”> :普通按钮.没有任何功能的按钮.
* <input type=”submit”> :提交按钮.
* <input type=”reset”> :重置按钮.
* <input type=”file”> :文件上传的表单项.
* <input type=”hidden”> :隐藏字段.
* <input type=”image”> :图片按钮
* <select> :下拉列表.
* <textarea> :文本域.
5.2.2 步骤分析：【步骤一】创建一个html的文档
【步骤二】使用表格布局页面
【步骤三】在页面中使用表单标签完成注册页面
5.3 代码实现[HTML] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<table border="1" width="90%" align="center">
<tr>
<td>
<!--Logo部分-->
<table width="100%" border="1">
<tr>
<td>
<img src="img/logo2.png" />
</td>
<td>
<img src="img/header.png" />
</td>
<td>
<a href="#">登录</a>
<a href="#">注册</a>
<a href="#">购物车</a>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table width="100%" border="1" bgcolor="black" height="100%">
<tr>
<td>
<a href="">首页</a>
<a href="">手机数码</a>
<a href="">电脑办公</a>
<a href="">烟酒糖茶</a>
<a href="">鞋靴箱包</a>
</td>
</tr>
</table>
</td>
</tr>
<tr height="400" background="img/regist_bg.jpg">
<td>
<form action="../案例四：网站的首页的显示/案例四：网站首页.html" method="post">
<table border="5" width="60%" align="center" bgcolor="white">
<tr>
<td>
用户名
</td>
<td>
<input type="text" name="username" value="" size="20" maxlength="6" >
</td>
</tr>
<tr>
<td>
密码
</td>
<td>
<input type="password" name="password"/>
</td>
</tr>
<tr>
<td>
确认密码
</td>
<td>
<input type="password" name="repassword"/>
</td>
</tr>
<tr>
<td>
邮箱
</td>
<td>
<input type="text" name="email"/>
</td>
</tr>
<tr>
<td>
姓名
</td>
<td>
<input type="text" name="name"/>
</td>
</tr>
<tr>
<td>
性别
</td>
<td>
<input type="radio" name="sex" value="男" checked>男<input type="radio" name="sex" value="女">女
</td>
</tr>
<tr>
<td>
爱好
</td>
<td>
<input type="checkbox" name="hobby" value="篮球" checked>篮球
<input type="checkbox" name="hobby" value="足球">足球
<input type="checkbox" name="hobby" value="排球">排球
<input type="checkbox" name="hobby" value="羽毛球">羽毛球
</td>
</tr>
<tr>
<td>
籍贯
</td>
<td>
<select name="province">
<option>--请选择--</option>
<option value="北京" selected>北京</option>
<option value="上海">上海</option>
<option value="广州">广州</option>
</select>
</td>
</tr>
<tr>
<td>
头像
</td>
<td>
<input type="file" name="upload">
</td>
</tr>
<tr>
<td>
简介
</td>
<td>
<textarea cols="20" rows="4" name="info">我是：</textarea>
</td>
</tr>
<tr>
<td>
生日
</td>
<td>
<input type="text" name="birthday"/>
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="注册"/><input type="reset" value="重置"/><input type="button" value="我是按钮">
</td>
</tr>
</table>
</form>
</td>
</tr>
<tr>
<td height="70">
<img src="img/footer.jpg" width="100%" height="100%">
</td>
</tr>
<tr>
<td align="center">
<a href="../案例一：网站信息页面的显示/案例一：网站信息页面的显示.html">关于我们</a> 联系我们 招贤纳士 法律声明 <a href="../案例三：网站列表页面的显示/案例三：网站列表页面的显示.html">友情链接</a> 支付方式 配送方式 服务声明 广告声明 <br/>
Copyright © 2005-2016 传智商城 版权所有
</td>
</tr>
</table>
</body>
</html>[HTML] 纯文本查看 复制代码
<input type=”email”>
<input type=”date”>
<input type=”number”>
<input type=”color”>
案例六：网站的后台页面的显示：6.1 需求：一个网站需要有后台页面,后台页面设计：
6.2 分析：6.2.1 技术分析：【HTML的框架标签】
框架标签:<frameset>,标签与body标签是冲突,有frameset就可以没有body.
* 属性:
* rows
* cols
使用<frame>标签，frame代表切分的每个部分.
6.2.2 步骤分析:【步骤一】创建一个html的页面
【步骤二】将整个页面分成上下两个部分.
【步骤三】将页面的下半部分分成左右两个部分.
【步骤四】在左侧页面中添加一些链接.
【步骤五】点击左侧链接,将页面的内容显示到右侧.
6.3 代码实现： [HTML] 纯文本查看 复制代码
<frameset rows="15%,*">[/align] <frame src="top.html" name="top"/>
<frameset cols="15%,*">
<frame src="left.html" name="left"/>
<frame src="right.html" name="right"/>
</frameset>
</frameset>空格 :
< :<
> :>
收藏
淘帖
踩
