html总结
HTML总结
网页的认识
网页的基本组成部分
文字
图片
超链接
视频
音频
浏览器的认识
ie
trident
火狐
gecko
chrome
blink
safari
webkit
opera
blink
html的基本认识
html的骨架
标签的种类
单标签
双标签
标签的关系
嵌套
父子
并列
兄弟
html中的标签
h系列的标签
标题标签
h1~h6
语义：表示标题的语义
注意点：
独占一行
宽度默认继承父盒子的宽度
高度由内容撑开
块级元素！！！！！
p
段落标签
语义：表示段落的语义
块级元素
hr
水平线标签
br
换行标签
文本格式化标签
没有语义的
b：加粗
u：下划线
i：倾斜
s：删除线
有语义
strong：加粗
ins：下划线
em：倾斜
del：删除线
行内元素！！！！！！
（可以通过调试工具中的computed查看display的值即可）
img
图片标签
作用：在网页中显示一张图片
属性
src：图片的路径
告诉浏览器要显示哪一张图片
alt：替换文本
当图片加载失败时（如：路径写错了），才显示的文字
title：图片的标题
鼠标悬停在图片上时，才显示的文字
width：图片的宽度
只设置的宽度，高度会等比例缩放
height：图片的高度
只设置的高度，宽度会等比例缩放
一般宽高只会设置一个，如果同时设置了两个，图片可能会拉伸变形
路径
绝对路径
在电脑中的绝对路径：带有盘符的路径
相对路径
同级目录
直接写目标文件的名字即可
./目标文件的名字
结果：目标文件名字
下级目录
1、写目标文件所在的文件夹名字
2、进入到文件夹里面
3、直接写目标文件的名字即可
结果：目标文件夹/目标文件的名字
上级目录
1、首先要去上一级目录
2、直接写目标文件的名字即可
结果：../目标文件的名字
a
链接标签
作用：点击之后跳转到其他页面
属性
href
目标网页的路径
target
设置链接跳转的方式
_self:在当前页面进行跳转
_blank:在新的窗口中进行跳转
base
统一设置页面中所有a标签的跳转方式
<base target="_blank">
写在title标签的下面
其他用法
不跳转
href=“#”
下载
当路径指向浏览器无法打开的文件时，浏览器会默认下载
定位
在当前页面进行定位
1、在目标标签上添加id属性
2、在href属性上写 #id属性值
在跳转之后的页面进行定位
1、在目标标签上添加id属性
2、href属性上 目标文件的路径#id属性值
列表
无序列表
ul>li
注意点
ul中只能有li标签
li标签是一个容器，可以放任意的标签
每一项是没有顺序的
有序列表
ol>li
注意点
ol中只能有li标签
li标签是一个容器，可以放任意的标签
每一项是有顺序的
自定义列表
dl>dt/dd
dt
自定义列表的小标题
dd
自定义列表中的每一项
特殊字符
空格合并现象
如果html代码中同时出现多个空格、换行、tab等，最后浏览器只会解析出一个空格
空格
 ；
大于号
>；
小于号
<；
表格
标签
table：表示表格的整体
tr：表示表格的一行
td：表示表格的单元格
属性
border：表示表格的边框
align
水平对齐方式
给谁设置？？？？
align=“center”
给table设置
整个表格在页面中水平居中
给tr设置
让该tr中的内容居中
给td设置
让该td中的内容居中
cellspacing
单元格与单元格之间的间隙
cellpadding
单元格边框与内容之间的距离
width
宽度
height
高度
css
细线表格
border-collapse：collapse；
表格的其他标签
th
表头标签
caption
表示表格整体的标题
表格的结构化标签
thead
表格的头部
tbody
表格的身体
tfoot
表格的底部
有兼容性问题
合并单元格
左上原则
水平方向合并，保留最左边的，其他都删掉
垂直方向合并，保留最上面的，其他都删掉
跨行or跨列
跨行：rowspan=“合并的数量”
跨列：colspan=“合并的数量”
给保留的单元格加
表单系列标签
input系列标签
通过type属性值的不同，表现不同的形态
text
文本框
属性
name
告诉后端发送过去的数据是什么？？标签的含义
value
用户输入的数据就是value
提前在代码中设置好，默认值
maxlength
用户输入的最大字符数
password
密码框
特殊效果：密文输入
属性
name
告诉后端发送过去的数据是什么？？标签的含义
value
用户输入的数据就是value
提前在代码中设置好，默认值
maxlength
用户输入的最大字符数
radio
单选框
属性
name
告诉后端发送过去的数据是什么？？标签的含义
分组
有相同name属性值的radio为一组，一组中同时只能有一个radio被选中！！！
value
用户选择的数据是什么
默认选中
checked
单选框的一组中只能设置一个！！
checkbox
多选框
属性
name
告诉后端发送过去的数据是什么？？标签的含义
value
用户选择的数据是什么
默认选中
checked
file
文件上传
属性
multiple（html5新增的属性）
多文件上传
表单按钮
submit
提交按钮
功能：提交用户的数据给后台
reset
重置按钮
功能：重置为默认值
button
普通按钮
功能：本身没有功能，需要之后配合js使用
注意点
要通过value属性，设置按钮上的文字
image
图片按钮
样式：就是一张图片
功能：就是提交按钮，只是显示的是一张图片
如果要实现按钮的功能，需要配合form表单一起使用（用form标签把表单标签包裹起来即可）
select
下拉菜单
整体
select
每一项
option
默认选中
selected
textarea
文本域
作用：输入大段文字
css
禁止自由缩放
resize:none
label
作用：把文本和表单标签关联起来
使用有两种方法
<input type="radio" id="man"><label for="man">男</label>
<label><input type="radio" id="man">男</label>
没有语义的布局标签
div
块级元素的代表
span
行内元素的代表
html5的新标签新属性
html5新增的语义标签
header
网页头部的语义
div+网页头部的语义
nav
网页导航的语义
div+网页导航的语义
footer
网页底部的语义
div+网页底部的语义
html5新增的表单属性
placeholder
占位符
autofocus
自动获取焦点
multiple
多文件上传
多媒体标签
audio：音频标签
属性
src:音频的路径
controls：播放控件（必加）
有兼容性的
autoplay
自动播放
loop
循环播放
video：视频标签
属性
src:视频的路径
controls：播放控件（必加）
有兼容性的
autoplay
自动播放
loop
循环播放
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
