什么是div标签？HTML中div标签怎么运用？-百分百源码网

什么是div标签？HTML中div标签怎么运用？

发布时间：09/01 来源：未知浏览：关键词：

HTML中的div标签是实现网页的重要根基，是学习HTML知识必不成少的内容，本篇文章就来为大家介绍关于HTML中div标签的使用办法。

什么是div标签？

div标签表示一组必要的构造。目的是将夹在div标签之间的字符分成块状。因此，独自的div标签没有诸如改动色彩或改动字符样式的结果。

别的，假如div标签不适合其他元素，则就临时不要使用它。

但是，实际上，当需要指定哪个元素时，我们经常会使用div标签。

通过将id和class增加到div标签并使用CSS处置id和class，你就可以更换div标签中的色彩或改动为其他样式。

div标签与Section标签的比力

我认为section标签在文档上显示单个汇合比力适宜

section标签用于将组指示为文档。

我认为章节有章节的项

正如章节子句的这个概念一样，section标签是一个块，假如它被提取，平常没成心义。

在报纸文章中，即便你只剪辑章节项，我也不认为整篇文章的企图可以传达。

通过比力，section标签的使用方式与div标签的使用方式不一样，而是作为句子用于表示组。

div标签的用途

写下div标签如下。

<div>内容</div>

如上所述，div标签通过增加id和class非常有用。怎样分配id和class如下。

<div id="id名">内容</div>
<div id="class名">内容</div>

顺便说一下id和class

顺便说一下，id和class是啥？id和class被称为属性，id是I具有D号之类的东西，具有雷同id名称的东西只能在该页面内使用一次。

相反，我们将id属性用于我们仅使用一次的事物。

另一方面，class属性可以在统一页面上使用屡次。假如要指定“此元素和此元素的色彩雷同”，请使用class属性。

当然，即便你只使用一次，也可以使用class属性。

我们来看实际的例子

我们先来看看div标签包抄的结果

关于id和class，我们指定每个名词的色彩名称。

使用以下源代码创立div.html并在阅读器中翻开它。

div.html

<html>
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    <div id="red">iphone</div>
    <div class="skyblue">天空</div>
    <div class="yellow">香蕉</div>
    <div class="blue">大海</div>
    <div class="lightyellow">蒲公英</div>
  </body>
</html>

在阅读器中显示结果如下：

2345截图20181126115725.png

上述只要文字显示，此刻让我们用CSS作为背景上色。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title></title>
    <style type="text/css">
 #red {
        background-color: #FF0000;
      }
      .skyblue {
        background-color: skyblue;
      }
      .yellow{
        background-color: yellow;
      }
      .blue{
        background-color: blue;
      }
      .beige{
        background-color: beige;
      }
 </style>
  </head>
  <body>
  <div id="red">iphone</div>
    <div class="skyblue">天空</div>
    <div class="yellow">香蕉</div>
    <div class="blue">大海</div>
    <div class="beige">蒲公英</div>
  </body>
</html>

在阅读器中显示结果如下：

2345截图20181126133204.png