简述html⽂件的基本标记组成_HTML详细介绍1
html概述和基本结构
html概述
HTML是 HyperText Mark-up Language 的⾸字母简写，意思是超⽂本标记语⾔，超⽂本指的是超链接，标记指的是标签，是⼀种⽤来制作⽹页的语⾔，这种语⾔由⼀个个的标签组成，⽤这种语⾔制作的⽂件保存的是⼀个⽂本⽂件，⽂件的扩展名为html或者htm，⼀个html⽂件就是⼀个⽹页，html⽂件⽤编辑器打开显⽰的是⽂本，可以⽤⽂本的⽅式编辑它，如果⽤浏览器打开，浏览器会按照标签描述内容将⽂件渲染成⽹页，显⽰的⽹页可以从⼀个⽹页链接跳转到另外⼀个⽹页。
html基本结构
⼀个html的基本结构如下：
⽹页标题⽹页显⽰内容
第⼀⾏是⽂档声明，第⼆⾏“”标签和最后⼀⾏“”定义html⽂档的整体，“”标签中的‘lang=“en”’定义⽹页的语⾔为英⽂，定义成中⽂是’lang=“zh-CN”’，不定义也没什么影响，它⼀般作为分析统计⽤。 “”标签和“”标
签是它的第⼀层⼦元素，“”标签⾥⾯负责对⽹页进⾏⼀些设置以及定义标题，设置包括定义⽹页的编码格式，外链css样式⽂件和javascript⽂件等，设置的内容不会显⽰在⽹页上，标题的内容会显⽰在标题栏，“”内编写⽹页上显⽰的内容。
HTML⽂档类型
⽬前常⽤的两种⽂档类型是xhtml 1.0和html5
xhtml 1.0
xhtml 1.0 是html5之前的⼀个常⽤的版本，⽬前许多⽹站仍然使⽤此版本。
此版本⽂档⽤sublime text创建⽅法： html:xt + tab
⽂档⽰例：
xhtml 1.0 ⽂档类型
html5
pc端可以使⽤xhtml 1.0，也可以使⽤html5，html5是向下兼容的
此版本⽂档⽤sublime text创建⽅法： html:5 + tab 或者 ! + tab
⽂档⽰例：
html5⽂档类型
两种⽂档的区别
1、⽂档声明和编码声明
2、html5新增了标签元素以及元素属性
html注释：
html⽂档代码中可以插⼊注释，注释是对代码的说明和解释，注释的内容不会显⽰在页⾯上，html代码中插⼊注释的⽅法是：
html标题标签
通过
、
、
、
、
、
，标签可以在⽹页上定义6种级别的标题。6种级别的标题表⽰⽂档的6级⽬录层级关系，⽐如说：
⽤作主标题，其后是
，再其次是
，以此类推。搜索引擎会使⽤标题将⽹页的结构和内容编制索引，所以⽹页上使⽤标题是很重要的。
这是⼀级标题
这是⼆级标题
这是三级标题
html段落标签、换⾏标签与字符实体
html段落标签
标签定义⼀个⽂本段落，⼀个段落含有默认的上下间距，段落之间会⽤这种默认间距隔开，代码如下：
段落
HTML是 HyperText Mark-up Language 的⾸字母简写，意思是超⽂本标记语⾔，超⽂本指的是超链接，标记指的是标签，是⼀种⽤来制作⽹页的语⾔，这种语⾔由⼀个个的标签组成，⽤这种语⾔制作的⽂件保存的是⼀个⽂本⽂件，⽂件的扩展名为html或者htm。
⼀个html⽂件就是⼀个⽹页，html⽂件⽤编辑器打开显⽰的是⽂本，可以⽤⽂本的⽅式编辑它，如果⽤浏览器打开，浏览器会按照标签描述内容将⽂件渲染成⽹页，显⽰的⽹页可以从⼀个⽹页链接跳转到另外⼀个⽹页。
html换⾏标签
代码中成段的⽂字，直接在代码中回车换⾏，在渲染成⽹页时候不认这种换⾏，如果真想换⾏，可以在代码的段落中插⼊
来强制换⾏，代码如下：
⼀个html⽂件就是⼀个⽹页，html⽂件⽤编辑器打开显⽰的是⽂本，可以⽤
⽂本的⽅式编辑它，如果⽤浏览器打开，浏览器会按照标签描述内容将⽂件
渲染成⽹页，显⽰的⽹页可以从⼀个⽹页链接跳转到另外⼀个⽹页。
html字符实体
代码中成段的⽂字，如果⽂字间想空多个空格，在代码中空多个空格，在渲染成⽹页时只会显⽰⼀个空格，如果想显⽰多个空格，可以使⽤空格的字符实体，代码如下：
⼀个html⽂件就是⼀个⽹页，html⽂件⽤编辑器打开显⽰的是⽂本，可以⽤
⽂本的⽅式编辑它，如果⽤浏览器打开，浏览器会按照标签描述内容将⽂件
渲染成⽹页，显⽰的⽹页可以从⼀个⽹页链接跳转到另外⼀个⽹页。
在⽹页上显⽰ “” 会误认为是标签，想在⽹页上显⽰“”可以使⽤它们的字符实体，⽐如：
3 < 5
10 > 5
html块标签、含样式的标签
html块标签
1、
标签 块元素，表⽰⼀块内容，没有具体的语义。
2、 标签 ⾏内元素，表⽰⼀⾏中的⼀⼩段内容，没有具体的语义。
含样式和语义的标签
1、 标签 ⾏内元素，表⽰语⽓中的强调词
2、 标签 ⾏内元素，表⽰专业词汇
html href属性3、 标签 ⾏内元素，表⽰⽂档中的关键字或者产品名
4、 标签 ⾏内元素，表⽰⾮常重要的内容
语义化的标签
语义化的标签，就是在布局的时候多使⽤有语义的标签，搜索引擎在爬⽹的时候能认识这些标签，理解⽂档的结构，⽅便⽹站的收录。⽐如：h1标签是表⽰标题，p标签是表⽰段落，ul、li标签是表⽰列表，a标签表⽰链接，dl、dt、dd表⽰定义列表等，语义化的标签不多。
html图像标签、绝对路径和相对路径
html图像标签
标签可以在⽹页上插⼊⼀张图⽚，它是独⽴使⽤的标签，它的常⽤属性有：
src属性 定义图⽚的引⽤地址
alt属性 定义图⽚加载失败时显⽰的⽂字，搜索引擎会使⽤这个⽂字收录图⽚、盲⼈读屏软件会读取这个⽂字让盲⼈识别图⽚，所以此属性⾮常重要。
绝对路径和相对路径
像⽹页上插⼊图⽚这种外部⽂件，需要定义⽂件的引⽤地址，引⽤外部⽂件还包括引⽤外部样式表，javascript等等，引⽤地址分为绝对地址和相对地址。
绝对地址：相对于磁盘的位置去定位⽂件的地址
相对地址：相对于引⽤⽂件本⾝去定位被引⽤的⽂件地址
绝对地址在整体⽂件迁移时会因为磁盘和顶层⽬录的改变⽽不到⽂件，相对路径就没有这个问题。相对路径的定义技巧：
“ ./ ” 表⽰当前⽂件所在⽬录下，⽐如：“./pic.jpg” 表⽰当前⽬录下的pic.jpg的图⽚，这个使⽤时可以省略。
“ …/ ” 表⽰当前⽂件所在⽬录下的上⼀级⽬录，⽐如：“…/images/pic.jpg” 表⽰当前⽬录下的上⼀级⽬录下的images⽂件夹中的pic.jpg的图⽚。
html链接标签
标签可以在⽹页上定义⼀个链接地址，它的常⽤属性有：
href属性 定义跳转的地址
title属性 定义⿏标悬停时弹出的提⽰⽂字框
target属性 定义链接窗⼝打开的位置
target="_self" 缺省值，新页⾯替换原来的页⾯，在原来位置打开target="_blank" 新页⾯会在新开的⼀个浏览器窗⼝打开
aa测试页⾯2

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。