HTML
HTML
什么是HTML
- Hyper Text Markup Language
- 超文本标记语言
- 超文本： 超出文本本身的功能范围
- 标记： 通过标记表示不同的功能，不同的标记可以实现不同的效果
- 语言： 大量的标记组合在一起，形成了一套体系，可以称体系为“语言”
HTML体现形式
- html文件
- htm文件
HTML操作规范
- 一个html文件中要有开始和结束
- 一个html文本中的基本结构 头 页面所携带的额外数据体页面所包含的数据尾 页尾数据
- html的代码不区分大小写
- 标签通常情况下都是成对出现的
- 有一些特殊的单独出现
- 分割线
<hr />
-
-
- 换行
-
<br />
- html操作思想
- 一个页面中会有很多数据展现，不同的数据可以展示的效果是不一样的
- 使用不同的标签来操作不同的数据
- 如果修改某一个数据的效果，只需要对标签进行修改即可
- 大部分标签中，会存在属性
- 对属性设置不同的数据值，可以实现不同的效果
- HTML常用标签
- 字体标签
- <font></font>
- 常用属性
- size
- 设置字体尺寸(1-7)，超过7默认按7处理
- color
- 设置字体颜色(英文单词 or 十六进制码 or RGB)
- 注释
- <!-- 我是注释 -->
- 标题标签
- <h1-6></h1>
- 列表标签
<dl> <dt>我是列表A</dt> <dt>我是列表B</dt> </dl>
<ol> <li>我是有序列表A</li> <li>我是有序列表B</li> </ol>
<ul> <li>我是无序列表A</li> <li>我是无序列表B</li> </ul>
- 图片标签
<img src="图片路径(本地/网络)" width="宽度" height="高度" title="图片悬浮文本" <!-- 等比例 --> />
- 超链接
<a href="链接URL地址">地址描述</a>
- 表格标签
<table border="边框" width="宽度" height="高度" bgcolor="颜色" cellspacing="单元格距离">
<tr align="对齐方式" rowspan="参数为相邻单元格数合并">
<td align="对齐方式" colspan="参数为相邻单元格数合并"></td>
</tr>
</table>
- 表单
<form action="将表单提交给谁处理" method="提交表单时的请求方式">
<input type="text" name="username" id="username" value="" placeholder="这是文本框"/>
<input type="password" name="password" id="password" value="" placeholder="这是密码框"/>
<input type="checkbox" name="这是复选框" id="这是复选框" value="" />
<input type="radio" name="这是单选框" id="这是单选框" value="" />
<input type="button" name="这里是按钮" id="这里是按钮" value=""/>
<input type="date" name="" id="" />
<input type="time" name="" id="" />
<input type="email" name="这是邮件格式" id="" />
<input type="file" name="" id="" value="" />
<input type="hidden" name="" id="" value="" />
<input type="number" name="" id="" value="" />
<input type="tel" name="" id="" value="" />
<input type="reset" name="" id="" value="" />
<input type="submit" name="" id="" value="" />
</form>
- 下拉列表
<select name="列表名">
<option value="">内容一</option>
<option value="">内容二</option>
</select>
HTML对文本处理效果
- b：加粗
<b>我被加粗了</b>
- u：下划线
<u>我加了下划线</u>
- s：删除线
<s>我加了删除线</s>
- i：斜体
<i>我变成了斜体</i>
- pre:原样输出
<pre>我被原样输出了</pre>
- sub:下标
<2sub>3</2sub>
- sup:上标
- <2sup>3</2sup>
- p:段落
<p>这是一个段落</p>
- div:块/层
-
- span:动态文本标签
<span></span>
头部标签
- meta标签
- 设置字符集
- <meta charset="utf-8"/>
- 设置关键词 kewords固定写法 关键字写再content,关键词之间用逗号隔开
- <meta name="keywords" content="A,B,C"/>
- 刷新
-
-
- meta http-equiv="refresh" content="刷新条件"/>
-
- 页面名称
- <title>页面名称</title>
框架标签
- 对当前页面进行拆分，可以水平、垂直拆分
<frameset></frameset>
<ul>
<li>水平拆分: rows</li>
<li>垂直拆分： cols</li>
</ul>
<frame />
- 拆分后每个区域具体显示的内容(页面)