Html笔记
1.什么是纯文本文件
比如：记事本txt （英文text的简写）就是一种纯文本文件
特点：a) 只有文本，没有格式
b)用记事本等纯文本编辑器可读，而且不会乱码
包括html、css、JS都是纯文本
2.什么是html
HyperText Markup Language超文本标记语言
而本质上，html和纯文本没有区别，它本身就是一种纯文本文件
数据记录在记事本中，可以有格式，但是在网页中都是没有格式的，也就是网页不能显示所谓的“语义”，数据在网页中没有格式，因此html因运而生。
综上所述，html的作用仅仅只是为网页中显示出的数据添加语义，没有其他的作用。
3.编辑器
任何纯文本编辑器都能打开html文件，比如txt、editplus、notepad++等
比较有名的专业制作网页的编辑器有：
DreamWeaver（Adobe公司的产品，现在已经过时，不用了）
Sublime（一款高效率的书写工具，意为“崇高”）
WebStorm（项目级别的编辑工具）
Sublime是2011年开始流行起来的，可以编辑Java、C、php等，同时也包括html、css、js等。
4.Sublime常用快捷键
a) Ctrl + Shift + D复制当前行
b) Ctrl + Shift + K删除当前行
c) Ctrl + Shift + ↑/↓移动当前行（向上/向下）
d) Ctrl + 滚轮放大/缩小sublime的字体
e) 输入标签名，如p，按Tab或者Ctrl + E，可以自动生成标签对
f) HOME键把光标移到一行的开头
g) END键把光标移到一行的结尾
h) 按住鼠标滚轮（不要滚动），向下拖动，可以选择多行一起输入
1.文档声明头
任何一个标准的htnl页面，第一行一定是以开头的语句，其作用是告知浏览器，本页面所使用的html或xhtml规范。
有哪些规范：
我们学习的仍然是html 4.01，它是从IE6.0开始兼容的，目前PC端的浏览器还不会迅速的更新换代，因此PC端它仍然是主流。近来正火热的html 5则是从IE9.0才开始兼容的，因为手机端和移动端所使用的主要是google的浏览器，因此它目前只在手机端和移动端广泛使用。
Html 4.01规范了三种文档类型：Strict、Transitional、Frameset
xHtml 1.0规范了三种文档类型：Strict、Transitional、Frameset
之所以会分为两种，是因为html认为它的一些规范不够严谨，如标签是否可以大小写等，因此又制定了一个xhtml1.0，来规范它的一些不严谨之处（x表示严格、严谨）Html 4.01: Strict严格的→有些标签（如U标签）不可使用Transitional普通的→目前所学习的
Frameset 带框架的→已经淘汰
html:xt x代表xhtml:1.0规范t代表transitional
2.字符集
字符集用meta标签定义，meta表示“元”，“元”配置就是基本配置项目。
Charset就是字符集。中文能使用的字符集有两种，UTF-8和gb2312（或简写为gbk）。
①什么是字符集？
计算机不能直接储存汉字，只能储存编码。在UTF-8中，假如“甲”字的编码为100，而在gb2312中可能为001，相同的编码在不同的字符集中表示的是不同的字。为了让计算机认识所写的字，所以要设定字符集。
②区别
UTF-8是国际通用字库，涵盖了所有的语言
Gb2312则是中国的国标字库，涵盖汉字和一些常用的外文和一些常用的符号。
从规模上而言，UTF-8远大于gb2312，但是UTF-8中存储一个汉字需要3字节，而gb2312则只需要2字节。因此网页如果追求加载速度，则选择使用gb2312，而如果需要使用较多的外文，则使用UTF-8。UTF-8庞大但臃肿，加载速度慢，而gb2312小巧，加载更快。
注意：浏览器通过meta标签查看你所使用的字符集，因此书写和保存时要用同一种字符集，否则浏览器就会乱码。
3.完整框架
这一句代码的含义，是定义页面的描述。百度搜索的结果就会显示在content后赋予的值。这个技术叫做SEO，即“搜索引擎优化”。
Name表示这一项的名字，content表示内容。
这一句代码，是定义页面的关键词。是告诉搜索引擎，本网页的主要用途，可以提高搜索的命中率。一般而言，定义3~5个即可，不宜太多，否则会适得其反。
Head标签中，包含的是页面的配置，一般而言，包括：字符集、关键词、页面描述一级标题。因此一个页面的完整的框架应当是这样的：
→声明文档类型
→html标签
→头部标签
→定义字符集
→定义关键字
→定义页面描述
→主体部分
x
4.html语法特性
Html只在乎标签的嵌套结构、嵌套关系，谁嵌套谁，而和换行、缩进、空格无关。
换不换行等都不影响结构。
也就是说，html不是依据缩进来表示嵌套的，看的就是标签的嵌套关系。一般而言，有良好的缩进，代码更易读。但是缩进换行空格等会拖慢网页的加载速度，因此像淘宝、京东等网页，为了追求极致的加载速度，他们的html代码没有缩进和换行。
Html中的文字如果有换行、空格、tab等，都会被折叠为一个空格显示。
成对的标签都要封闭。如
如果没有封闭，它会将整个body都当做网页的标题。
5.h和p标签
html中的标签是分等级的，分为容器级和文本级。
容器级：里面可以放置其他标签的标签
文本级：里面只能放置文本、图片、表单元素。
h标签是一种容器级标签，理论上可以放置所有的标签，但是从语义上来讲，一般不放置其他标签。从
到都是标签，依次为一级标题、二级标题、…、六级标题。H标签没有嵌套关系，但是h2跟着h1，就可以知道h2是h1的子标题。
p标签是一种文本级标签，不可以放置其他的标签。P是paragraph的缩写。
Chrome是世界上Html5支持最好的浏览器，非常适合开发者使用，审查元素的快捷键是F12。Chrome的意思是“铬”。
5.图片标签img
页面中可以插入图片，其类型包括JPG（JPEG）、PNG、GIF、BMP等。而psd、ai、cdr等则不可以插入。Html页面插入的不是图片本身，而是图片的地址，插入图片是使用![]()
标签来实现的。
![]()
标签是一个自封闭标签，也叫做单标签。Html中的成对标签的作用是为标签体内的内容增加语义，而图片没有也不需要语义，所以img标签不需要成对。类似的单标签还有等。
Img标签的格式如下：
img是image“图片”，src是source“资源”，alt是alternate“替代”。
src和alt都是img标签的属性，其后面的值就是属性值。Src的作用是引入图片的地址，而alt的作用是当图片无法正常显示时，以alt的属性值代替图片显示。
6.相对路径
Html中若想插入图片，需要有两个文件，一个是html文件，另一个是所要引入的图片文件，如jpg等。两者可以通过![]()
标签的src属性建立关联，src的属性值就叫作相对路径。只要相对路径不变，图片一定能够显示。
../：返回上一级，如：
../images/1.jpg 意为返回html所在文件夹的上一级，引入其中的images文件夹下的
1.jpg图片文件。
7.超级链接标签 a
一个网站是由很多html页面组成的。Html页面之间通过超级链接互相跳转，从而形成了“网”。
a标签的格式为：
a是anchor“锚”，它是一个文本级标签。
href是“超文本地址”的缩写。
title属性的属性值是“悬停文本”，是鼠标悬停在a上的时候显示的文字。
target属性的属性值是点击后在新页面（_blank）或者自身（_self）打开，如果不设置，则默认为_self
锚点：页面中也可以有锚点。锚点其实就是一个小标记，一般不会被用户察觉，通过name或者id属性来设置。一个a标签如果有name或者id属性，则它就是页面的一个锚点。格式如下：
→锚点
→返回锚点
8. 表单标签ol、ul、dl
a) 无序列表ul
用于表示一个列表的语义，而且每个项目之间部分先后。ul是unordered list“无序列表”的意思，li是list item“列表项”的意思。ul是一个组标签，要么不写，要么就要写一组。也就是说，li不能单独存在，必须包含在ul或ol中，而且ul或ol的子级必须是li。
ul li 浏览器默认会加小圆点，但是ul的作用并不是给文字加小圆点，而是增加无序列表的“语义”。ul的子级只能是li，但是li是一个容器级标签，里面什么都可以放。
常见的应用场景有：
①网页的导航条
②商品列表
b) 有序列表ol
和ul类似，但是会表达顺序，一般是在ul的li里加上次序即可。此标签用的不多，可以用ul代替。
c) 定义列表（项目列表）dl
定义列表也是一组标签，其标签共有三个。
dl表示definition list定义列表dt表示definition title定义标题
dd表示definition description定义描述。
这个标签表达两层语义：①是一个列表；
②每个列表项都有描述项。
dt、dd是一种容器级标签，里面也是什么都可以放。
由此可见，使用什么标签并不是根据样式决定的，而是根据语义决定。
9. div 和span 标签
div的语义是divition“分割”，在浏览器中，div不会添加任何效果。其主要作用是改变语义，使每个元素都成为一个小区域。div表示大的区域，是一个容器级标签。
span的语义就是span“范围，跨度”。span表示小的区域，是一个文本级标签。
div和span在css中意思都是“盒子”。通常使用div + css布局：div负责布局，css 负责控制样式。
10. 表单标签
表单是收集用户信息，让用户进行选择和填写的标签。
form表单中，有action和method属性。action表示表单提交到哪里，method表示用哪种http方式提交表单（有get和post等）。
input标签表示“输入”，也是一个自封闭标签。type属性表示“类型”。Type的属性值不同，input的样式也有改变。Html 4.01中，有如下几个属性值。
text“文本”：用于给出一个文本框，输入文字，用户可见。
password“密码”：输入不可见的密码。
radio“单选”：本身可以多选，通过name属性，为name赋予相同的属性值，即可实现单项选择。如果网页需要某一项默认被选择，则在其input标签中设置checked属性控制。Checked属性的值可以为任意，但按照规范一般写作checked = “checked”。
checkbox“复选”。各个复选也应当有相同的name属性，前端用不到，但是后台要用。
三种按钮：
a)普通按钮：
就是一个普通的按钮，上面显示的文字就是value的属性值。button就是英文“按钮”。
b)提交按钮：
提交按钮，点击就可以把表单提交到form的action属性所指向的网站去。这个按钮默认value的属性值为“提交”，也可以主动进行修改。submit就是英文“提
交”。
c)重置按钮：
重置按钮，点击会把整个表单中所有的信息回复到默认状态。默认的value值为“重置”。reset就是英文“重置”
select标签：“选择”。此标签与ul、ol、dl一样，也是一个组标签。其子级一定是option“选项”。select的作用是给出一个下拉选框提供选择，选框内的选项就是option 标签。option标签是文本级标签。设置默认，则使用selected = “selected”。
例：（表单）
https://www.doczj.com/doc/668030584.html,bel标签
input元素有id属性，label有for属性，两者属性值相同，input即与label绑定，
建立关联。所有表单元素都有label。如：
文字即与input建立关联。
12.实体字符
Html中，不能使用小于号< 或大于号> ，会让浏览器误认为是标签。还有一些其他的符号也是如此。在html中常用的一些实体字符如下：
小于号：< 大于号：> 版权：©人民币：¥空格：
注意：英文状态下的分号结尾，不可省略
13.废弃标签
现今的html只控制语义，不控制样式。但在html发展的早期，有些标签在控制语义的同时，也会控制样式，如：加粗，下划线，斜体，删除线，强调。这些标签的存在会干涉到css的作用，所以现在被废弃了。
其中也有例外，如
换行标签，现在也偶尔使用。换行一般选择
标签，但有些标签如标签等文本级标签，内部需要转行时，不能使用标签，还是会选择使用
。
现在所使用的div + css 模型，所用的标签种类很少。
韩顺平html笔记
HTML 一、HTML有关知识点 1.html介绍 html是一种标记语言，主要的用途是开发网页，使用html可以展现文字、图片、视频、声音，html是我们web开发（网站开发）。 2.html可以做什么 ?html可以编写静态网页 ?该静态网页可以包括文字、图像、动画、声音、表格、链接。从而构成一个个漂亮的网页 3.Html发展历史 4.Html的基本结构 5.是标记（也叫元素），标记的一般格式： <元素名[属性=“属性值”]>元素内容 如果没有内容可以用：<元素名[属性=“属性值”]/> 6.Html实体标记 7.Html常用标记
?html超链接 ●_blank 新的窗口 ●_self 本窗口 ●_parent 父窗口 ●_top整个浏览器窗口 ?html图像元素 
?html表格
?无序列表
?有序列表
?框架
?表单元素
文本框： 密码框： 单选框： 复选框：checked是指默认选中的 隐藏域： 图片按钮： ?文本域：
?下拉菜单：
