明輝手游網(wǎng)中心：是一個免費(fèi)提供流行視頻軟件教程、在線學(xué)習(xí)分享的學(xué)習(xí)平臺！

什么是div標(biāo)簽？HTML中div標(biāo)簽如何使用？

發(fā)表時間：2023-08-27 來源：明輝站整理相關(guān)軟件相關(guān)文章人氣：

[摘要]HTML中的div標(biāo)簽是實(shí)現(xiàn)網(wǎng)頁的重要基礎(chǔ)，是學(xué)習(xí)HTML知識必不可少的內(nèi)容，本篇文章就來為大家介紹關(guān)于HTML中div標(biāo)簽的使用方法。什么是div標(biāo)簽？div標(biāo)簽表示一組必要的結(jié)構(gòu)。目的是將夾在div標(biāo)簽之間的字符分成塊狀。因此，單獨(dú)的div標(biāo)簽沒有諸如改變顏色或改變字符樣式的效果。另外，如果d...
HTML中的div標(biāo)簽是實(shí)現(xiàn)網(wǎng)頁的重要基礎(chǔ)，是學(xué)習(xí)HTML知識必不可少的內(nèi)容，本篇文章就來為大家介紹關(guān)于HTML中div標(biāo)簽的使用方法。

什么是div標(biāo)簽？

div標(biāo)簽表示一組必要的結(jié)構(gòu)。目的是將夾在div標(biāo)簽之間的字符分成塊狀。因此，單獨(dú)的div標(biāo)簽沒有諸如改變顏色或改變字符樣式的效果。

另外，如果div標(biāo)簽不適合其他元素，則就暫時不要使用它。

但是，實(shí)際上，當(dāng)需要指定哪個元素時，我們經(jīng)常會使用div標(biāo)簽。

通過將id和class添加到div標(biāo)簽并使用CSS處理id和class，你就可以更改div標(biāo)簽中的顏色或改變?yōu)槠渌麡邮健?/p>

div標(biāo)簽與Section標(biāo)簽的比較

我認(rèn)為section標(biāo)簽在文檔上顯示單個集合比較合適

section標(biāo)簽用于將組指示為文檔。

我認(rèn)為章節(jié)有章節(jié)的項(xiàng)

正如章節(jié)子句的這個概念一樣，section標(biāo)簽是一個塊，如果它被提取，通常沒有意義。

在報紙文章中，即使你只剪輯章節(jié)項(xiàng)，我也不認(rèn)為整篇文章的意圖可以傳達(dá)。

通過比較，section標(biāo)簽的使用方式與div標(biāo)簽的使用方式不同，而是作為句子用于表示組。

div標(biāo)簽的用法

寫下div標(biāo)簽如下。

<div>內(nèi)容</div>

如上所述，div標(biāo)簽通過添加id和class非常有用。如何分配id和class如下。

<div id="id名">內(nèi)容</div>
<div id="class名">內(nèi)容</div>

順便說一下id和class

順便說一下，id和class是什么？id和class被稱為屬性，id是I具有D號之類的東西，具有相同id名稱的東西只能在該頁面內(nèi)使用一次。

相反，我們將id屬性用于我們僅使用一次的事物。

另一方面，class屬性可以在同一頁面上使用多次。如果要指定“此元素和此元素的顏色相同”，請使用class屬性。

當(dāng)然，即使你只使用一次，也可以使用class屬性。

我們來看實(shí)際的例子

我們先來看看div標(biāo)簽包圍的結(jié)果

對于id和class，我們指定每個名詞的顏色名稱。

使用以下源代碼創(chuàng)建div.html并在瀏覽器中打開它。

div.html

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

在瀏覽器中顯示效果如下：

2345截圖20181126115725.png

上述只有文字顯示，現(xiàn)在讓我們用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">蘋果</div>
    <div class="skyblue">天空</div>
    <div class="yellow">香蕉</div>
    <div class="blue">大海</div>
    <div class="beige">蒲公英</div>
  </body>
</html>

在瀏覽器中顯示效果如下：

2345截圖20181126133204.png

可以看到背景是彩色的，也還可以確認(rèn)指定了多個相同的類。

以上就是什么是div標(biāo)簽？HTML中div標(biāo)簽怎么使用？的詳細(xì)內(nèi)容，更多請關(guān)注php中文網(wǎng)其它相關(guān)文章！


網(wǎng)站建設(shè)是一個廣義的術(shù)語，涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護(hù)的網(wǎng)站。