HTML
排版标签
<!-- 水平线标签 -->
<hr align="center" width="300" color="blue" size="4"/>
文字标签
<!-- size 字体大小1-7 face字体 -->
<font size="5" color="blue" face="arial black">文字标签</font>
格式化标签
<h2>文本标签</h2>
<b>加粗</b>
<strong>加粗</strong>
<em>斜体</em>
<sub>上标标签</sub>
<sup>下标标签</sup>
<del>删除线</del>
列表
<!-- 无序列表 -->
<!-- ul type属性 circle 空心圆 disc 实心圆(默认) square方块 -->
<ul type="square">
<li></li>
</ul>
<!-- 有序列表 -->
<!-- type 属性 数字,大小写字母,罗马数字等-->
<ol type="i">
<li></li>
</ol>
图片标签
<!-- src 地址 width宽度 heigh高度
alt图片不显示时显示内容 align 对其方式
title 鼠标悬停文字-->
<img src="img/kekeluo.jpg" width="400" height="800"
title="一只kkl" align="middle" alt="chichi">
链接标签
<!-- 链接标签-->
<!-- target属性
_blank在新窗口中打来
_self 自身窗口打开 默认
parent 在父窗口中打开
_top在顶级窗口打开
-->
<a href="first.html" target="_blank"> aa</a>
实现一个锚链接
跳向本页面或者其他页面的指定位置
<!-- 锚链接:指向页面中的指定位置 -->
name做标记
<a name="top">top </a>
<a href="#top">end</a>
<!-- 跳向其他页面中的指定位置-->
<a href="first.html#middle"></a>
表格标签
<!-- table 定义一个表格 tr 定义一个行
td定义列 th定义列标题加粗居中显示 -->
<!-- 属性
table
weigh 宽 heigth 高度
align:整个表格的位置
bgcolor: 背景颜色 每个都有
-->
<table border="1" cellspacing="" cellpadding="">
<!-- tr属性 -->
<!-- alignv内容水平对齐方式 -->
<!-- valign 垂直对其方式 -->
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr>
<td>chichi</td>
<td>18</td>
</tr>
<tr>
<td>chichi</td>
<td>18</td>
</tr>
</table>
列合并colspan,行合并rowspan
多列成一列,多行成一行
所占住的块,不能再有其他tr
<tr><th colspan="3">课程表</th></tr>
<tr>
<td rowspan="3">周一</td>
<td>数学</td>
<td>数学</td>
</tr>
<tr>
<td >数学</td>
<td >数学</td>
</tr>
<tr>
<td >数学</td>
<td >数学</td>
</tr>
<tr>
表单form
想要提交给服务器的都要加上name属性
get方式进行 表单提交时 action中不能附加参数
type值
输入型不需要设置value属性(value是设置默认值的),单复选框的value的属性为要提交的数据,按钮的value为描述信息;
按钮无name属性,不需要发给服务器
hidden隐藏不显示,但数据能发个服务器,不让用户看到
单复选
单选复选默认选中checked 单选复选框name要相同,才会被判断为一组
<!-- 单选 name属性要相同,否则会变成多选-->
<td><input type="radio" name="dx" value="男" />男</td>
<td><input type="radio" name="dx" value="女" checked="checked" />女</td>
<td><input type="checkbox" name="hobby" value="唱">唱
<input type="checkbox" name="hobby" value="跳">跳
<input type="checkbox" name="hobby" value="rapper" checked="checked">rapper</td>
文件提交
提交图片或文件时 enctype:multipart/form-data``
<!-- 文件提交时 要先设置表达enctype为文件提交模式 -->
<!-- image 提交的是固定的图片,并不是选择的 -->
<td>提交照片<input type="file" name="photo"/></td>
时间
时间日期 采用datetime-local ,不用datetime
日期date 时间time
<input type="datetime-local" name="" id="" value="" />
range
<td>分数<input type="range" min="1",max="10" name="level"></td>
下拉列表Select
<!-- 下拉列表
multiple 使用shift可多选
-->
<select name="city" multiple="multiple">
<option value="上海">上海</option>
<option value="上海" selected="selected">上海</option>
<option value="上海">上海</option>
<option value="上海">上海</option>
</select>
按钮
<!-- 按钮 button-->
<!-- input 提供按钮 -->
<input type="reset" name="" id="" value="重置" />
<input type="submit" name="" id="" value="提交" />
<!-- <input type="image" src="img/kekeluo.jpg" name="photo" id="" value="" /> -->
<button type="button">普通按钮</button>
<button type="input">提交</button>
<button type="reset">重置</button>
补充属性:
input: readonly 只读 不能输入,通过value设置默认值
按钮 :disabled 按钮禁用
框架标签framset,frame
一个窗口显示多个页面
target属性的_parent,_top也有作用,按照分割会分父子frame
属性:
frameset: frameborder 框架边框 0无1有(默认有)
frame : noresize 界面不能调整大小(默认调整)
<!-- 1. 先删除body -->
<!-- rows 上下分行 cols左右分行 -->
<frameset rows="20%,*">
<frame src="top.html" name="topFrame"/>
<frameset cols="200,*">
<frame src="menu.html" name="leftFrame">
<frame src="bottom.html" name="rightFrame">
</frameset>
</frameset>
通过a标签及 target 可向指定frame中加载页面,frame要做标记(加name)
无target会加载到自身frame中
<a href="add.html" target="rightFrame"> 添加</a>
<a href="remove.html" target="rightFrame"> 删除</a>
其他标签
® &trade
meta
<!-- 定义网页元信息 -->
<!-- 编码 -->
<meta charset="utf-8">
<!-- 搜索关键词 -->
<meta name="keywords" content="JAVA,PHP,MYSQL" />
<!-- 网页描述 -->
<meta name="description" content="JAVA,PHP,MYSQL" />
<!-- 自动刷新,可设置时间(单位 秒)可达成多少秒后跳转到 -->
<meta http-equiv="refresh" content="3;url=http://www.baidu.com"/>