Html知识点整理笔记

Html基础整理

---

前言

• @author: zengjiahao
• @date: 2018/10/11

内容目录

Html5入门及基础01（网页、基础标签、路径）

1.web的三大结构组成

结构层:html
样式层:css
行为层:js

2.标签的分类与关系

分类:单标签,双标签
关系:嵌套关系(保持缩进)/并列关系

3.h系列标签

h1-h6
h1是页面最重要的内容,一般用来存放logo
	一个页面只能有一个h1

4.p - 段落标签

p标签
	存放文字,独自占据一行

5.文本格式化标签(b、u、i、s)

加粗
	b/strong
下划线
	u/ins
斜体
	i/em
删除线
	s/del

6.标签的属性

属性写在标签名后面
多个属性用空格隔开
<标签名 属性名1="属性值" 属性名2="属性值" ....></标签名>

7.img标签的使用

src:图片的路径
	可以是绝对路径
	也可以是相对路径
alt:当图片加载失败的时候,显示的图片描述文本
title:鼠标悬停的时候,显示的图片描述文字
width/height:控制图片的宽高,但是建议只控制一边

8.a标签的使用

href:目标页面路径
target:控制页面的跳转方式
	_self:默认值,不保留原页面
	_blank:保留原页面
base标签
	可以统一控制页面上所有的a标签
	优点:节省代码
锚点定位
	都是利用id的唯一性
	id:具备唯一性,不能重复

9.相对路径的掌握

文件与html在同一级目录
文件在html的下一级目录
	先进入这个文件夹,再找到文件
		文件名/
文件在html的上一级目录
	先从文件夹中出来,再找到文件
		../

Html5入门及基础02（表格、表单、css初识）

1.无序列表的掌握

存放没有顺序的数据
ul中只能有li标签,如果有其他标签最好放在li中
ul有数量限制,但是li没有限制
工作中,只要用到列表,那么基本都是无序列表

2.了解表格的基本使用

table
	代表表格
tr
	代表表格的行
td
	代表行内的单元格
表格的属性
	border
		表格边框
	cellspacing
		边框之间的空白间隙
			默认是2px
	cellpadding
		内容到边框的距离
			一般不用
	align
		水平对齐方式
			left center right
其他的表格标签
	th
		表头数据
	thead
		表格的表头结构
	tbody
		表格的主体结构
	caption
		表格的标题
			写在table内部
合并单元格
	跨行合并
		rowspan
			后面不要的数据要删除
	跨列合并
		colspan
			后面不要的数据要删除

3.input标签的不同type类型

text
	文本框
password
	密码框
radio
	单选框
checkbox
	多选框
button
	普通按钮
submit
	提交按钮
reset
	重置按钮
image
	图片按钮
file
	单文件上传
name
	1.给单选框分组,实现单选互斥
	2.给标签设置分类,用于存储
placeholder
	占位符
checked
	单选框与多选框用来默认选中
value
	1.默认值
	2.按钮的文字
maxlength
	控制最大的字符数
下拉框
	select
	option
	默认选中
		selected
文本域
	textarea
		大段文字的输入
form
	表单域

4.color属性的设置方式

1.英文单词赋值
	范围比较小
2.十六进制
	工作中最常用
		可以简写
			#f00:红色
3.rgb表示法
	0-255
		范围跟十六进制一样