本文详细介绍了HTML的基础结构，包括标签的使用（如UTF-8编码、meta标签、常用标签如strong、input、select等），表单元素的属性，以及CSS基础知识如颜色表示法、多媒体标签（audio和video）和表格布局等内容。
<!DOCTYPE html> ------- 声明一个html的文档
<html lang="en"> ------- 网页的开始
<head> -------- 网页的头部 的开始
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title> ------ 网页的标题
</head> ------ 网页头部的结束
<body> ------ 网页内容的开始
</body> ------- 网页内容的结束
</html> ------ 网页的结束
1、UTF-8 ------- 通用字符集
2、GB2312 ------ 简体中文字符集
3、 BIG5 ------ 繁体中文字符集
4、 GBK ----- GB2312的补充，添加了更多的汉字和特殊符号
3.1 常用标签
3.1.1 strong和b等标签
<!------>------注释
strong------这个是粗体
b ------也是粗体
em--------这是斜体
i--------也是斜体
u------下划线
del-----删除线
3.1.2 br、hr标签
br标签 ------ 用来换行
hr标签 ------ 水平分割线，可以设置width和size
3.1.3 p标签
p标签是段落标签
两个相邻的p标签之间会空一行
align 属性 位置 left(默认值) right center
font标签 ------- 设置字体
color属性 ---- 设置颜色 颜色的表示法：第一种：英文单词 第二种：#rrggbb 三原色 red green
blue
3.1.4 sub、sup、pre、span标签
sub标签 ------ 下标标签
sup ------- 上标标签
pre ------ 用来原样输出内容
span ------ 修饰文本的标签 ---- 标准的行内标签
3.1.5 hn,div标签
hn ------- 标题标签 指的是h1,h2,h3,h4,h5,h6 ----------- n的取值只能是1-6 字体会越来越小 有加粗的
效果
div ------- 标准的块级标签------ 盒子布局
行内标签：不能自动换行，除非这一行内容铺满整个页面才会换行 span
块级标签：自动换行，独占一行 div hn p hr
3.1.6 特殊字符
3.2 表单标签
form标签 一般会和input标签连用
action属性 ------ 跳转的路径
路径：
绝对路径是从盘符开始的路径
相对路径是从当前路径开始的路径
绝对路径是真实的路径，是计算机中完整路径，必须准确，否则不能找到，起点是系统的根目录，也就是各个盘符。相对路径是一种简化版的路径，以当前文件，活动窗口目录为根目录，进行向上或者向下
method属性：用来明确表单提交的方式 get post ,默认值是get
name属性：表单的名称
get请求：不是特别安全，会把用户信息暴露在地址栏
post请求：相较于get会安全一点
3.2.1表单元素
表单元素----- 文本框、密码框、按钮、下拉列表框
一般是由input textarea select 标签构成，都需要使用在form标签里面
3.2.1.1input标签
type 的取值：
text ----- 文本框
password ---- 密码框
submit ----- 提交按钮
radio ------ 单选按钮
checkbox ----- 多选按钮
reset ----- 重置按钮
button ----- 普通按钮
image ----- 图像按钮
file ------ 文件
hidden ---- 隐藏域
email ---- 邮箱域
color ----- 颜色域
date ----- 日期
time ----- 时间
datetime-local ----- 日期+时间
range ------ 进度条
常见的属性：
readonly ------ 只读 字段只可以读不能修改
checked ---- 默认选择
disabled ----- 表示禁用 不可以点击
autofocus ----- 默认光标的位置
required ----- 不能空白提交
3.2.1.2 select标签
下拉列表框 ------ 一般和option标签连用
属性：selected ------ 默认被选中的选项
multiple------- 以列表的形式展示
3.2.1.3 textarea标签
用来显示文本域
cols --------- 多少列，用于表示文本域的宽度
rows -------- 多少行，用于表示文本域的高度
3.3 常见的属性
a标签 ----- 超链接
vlink ----- 访问过的超文本链接的颜色
alink ---- 激活超文本链接的颜色
link ------ 超文本链接的颜色
text ---- 文本的颜色
bgcolor ----- 背景颜色
background ----- 背景图片
颜色表示法：
1、英文单词
2、#rrggbb
3、rgba() ----- a指的是透明度
3.4 a标签
标签表示的超文本链接标签 ------ 用来进行页面的跳转
href 属性放的是要跳转的路径
target属性：
锚点：使页面的展示到达某一个指定的地点
#+id名称进行链接
3.5 img标签
图片常见的格式：GIF JPG PNG BMP等
3.5.1 常见的属性
src ----- 图片的路径 （绝对路径和相对路径）
alt ----- 代替图片文本的内容（图片的路径错误或者因为浏览器的原因打不开这个图，用一个词或者
一段话代替描述这个图片）
width ----- 宽度
height ---- 高度 单位都是px %
border ------ 边框 默认值是0
align ---- 位置 （图片和文字的位置）
取值：top ----- 上对齐 middle ----- 居中对齐 bottom ------ 下对齐（默认对齐） right ----- 右对齐
left ------ 左对齐
title ----- 图片的标题 ------ 用来显示描述图片的文字
3.5.2 位图
usemap 属性
map标签 一般会和area标签进行连用
area标签 属性：
shape ------- 鼠标点击的形状
coords ----- 表述鼠标点击形状的大小
href ----- 表示要跳转的路径
3.6 多媒体标签
audio ------ 音频
video ---- -- 视频
controls属性 ----- 表示的是播放器的组件
autoplay属性 ---- 表示的自动播放
loop属性 ------ 表示的是循环播放
3.7 表格布局
table标签
包含了thead tbody tfoot tr td标签
3.7.1 表格的边框
border ----- 设置表格边框
3.7.2 表格的宽度和高度
width ----- 宽度
height ---- 高度
3.7.3 表格的背景
bgcolor ---- 背景颜色
background ---- 背景图片
2.7.4 表格的位置（对齐）
align ---- 表示表格的位置 left center right
2.7.5 表格的间距和边距
cellpadding ---- 表示的是表格边距（表示单元格内元素距离单元格边框的距离）
cellspacing------ 表示的是表格的间距（表示的是单元格和单元格之间的距离）
cellpadding 、cellspacing都有一个默认值 2px
2.7.6 表格的嵌套
表格里面可以嵌套另一个表格
2.7.7 表格的合并
单元格合并行
rowspan="n" ------ n是一个整数，表示在单元格垂直方向去跨行（合并行）
colspan = "n" ------- n是一个整数，表示在单元格水平方向去跨列（合并列）
3.8 列表标签
主要有三种——有序、无序、数据列表
3.8.1 有序列表 ---- ol
type 属性 ----- 表示设置序号的种类 ，默认值是数值1
start属性 ------ 序号开始的位置
reversed属性----- 反序（降序）
3.8.2 无序列表 ----- ul
type属性 ----- 无序列表的样式 disc（默认值 实心圆）circle(空心圆) square(实心方块)
3.8.3 数据列表 ----- dl
3.9 多窗口框架
一个页面可以显示多个窗口 -------- framset 标签 --------- 不能和body标签连用
HTML5之后不支持这个标签，使用的是iframe标签
cols ------- 定义页面列方向的尺寸或者数目
rows ----- 行
2228
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
