What is divs for?

Question

What is divs for?

Navigation

#1 by (2 votes)
#2 by (0 votes)

1

Div is one of the tags I see most in HTML and that is used from start to finish in the body but I do not understand what exactly it is for or why they put div inside another div.

html

asked by anonymous 19.05.2018 / 02:04

2 answers

Create / manipulate file within a directory other than main.cpp How to print UTF-8 characters in c ++ console?

score 2 · Answer 1

Much of this answer is based on good practice, ux, accessibility and my own opinion.

What is <div>

The div element has no special meaning at all. It represents its children. It can be used with the class , lang , and title attributes to mark up semantics common to a group of consecutive elements.

The div element has no special meaning, it represents your children, it can be used with the class , lang , and title attributes to mark the common semantics of a group of consecutive elements. "

Source of official W3C documentation link

div

div isor serves to split the layout into blocks. And logically you can receive CSS styles and receive behaviors from the most diverse.

But why do they both use <div> ?

I think we see so many div in HTML because they are often used in the wrong way, for example to build tables, menus, and even forms ... I will not generalize, but if you see in HTML an element that < in> defaul of type block and has display set with display:inline it is probably being used in a wrong way structurally speaking.

I believe that in the next few years you will see less and less div , do you know why? Because HTML 5 is semantic now. Now we can split our layout by <sections> , <articles> , <footers> , <headers> , <nav> etc. With display:flex we no longer need to use display:inline-block nor float:left in div to line up side by side and still have to do the "clearing" of clearfix not to leave the layout break.

Semantic layout without needing div

Anotherreasontoseesomanydivisbecauseoftheseframeworksthatdeliverready-madecomponentsandyouputonecomponentinsidetheotherandthuscreatealotofdivsunnecessary...Anywordpresssitebyexampleusuallyhasahugenumberofdivsbecausetheyaremostlyatemplatefullofcomponentsandplugins.

ExampledivinBootstrapComponentBuilding:

In short, <table> is to make table, <form> is to do form, if a div next to another does not use float , float is not for that. And use HTML5% semantic tags with% for menus, <nav> for footer etc. and if need use a div or another within those elements to divide the elements into blocks if necessary.

19.05.2018 / 15:13

score 0 · Answer 2

Div is an HTML tag. More precisely, an element that behaves like a block. Widely used to structure the layout of a page.

In HTML there are tags that behave like Block and as a line.

Examples of elements that behave as lines:

- <a>, <span>, <strong>, <b>...

Examples of elements that behave like blocks:

- <div>, <p>, <section>, <article>...

One of the ways to identify when the element behaves as a block is to check if it breaks a line when it is declared next to another element.

How?

Declare:

<a href="#">Link aqui</a> <div>Um conteúdo aqui</div>

Note that the rendering in the browser will be as follows:

Link here
A content here

With this it is possible to conclude that <a> is an element that behaves as a line, because it does not break a line when rendering, since element <div> is a block element, because when it is rendered it does not continued in the same line as <a> .