HTML基础标签

1.注释标签

作用：方便阅读和理解HTML文档。

基本语法格式:

<!-- 注释语句 -->

2.标题标签 h

作用：为了使网页更具有语义化。

HTML提供了6个等级的标签即<h1>、<h2>、<h3>、<h4>、<h5>、<h6>作为标题使用。

   基本语法格式：

    <h1>标题</h1>
    <h2>标题</h2>
    <h3>标题</h3>
    <h4>标题</h4>
    <h5>标题</h5>
    <h6>标题</h6>

特性：文字加粗 独占一行 字号逐级递减  上下有空白行

注意：h1比较重要 通常留给logo使用

3.段落标签 p

作用：在网页中把文字有条理的显示出来。

基本语法格式：

<p>
        我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字
        我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字
        我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字
        
        
</p>

 特性：独占行  上下有空白行

4.水平线标签

作用：在网页中常看到一些水平线将段落与段落分开，使文档结构清晰，层次分明。

基本语法格式:

<hr>

5.换行标签

作用：在HTML中，一个段落中的文字会从左到右依次排列，直到浏览器窗口的右端,然后自动换行。如果希望某段文本强制换行显示，就需要使用换行标签。

基本语法格式:

<p>
        <!-- 浏览器会把换行和多个空格 翻译成一个空格 -->
        我 <br> <br>
        是一段文字我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字
        我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字
        我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字
        我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字我是一段文字
       
</p>

6.div span

div span是没有语义的 是我们网页布局主 要的2个盒子

 <!-- div 没有语义  独占一行  -->
    <div>我是文字</div>
    <div>我是文字</div>
 <!-- span 没有语义 一行可以有多个span -->
    <span>我也可以放文字</span>
    <span>我也可以放文字</span>

7.文本格式化标签

在网页中，有时需要为文字设置粗体、斜体或下划线效果，这时就需要用到HTML中的文本格式化标签，使文字以特殊的方式显示。

 <!-- 一行可以有多个 -->
    <b>加粗</b>
    <i>倾斜</i>
    <u>下划线</u>
    <s>删除线</s>
    <br>
    <strong>加粗</strong>
    <em>倾斜</em>
    <ins>下划线</ins>
    <del>删除线</del>

8.图像标签img

想在网页中显示图像就需要使用图像标签

<!-- <img src="images/oldman.jpg"> -->

    <!-- 绝对路径 -->
    <img src="/Users/maboxuan/Desktop/b0367/html/day01基础标签/job/圣诞/images/oldman.jpg" alt="">

    <!-- 相对路径  ./ 表示进入当前文件所在文件夹  ./可以省略-->
    <img src="images/oldman.jpg">

    <!-- ../ 表示跳出当前文件所在的文件夹 ../../ -->
    <img src="../job/圣诞/images/oldman.jpg" alt="">

该语法中src属性用于指定图像文件的路径和文件名,他是img标签的必需属性。

9.链接标签