Quelle est la différence entre et?

Quelle est la différence entre

Et

?

Peuvent - ils être utilisés de manière interchangeable? Quelles sont les applications?

161
demandé sur Peter Mortensen 2010-02-09 06:29:49

11 réponses

Le code précédent était

<p class='item'><span class='name'>*Scrambled eggs on crusty Italian ciabatta and bruschetta tomato</span><span class='price'>$12.50</span></p>

Donc je dois le changer en

<div class='item'><span class='name'>*Scrambled eggs on crusty Italian ciabatta and bruschetta tomato</span><span class='price'>$12.50</span></div>

C'était la solution facile. Et le CSS pour le code ci-dessus est

.item {
    position: relative;
    border: 1px solid green;
    height: 30px;
}

.item .name {
    position: absolute;
    top: 0px;
    left: 0px;
}

.item .price {
    position: absolute;
    right: 0px;
    bottom: 0px;
}

Donc div tag peut contenir d'autres éléments. P ne devrait pas être forcé de le faire.

-17
répondu Kazi T Ahsan 2014-07-27 14:24:41

Ils ont sémantique différence - <div> élément est conçu pour décrire un conteneur de données, tandis que d'un <p> élément est conçu pour décrire un paragraphe de contenu.

La sémantique fait toute la différence. HTML est un langage de balisage qui signifie qu'il est conçu pour "marquer" le contenu d'une manière qui est significatif pour le consommateur de l'annotation. La plupart des développeurs croient que la sémantique du document sont les styles et le rendu par défaut que les navigateurs appliquent à ces éléments, mais qui n'est pas le cas.

Les éléments que vous choisissez de marquer votre contenu doivent décrire le contenu. ne marquez pas votre document en fonction de son apparence - marquez-le en fonction de ce qu'il est.

Si vous avez besoin d'un conteneur Générique uniquement à des fins de mise en page, utilisez un <div>. Si vous avez besoin d'un élément pour décrire un paragraphe de contenu, puis utilisez un <p>.

Note: Il est important de comprendre que les deux <div> et <p> sont des éléments de niveau bloc {[27] } ce qui signifie que la plupart des navigateurs les traiteront de la même manière.

262
répondu Andrew Hare 2010-02-09 13:26:02

Toutes les bonnes réponses, mais il y a une différence que je n'ai pas encore vue mentionnée, et c'est ainsi que les navigateurs les rendent par défaut. Les principaux navigateurs web afficheront une balise <p> avec une marge au-dessus et au-dessous du paragraphe. Une balise <div> sera rendue sans aucune marge.

56
répondu ceejayoz 2010-02-09 03:48:37

<p> indique un paragraphe et a une signification sémantique.

<div> est simplement un conteneur de bloc pour d'autres contenus.

Tout ce qui peut aller dans un <p> peut aller dans un <div>, mais l'inverse n'est pas vrai. Les balises <div> peuvent avoir des éléments de niveau bloc en tant qu'enfants. <p> éléments ne peuvent pas.

Tae un regard sur le HTML DTD .

<!ENTITY % inline "#PCDATA | %fontstyle; | %phrase; | %special; | %formctrl;">
<!ENTITY % block
     "P | %heading; | %list; | %preformatted; | DL | DIV | NOSCRIPT |
      BLOCKQUOTE | FORM | HR | TABLE | FIELDSET | ADDRESS">

<!ENTITY % flow "%block; | %inline;">

<!ELEMENT DIV - - (%flow;)*            -- generic language/style container -->
<!ELEMENT P - O (%inline;)*            -- paragraph -->
55
répondu cletus 2010-02-09 03:38:05

La seule différence entre les deux éléments est la sémantique. Les deux éléments, par défaut, ont la règle CSS display: block (donc block-level) qui leur est appliquée; rien de plus( sauf une marge supplémentaire dans certains cas). Cependant, comme mentionné ci-dessus, ils diffèrent grandement en termes de sémantique.

L'élément <p>, comme son nom l'indique quelque peu, est destiné aux paragraphes. Ainsi, <p> doit être utilisé lorsque vous souhaitez créer des blocs de texte de paragraphe.

L'élément <div>, cependant, a peu ou pas de sens sémantiquement et peut donc être utilisé comme un élément générique de niveau bloc-le plus souvent, les gens l'utilisent dans les mises en page car il n'a pas de sens sémantiquement et peut être utilisé pour tout ce que vous pourriez avoir besoin d'un élément de niveau bloc.

Lien pour plus de détails

8
répondu Ashish Agarwal 2010-02-09 03:52:54

DIV est un conteneur générique de niveau bloc qui peut contenir n'importe quel autre bloc ou éléments en ligne, y compris d'autres éléments DIV, alors que P est d'envelopper les paragraphes (texte).

7
répondu bdl 2010-02-09 03:33:09

Il pourrait être préférable de voir la norme conçue par W3.org. Voici l'adresse: http://www.w3.org/

Une balise" DIV "peut envelopper la balise" p "alors qu'une balise" p "ne peut pas envelopper la balise" DIV " -jusqu'à présent, je connais cette différence. Il peut y avoir plus d'autres différences.

7
répondu Hoque 2010-02-09 03:43:11

Pensez à DIV comme un élément de regroupement. Vous mettez des éléments dans un élément DIV afin que vous puissiez définir leurs alignements

Alors que "p" est simplement de créer un nouveau paragraphe.

5
répondu Suraj Chandran 2010-02-09 03:33:23

Représente un paragraphe et

représente une "division", je suppose que la principale différence est que les Div sont sémantiquement "dénués de sens", où un est censé représenter quelque chose se rapportant au texte lui-même.

Vous ne voudriez pas avoir des

Imbriqués par exemple, car cela n'aurait pas beaucoup de sens sémantique (sauf dans le sens des citations) alors que les gens utilisent des

imbriqués pour la mise en page.

Selon Wikipedia

EN HTML, la durée et les éléments div sont utilisé lorsque des parties d'un document ne être sémantiquement décrit par d'autres Les éléments HTML.

3
répondu Chad Okere 2010-02-09 03:33:39

Un p balise est pour un paragraphe, généralement utilisé pour le texte. Une balise div est pour la division, et généralement utilisée pour créer des sections de texte.

2
répondu Daniel A. White 2010-02-09 03:33:59

'p' est utilisé sémantiquement pour le texte, les paragraphes généralement.

' div ' est utilisé pour un bloc ou une zone dans une page Web. Par exemple, il pourrait être utilisé pour créer la zone d'un en-tête.

Le pourrait - probablement être utilisé interchangebly, mais vous ne devriez pas.

2
répondu vectran 2010-02-09 03:34:00