搜索

首页  >  文章  >  web前端  >  HTML 节与 Div

HTML 节与 Div

王林
王林原创
2024-09-04 16:17:02885浏览

Div 是定义为 Html 文档的分区的标签。主要用于对块元素进行分组；每当我们在 Html 页面上使用它时，它都会用于 CSS 样式表。该部分也是一个标签；它描述了 Html 文档的每个部分，即在 html 中，网页有页眉、页脚等，称为节。每个功能都会随之而来；该部分的任何一个主体都包含在章节部分中。

HTML 部分与 Div（信息图表）之间的头对头比较

以下是 HTML Section 与 Div 之间的前 6 个比较：

HTML 节与 Div

HTML 部分与 Div 之间的主要区别

让我们在以下几点讨论 HTML Section 与 Div 之间的一些关键区别：

  • 每组概念都有一些优点和差异，因为其中一个可能不是更好。
  • 该部分代表一些通用或html文档； div 也是通用的流容器。当用户需求需要样式目的，或者有时脚本（前端代码）必须更改时，需要使用section元素时，将使用section标签而不是div标签。
  • 节标签用于内容 blob，用于在数据库中存储各个二进制记录。 div标签一般用于块级类型，因此该元素没有像blob类型那样的附加功能。
  • div标签一般是一个空容器，一般定义分区类型或者节类型；无论开发人员编写前端代码或格式（如页眉、页脚）或任何布局更改（水平和垂直布局），它都不会影响内容，它不会影响内容。但在部分中，每个部分类型都应被标识并包含在诸如

    之类的标题中。到

    作为
    的子节点元素。
  • 它单独制作的部分元素来联合元素的内容，而不是
    ;标签元素。在中用于导航菜单的标签元素是搜索结果列表并将其映射到特定元素，它也放在
    内标签。该部分也是全局属性。
  • 在 html5 部分有一些类别，如流内容、分段内容和可触及内容。它也与以前的版本相同，规则是通用一个
    仅当其他元素内容以显式方式列出时， tag 元素才适用。 Div 用于
    ； htm5中的标签，与之前版本功能相同，用于分区标签。
    也将用于嵌套的 div 标签，父标签和子标签关系用于
    和
    。和标签

    HTML部分与Div的比较表

    下表总结了 HTML Section 与 Div 之间的比较：

    Html Section Tag Html Div Tag
    The tag defines a section of documents like chapters, headers, footers and body sections. The tag defines a separate division or sections of the documents.
    tag is use for html5 version.
    tag is use for html5 version.
    It is not a generic container and global attributes. It is a generic container.
    When creating a section in html 5 version, the id should be a unique one, and the class should use it multiple times when it is needed. When div tag, place any html elements within the
    tag and cannot use for inside the

    tag because the paragraph tag will be broken at any point in time.
    Here CSS is not necessary hence it is a structural element used to group together related elements. If. we want to use CSS styles in sections IE 9 browser and some other browsers supported previous IE versions not supported. Applying CSS styles inside the div tag uses tag, which is used for within inline elements. All browsers will be supported hence no compatibility issue.
    Section tag containing article elements in html Div tag contains all the elements where the

    tag should not force to do it.
    Html 部分标签 Html Div 标签 该标签定义文档的一部分，例如章节、页眉、页脚和正文部分。 该标签定义文档的单独部分或部分。 <部分>标签用于html5版本。
    ;标签用于html5版本。
    它不是通用容器和全局属性。 它是一个通用容器。 在html 5版本中创建一个section时，id应该是唯一的，并且类在需要时应该多次使用它。 当 div 标签时，将任何 html 元素放置在
    内标签，不能用于

    内部标签，因为段落标签随时都会被破坏。

    这里 CSS 不是必需的，因此它是一个用于将相关元素分组在一起的结构元素。如果。我们想在IE 9浏览器和其他一些支持的浏览器中使用CSS样式，以前的IE版本不支持。 在 div 标签内应用 CSS 样式使用 标签，用于内联元素。所有浏览器都将受支持，因此不存在兼容性问题。 html 中包含文章元素的部分标签 Div 标签包含

    所在的所有元素。标签不应强制执行此操作。

    表>

    Section 标签和 Div 标签示例

    以下是Section Tag和Div Tag的示例：

    示例 #1 – 部分标签

    代码：

    <html>
<body>
<section>
<h1>Sample</h1>
<p>WelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcomeWelcome</p>
</section>
<section>
<h1>First</h1>
<p>WelcometomydomainWelcometomydomainWelcometomydomainWelcometomydomainWelcometomydomainWelcometomydomainWelcometomydomainWelcometomydomainWelcometomydomainWelcometomydomainWelcometomydomain</p>
</section>
</body>
</html>

    输出：

    HTML 节与 Div

    上面的例子是

    的基础html 文档中使用了两次标记，其中一个部分是示例，另一个部分都使用

    。标签以段落格式显示数据。

    示例 #2 – Div 标签

    代码：

    <html>
<body>
<p>Sample.</p>
<div style="background-color:Green">
<h3>Welcome To My Domain</h3>
<p>Welcome To My Domain</p>
</div>
</body>
</html>

    输出：

    HTML 节与 Div

    上面的示例适用于带有一些 CSS 样式（如背景颜色）的 div 标签，以及一个附加标签（如

    ） ,这里

    标签用于上面的

    ；标签因此它是一个段落标签，因此它不会用于
    里面有标签。

    示例 #3 – Div 标签

    代码：

    <html>
<head>
<style>
#s{
width:10px;
background: #green;
height:40px;
}
.s1{
width:90px;
font: 60.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
font-size:10px;
font-weight:bold;
}
</style>
</head>
<body>
<marquee><p>Sample.</p></marquee>
<div id="s">
<div class="s1">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">AboutUs</a></li>
<li><a href="#">ContactUs</a></li>
</ul>
</div><!--closing div class for "menu"-->
</div><!--closing div for "container"-->
</body>
</html>

    输出：

    HTML 节与 Div

    上面的例子与

    相同标签，但这里我们使用嵌套的div标签，与节标签相比，它更具优势；另外，我们在上面的例子中使用相同的 CSS 样式，这里一个 div 标签我们使用 CSS 样式作为 id，另一个 div 标签我们使用 CSS 样式作为一个类，这样它就会从一个 div 标签分离到另一个 div 标签中。因此，无论何时何地我们使用
    标签，它将适当地关闭
    标签是必须的；否则，代码将无法正确执行。我们使用另外为一些动画添加标签以吸引用户。

    结论

    上面的主题，我们讨论了section标签和div标签之间的区别；更多的步骤和要点与这两个概念相同。但有时某些功能可以接受section标签，有些功能可以接受div标签。但是，目标和操作在 html 文档中是相同的行。

    以上是HTML 节与 Div的详细内容。更多信息请关注PHP中文网其他相关文章！

    html5 css html if for format using class Generic map this display background table database issue
    声明：
    本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
    上一篇：What is XHTML?下一篇：DHTML

    相关文章

    查看更多