注释:
注释语法:
在很多代码技术中都可以添加注释内容,我们也可以向 HTML 源代码添加注释。
HTML注释语法:
<!-- 书写注释内容 -->
vscode快捷键:ctrl+/
注释的特点:
注释只在源代码中可见,在浏览器窗口是不显示的。
用途:
在源代码中添加描述性的提示信息,便于我们阅读代码。
对于 HTML 纠错也大有帮助,可以通过注释某一行 HTML 代码,以便检索错误的位置。
暂时注释掉一部分不用的代码,便于后期恢复代码。
标题:
标题标签:
标题(Heading),是通过<h1>-<h6> 六个标签分别来对六个级别的标题进行定义的。
<h1>定义最大的标题,<h6>定义最小的标题。
<h1>-<h6> 标签都是双标签,且是容器级标签。
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
标题标签的作用:
标题标签的作用是给标签内部的元素内容添加对应级别标题的语义,不负责文字的粗体、字号等样式。
样式是由css设定的。
标签级别:
标题标签之间是不能互相嵌套的,下一级标题与上级标题之间通过同级关系书写,下一级标题解释说明的是前面距离最近的上一级标题。

权重:

标题标签对于呈现文档结构非常重要,使用时要根据标签的重要程度进行选择,其中<h1>标签最重要,<h2>标签次重要,以此类推。
<h1>在整个HTML中的权重非常高,内部应该放置HTML中最重要的内容,比如logo。
<h1>由于非常重要,内部的文字对于提高搜索引擎排名也非常重要,为了防止作弊,如果一个页面出现多个<h1>,反而降低权重。约定俗成的,一个页面中只会出现一个<h1>。
段落和换行:
段落标签:
段落(paragraph)是通过<p>标签进行定义的。
<p>标签是双标签,且为文本级标签。内部只能放置文本、图片、表单元素,或者废弃的<font>标签等。

段落标签的作用:

<p>标签的作用是给标签内部的内容添加一个完整段落的语义,不负责内容自动换行的样式。
换行的效果是由css决定的。
换行标签:
<br />(breaking)标签是HTML中一个简单的换行符。
<br />标签是一个单标签。
在需要换行的位置可以使用<br />标签书写,但是<br />与<p>不同,<br />没有建立新的段落的语义,只是简单的进行强制换行。

常规用法:

每一对儿<p>标签内部的元素内容为一个完整的段落,如果有多个段落,需要分别使用不同的<p>标签进行定义。

 

 

文本格式化:
HTML中有部分标签是用来对文字进行格式化显示设置的,比如粗体和斜体等。
但是在HTML4.0版本规范后,结构和样式进行了分离,HTML只负责搭建结构,css负责格式化样式,所以大部分文本格式化标签被废弃,但是在HTML4.01和XHTML1.0transitional版本中依旧可以使用。
标签:
文本格
式化的标签均为双标签,且为文本级标签,内部只能书写文字。

 

 

图像:
图像(image)由<img>标签进行定义。
<img>标签是单标签,本身相当于一个特殊的文本。
<img>标签的作用是在指定的位置插入一张图片。
在HTML文件,常用的插入图片的类型有:jpg、png、gif。
标签属性:
由于<img>为单标签,所以它只能通过属性进行相关的图像设置。
<img>常用属性展示:

src属性和路径:

如果需要插入一张图片到HTML中,<img>标签必须设置src属性。 src:全称source资源,属性值是图片查找的路径。

路径:指的是寻找文件时所历经的线路,在HTML中有特殊的书写语法。 路径分为相对路径和绝对路径,不同的方式出发点和参考位置不同。

 

 

理解路径:
src属性和路径:
路径:指的是寻找文件时所历经的线路,在HTML中有特殊的书写语法。
部分标签的属性需要设置为路径,例如<img>的src属性。
路径分为相对路径和绝对路径,不同的方式出发点和参考位置不同。
相对路径:
相对路径查找文件时,需要从HTML文件本身出发,根据相对的位置进行查找,包含三种方向。
同级查找:指目标文件与HTML文件位于同一级,直接书写文件名+后缀格式;
<img src="smile01.jpg">
子级查找:指目标文件在与HTML文件同一级的文件夹的内部,需要先查找文件夹名称,然后通过关闭 符号/进入文件夹查找里面的文件;如果有多层文件夹,需要/进入多层。
<img src="images/smile02.png">
<img src="images/tupian/smile03.jpg">
上级查找:指目标文件在HTML文件所在文件夹的更上一级,需要跳出当前文件夹到上一层,路径写法 利用../表示跳出一级,如果跳出多级书写多次../,直到找到文件。
<img src="../../smile04.jpg" />
<img src="../images/smile01.jpg" />
绝对路径:
绝对路径查找文件时,不需要从HTML文件出发,而是直接从电脑的盘符出发进行查找,或者使用网址形式查找。
盘符出发:例如从c盘或者d盘出发查找图片,书写时以c:/开头,后续类似子级查找写法直至找到目标文件。

网址形式:要查找的文件是来自网络资源,路径写法以http://开头。

从盘符出发的绝对路径的缺点:

盘符出发的路径不可移植,不可移动。
盘符出发的路径容易出现中文字符,中文的路径容易出现错误。
路径实际应用:
建议多使用相对路径,可以适当使用网址形式的绝对路径。
使用相对路径必须将图片或文件与HTML同时上传,而且需要保持相对位置不变。
posted on 2020-11-29 18:52  KakaLuke  阅读(103)  评论(0编辑  收藏  举报