目录
HTML知识汇总
HTML：超文本标记语言，主要构成网页组成的结构
其实主要通过标签来标记这个网页的结构
（比如说：用header来标记网页头，body来标记网页主体，用p标签来标记这一块是段落）
文件后缀：*.html或*.htm
注释：<!--这里是注释的内容--> pycharm直接用ctrl+/
标签分为两种：单闭合标签，双闭合标签
单闭合像<br>,双闭合像<p></p>在两个标签中间写内容
html标准结构
<!DOCTYPE HTML>
<html>
<head>...</head>
<body>...</body>
</html>
各种标签功能介绍
head标签：描述文档的各种属性和信息
可以嵌套的标签
title标签设置标题：该标签内容将显示在浏览器标题
示例：<title>标题信息</title>
meta设置编码
示例：<meta charset='utf-8'>
属性：
http-equiv属性：向浏览器传达一些有用的信息，帮助浏览器正确的实现网页内容
name属性：页面的关键字和描述，写给搜索引擎看的SEO优化
link：引入外部的样式表，定义网站图标
示例：<link rel="icon" href="/favicon.ico" type="image/x-icon" />
style:设置文档css样式
示例：<link rel="stylesheet" href="mystyle.css">
script:设置文档js脚本
示例：<script src="myscript.js"></script>
主要属性
lang='en'提示浏览器该网页语言为英文
body标签：网页主要内容写在该标签下
h1-h6:标题标签，块级元素，主要展示文章或网页的标题
示例：<h1>一级标题</h1>
注意：设置字体的大小不用该标签，该标签只是用于文章标题。
该标签为块状元素，一个标签占一行
文本修饰标签：
<b></b>：加粗
<i></i>：斜体
<u></u>：下划线
<s></s>：删除线
<sup></sup>：上标
<sub></sub>：下标
<em></em>:斜体
<strong></strong>:粗体
p:段落标签，块级元素
示例：<p>这是一个段落</p>
span:
用来单独设置某一段文本格式，通常嵌套在p标签里
a:超链接标签
行内块元素，把当前位置的文本或图片链接到该网页其他位置或者其他页面
主要属性：
target：值为_blank时，在新的网页上打开该链接值为_self时，在当前网页打开该资源地址
title：表示鼠标悬停时显示的内容
href：写链接的位置，可以是一个文件，电子邮件链接，页面某个元素的id，JavaScript脚本
ul，ol:列表标签
ul是无序列表，ol是有序列表
主要属性
type：列表类型
ol类型有：
1：小写字母
A：大写字母
i：小写罗马字符
I：大写罗马字符
ul类型有：
disc：实心圆(默认值)
circle：空心圆
square：实心矩形
none：不显示标识
可以嵌套的标签：
<li><\li>:代表列表的一项
css中清除列表类型：list-style:none(常用)
div:盒子标签
块级元素，可以把页面分割成不同的板块（常用标签）
img：图片标签
行内块元素，使用该标签可以插入图片
主要属性
src：通过设置该属性来设置图片的来源地址，可以是本地文件，也可以是网络文件
alt：图片加载失败时，显示的内容
width，height：设置图片的宽度和高度，默认为图片的宽高
示例：<img src="ad-one.jpg" alt="图片加载失败时显示的内容">
其他标签：
br:换行标签，单闭合标签
hr:分割线，单闭合标签
注意：html会将文档类连续空格显示为一个空格，用 可以表示一个空格，
通常空格少的情况下用，空格多的情况，使用span标签，设置其宽度，来拉开文字间距离
table标签：表格标签
主要是用来画一个表格
通常嵌套的标签：
thead：表格头
tbody：表格主体部分
tfoot：表格底部
表格列，行：
tr：表格里面一行（设置行）
td：表格主体或表格底部里一个单元格（设置列）
th：表格头里一个单元格，默认加粗并居中（设置列）
表格合并：
用在tr,th,td中的属性
rowspan：合并行（竖着合并），从这个位置向下合并n行
colspan：合并列（横着合并），从这个位置向右合并n列
form标签：表单标签
主要是可以让用户输入内容，或者单击按钮，选择啥的。然后提交给服务器
主要属性：
action：定义表单提交时发生的动作，提交处理程序的地址给服务器
method：定义表单提交的方式（默认get）
get：明文提交（数据显示在地址栏），数据最大2KB
post；隐式提交（不会显示在地址栏），数据无大小限制
enctype：定义表单编码方式
application/x-www-form-urlencoded：（默认方式）允许将普通字符，特殊字符都提交给服务器，不允许提交文件
multipart/form-data：允许被将文件提交给服务器
text/pain 只允许提交普通字符。特殊字符，文件都无法提交
注意：如果有文件需要提交给服务器时，method必须为post,entype必须为multipart/form-data
主要嵌套
label：行内块，双闭合，显示表单文件，关联表单元素后，点击文本就和点击元素一个效果
for属性：表示关联元素的id值
input：行内块，单闭合
type属性：设置输入的类型
按钮：button，submit，reset
文本：text，password，radio，checkbox
文件：file
详细介绍：
text：单行文本框
password：单行文本框，输入的内容将显示为****
button：普通按钮
submit：提交按钮，提交表单时使用
radio：为单选按钮
checkbox：为复选框
file：上传文件所使用
reset：重置按钮
name属性
相当于key，提交时，地址栏会显示key=value，传递给服务器
对于单选框来说，相同name的单选框会产生互斥的效果
value属性
对于按钮，重置按钮，确认按钮来说：定义按钮上的文本
对于图像按钮：定义传递像某个脚本的此域的符号结果
对于复选框和单选框：定义被单击时的结果
对于隐藏域、密码域及文本域：定义元素的默认值
不能和type=‘file’同时使用，但对单选框和多选框是必备的
placeholder属性
设置文本框在没有输入时显示的文字（例如：文本框中显示‘请输入用户名’）
checked属性
设置单选框或复选框默认选中的元素
disable属性
表示禁用该空间
textarea：多行文本框
行内块，双闭合。允许用户登录多行数据到表单控件中
主要属性：
cols：设置列数（间接设置控件宽度）
rows：设置行数（间接设置控件高度）
select：下拉列表
双闭合，内嵌option标签
主要属性：
name：选项的键
multiple：设置值时，允许多想
size：取值大于1时为滚动列表
option标签：选项
双闭合，下拉列表的一项
主要属性：
value：选项的值，相当于key
selected：不设置值时默认第一项会被选中
标签属性汇总
设置方法：通过键值对的形式，键值不区分大小写
例如：id = 'li' 键为id，值为li
注意：
1.设置值时，值必须用引号引起来
2.一个属性有多个值时，用空格隔开；一个标签可以设置多个属性，用空格隔开
例如：class = 'p1 p2 p3'
3.可以自定义属性
4.通常不用html设置页面样式（字体大小，颜色，控件长宽），这些样式在后面用css设置
标签分类
块状元素，行内元素，行内块元素
详细解释：
块状元素：<div> <p> <h1>~<h6> <ol> <ul> <table><form> <li>
css样式设置：display:block
特点：独占一行，行宽高边距都可以设置，默认为父容器100%
行内元素：<a> <span> <br> <i> <em> <strong> <label>
css样式设置：display:inline
特点：挤在一行，不可设置长宽高边距
行内块元素：<img> <input>
css样式设置：display:inline-block
特点：挤在一行，可以设置长宽高
嵌套规则
- 一般块元素可以嵌套块元素、行内元素、行内块；行内元素只可嵌套行内元素
- h1-h6标签和p标签只能嵌套行内块，不能嵌套块级元素
2448
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
