1.web标准构成
结构:html 对网页元素进行整理和分类
表现:css设置对元素的样式,大小等外观样式
行为:javascript对网页模型定义及交互的编写
2.html骨架标签
标签名 | 定义 | 说明 |
---|---|---|
<html> | HTML标签 | 页面中最大的标签,我们成为 根标签 |
<head> | 文档的头部 | 注意在head标签中我们必须要设置的标签是title |
<titile> | 文档的标题 | 让页面拥有一个属于自己的网页标题 |
<body> | 文档的主体 | 元素包含文档的所有内容,页面内容 基本都是放到body里面的 |
3.文档类型及页面语言lang
告知浏览器文档使用哪种 HTML 或 XHTML 规范。
<!DOCTYPE html>
语言种类
<html lang="en"> 指定html 语言种类
字符集
<meta charset="UTF-8" />
4.常用标签
符号 | 作用 |
---|---|
H1------H6 | 标题 |
p | paragraph 段落 |
<hr/> | 横线 |
<br\> | 换行 |
div | 块元素 |
span | 行内元素 |
<strong> | 粗体 |
<i> | 斜体 |
<s> | 删除线 |
<u> | 下划线 |
img | 图像 |
table | 表格 |
tr | 表格行 |
td | 单元格 |
caption | 表格标题 |
th | 表头单元格标签,会加粗居中 |
thead | 表格头部 |
tbody | 表格主体 |
tfoot | 表格脚注 |
ul | 无序列表 |
ol | 有序列表 |
dl dt dd | 自定义列表 |
input | 输入控件 |
label | 有序列表 |
textarea | 文本域 |
select | 下拉列表 |
form | 表单域 |
4.1 表格属性
合并单元格的2种方式
- 跨行合并:rowspan=“合并单元格的个数”
- 跨列合并:colspan=“合并单元格的个数”
5.特殊字符
6.常用标签
a
<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>
target:
black:新窗口打开
self:默认,当前页面打开
base 全局打开链接的方式:
<base target="_blank" /> 写到<head> </head> 之间
table
<table>
<caption>表格标题</caption>
<th>
<td>标题行</td>
</th>
<tr>
<td></td>
</tr>
</table>
caption:标题
th: 名称行
tr:列表行
td:单元格
自定义表格
<dl>
<dt>名词1</dt>
<dd>名词1解释1</dd>
<dd>名词1解释2</dd>
</dl>
input 输入框
- type:
text 文本
password 密码
checkbox 复选框
radio 单选
button 普通按钮
submit 提交按钮
reset 重置按钮
image 图形形式的提交按钮
file 文件域
- size: 整数–》在页面中的显示宽度
- value: 默认显示的内容
- name:区别不同的表单
- checked: 被选中
- maxlength:控件允许输入的最多字符数
label: 提交用户体验,绑定input
textarea文本域
cols:每行字符数
rows:显示的行数
select:下拉列表
option 列表项
selected: 默认选中
form 表单域
<form action="url地址" method="提交方式" name="表单名称">
各种表单控件
</form>