javascript 什么是“div 标签”?(请举例说明)

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19621441/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 16:12:38  来源:igfitidea点击:

What is a "div tag"? (Please explain with examples)

javascripthtmltags

提问by OwenCraddock

Okay so,

可以,然后呢,

This might not be the best question but I am new to programming (I'm 12) I think I've pretty much gotten down HTML and CSS, and I've moved into JavaScript. But I do not understand "div tags" and what they do. Can you please explain this to me? :) Thanks

这可能不是最好的问题,但我是编程新手(我 12 岁)我想我已经非常了解 HTML 和 CSS,并且我已经转向 JavaScript。但我不明白“div 标签”以及它们的作用。你能向我解释一下吗?:) 谢谢

回答by Jay Harris

The HTML <div>element (or HTML Document Division Element) is the generic container for flow content, which does not inherently represent anything. It can be used to group elements for styling purposes (using the class or id attributes), or because they share attribute values, such as lang. It should be used only when no other semantic element (such as <article>or <nav>) is appropriate.

HTML<div>元素(或 HTML Document Division Element)是流内容的通用容器,它本质上不代表任何内容。它可用于将元素分组以用于样式目的(使用 class 或 id 属性),或者因为它们共享属性值,例如 lang。仅当没有其他语义元素(例如<article><nav>)适合时才应使用它。

Example

例子

<div>
  <p>Any kind of content here. Such as &lt;p&gt;, &lt;table&gt;. You name it!</p>
</div>

Result

结果

Any kind of content here. Such as <p>, <table>. You name it!

这里的任何类型的内容。如<p>、<table>。你说出它的名字!

DIV - MDN

DIV - MDN

As for javascript, its an HTML element and it can be manipulated the same way any other html element can with the except of form elements. HTMLElement - MDN

至于 javascript,它是一个 HTML 元素,它可以像任何其他 html 元素一样进行操作,除了表单元素。HTMLElement - MDN

With each HTML element you have browser default styling, like <b>and <strong>tags their default styling is to bold text or font-weight: bold. And <div>default styling is display: blockwhich just means there is a line break before and after each div element, and of course you know you can change the default styling of that element with CSS

对于每个 HTML 元素,您都有浏览器默认样式,例如<b><strong>标签,它们的默认样式是粗体文本或font-weight: bold. 而<div>默认的造型是display: block这只是意味着有前后各div元素后换行,当然你知道你可以改变CSS该元素的默认样式

Example on how to change the default styling. this will change every <div>element's text color to red

关于如何更改默认样式的示例。这会将每个<div>元素的文本颜色更改为红色

 div {
  // change default styling here
  color: red;
 }

Looks like you'll need some CSS references too, don't use w3school btw. try MDN Learn CSS | MDN

看起来你也需要一些 CSS 参考,不要使用 w3school btw。尝试 MDN学习 CSS | MDN

回答by Guffa

A divtag is the HTML code to specify a divelement. Example:

一个div标签是HTML代码来指定一个div元素。例子:

<div>content</div>

The reason that it may be hard to grasp what a divelement does, is because it does as little as possible. The name div stands for division, and it's just a container that can be used to put text or other elements in. You can of course add styling to a divelement, like a border and background, but the element still just "looks", is has no special functions like for example an inputelement. You can also add events like a click handler to it, like most elements, but it doesn't react to any events by default.

可能难以掌握div元素做什么的原因是因为它尽可能少地做。名称div代表除法,它只是一个容器,可以用来放入文本或其他元素。你当然可以给div元素添加样式,比如边框和背景,但元素仍然只是“看起来”,是没有特殊功能,例如input元素。您还可以像大多数元素一样向其添加诸如单击处理程序之类的事件,但默认情况下它不会对任何事件做出反应。

There are two minimalistic elements like this, the divelement and the spanelement. The divelement is a block element, and the spanelement is an inline element. If you add them to the markup without styling them in any way, the divelement is only visible by how it affects other elements by being a block element, and the spanelement isn't visible at all.

有两个像这样的简约元素,div元素和span元素。所述div元件是一个块元件,该span元件是一个内联元件。如果您将它们添加到标记中而不以任何方式对其进行样式设置,则该div元素仅通过作为块元素而影响其他元素的方式span可见,并且该元素根本不可见。

HTML5 adds a few more elements, like header, footerand section, that are similar to the divelement, just with a more specific purpose to them.

HTML5 添加了更多元素,例如headerfootersection,它们与div元素相似,只是对它们有更具体的用途。

Although a divelement may seem pretty useless at first, it's actually used quite a lot. Because of its neutral default settings, it's very useful when used with styles and events as it can take any form and function.

虽然一个div元素一开始可能看起来很没用,但它实际上使用了很多。由于它的中性默认设置,它在与样式和事件一起使用时非常有用,因为它可以采用任何形式和功能。