Znaczniki HTML kontenera - właściwe użycie?

Question

Od pewnego czasu robię strony internetowe, ale nigdy nie widziałem dyskusji na temat prawidłowego wykorzystania tagów kontenera. Widziałem wiele różnych rodzajów treści w tagach kolekcji, ale zazwyczaj wygląda na to, że twórca strony wybiera styl, który im się podoba i trzyma się go.

Głównym rozbieżność w moim umyśle jest to, że między

<p> 
<div> 

ale bym jak również opinie dotyczące

<span> 

i wszelkich innych I można zapominania.

Answer 1

HTML został pierwotnie stworzony, aby umieścić treść dokumentów w jakiejś strukturze zrozumiały dla komputerów. Mając to na uwadze, znacznik p powinien zawierać wszystko, co miałoby strukturę w formie akapitu, gdyby zawartość strony została przekształcona w drukowany dokument. Elementy div i są zarezerwowane jako kontenery ogólnego zastosowania, aby ułatwić formowanie i grupowanie powiązanych elementów w celu zapewnienia dodatkowych poziomów struktury, być może skorelowanych ze stronami w dokumencie tekstowym.

W niektórych przypadkach p tagi powinny zawierać inne elementy, takie jak kotwy (a), obraz (img) oraz innych elementów-line, ponieważ odnoszą się one bezpośrednio do treści reszty ustępu i to warto pogrupować je w ten sposób, a tekst reszty akapitu zapewnia bardziej dogłębny opis.

Jeśli nie ma dodatkowego opisu tych elementów, to nie ma sensu umieszczać ich w akapicie po prostu jako wygodnego pojemnika; bardziej odpowiednie byłoby ustawienie div. Ogólnie rzecz biorąc, akapit powinien zawierać jeden akapit tekstu i wszelkie bezpośrednio powiązane lub opisane elementy. Nic nie ma większego sensu w paragrafie.

---

UPDATE: HTML5 dodaje także szereg innych elementów semantycznych "pojemnik", w tym article, nav, header, section i aside.

Answer 2

Myślę, że twórcy stron powinni używać znaczników semantycznych, co oznacza, że ​​tworzony przez nie znacznik powinien komunikować znaczenie (a nie prezentację). <div> i <p> mają różne znaczenia. Pierwszy służy do definiowania podziału (lub sekcji) strony HTML, druga do definiowania akapitu tekstu.

Answer 3

myślę, znaczenie znaczników jest mniej więcej tak:

<p>Paragraph, usually just text</p> 

<div>A block, containing anything</div> 

<span>Just a simple non-blocking wrapper</span> 

Answer 4

<p> jest element blokowy, który powinien zawierać punkt, składa się z tekstu, elementy wbudowane, które modyfikują ten tekst (<p>, <a>, <abbr>, etc.) i obrazów.

<div> to element blokowy używany do dzielenia strony, prawie zawsze w połączeniu ze stylami CSS.

<span> ... no cóż, szczerze mówiąc nie używam tego znacznika tak często.Jest to element śródliniowy i używam go zazwyczaj, gdy chcę zastosować style do części tekstu, która nie skorzystałaby z użycia czegoś o większym znaczeniu, takiego jak znaczniki <strong> i <em>.

Answer 5

Trzeba było zobaczyć <span> i <div> jako "tofu webdeveloppement", ponieważ nie ma on prawdziwego smaku, ale można z nim zrobić praktycznie wszystko.

(X) Znaczniki HTML określają, czym jest otaczany tekst. Czy to jest adres, czy jest to link, czy jest to akapit, i tak dalej ...

<div> i <span> to po prostu sposoby na uzyskanie fragmentów witryny, do których zwykle nie można się dostać. Podobnie jak przy próbie zmiany rozmiaru | symbol. Najszybszym sposobem, jaki kiedykolwiek znalazłem, było rozpięcie wokół niego, nadanie mu klasy, a następnie zaimplementowanie CSS.

Oto, do czego są one dobre, moim zdaniem. Byłbym zainteresowany, aby usłyszeć więcej, a nawet poprawki na temat tego, co tu napisałem.

Answer 6

Różnica między tymi trzema (i wieloma innymi) znacznikami jest ich znaczeniem semantycznym. Standard HTML obejmuje zarówno znaczniki o określonych znaczeniach semantycznych (<p> dla akapitów, <em> dla podkreślonego tekstu, itp.) Oraz znaczniki bez znaczenia semantycznego.

Te ostatnie <div> i <span>, które są stosowane do identyfikacji blokowych lub wcięcia poziomu zawartości, który musi zostać zidentyfikowane (przy użyciu, np atrybut class= lub id=), lecz w których semantycznie specyficzny znacznik nie istnieją . Na przykład można napisać <p>Hi, my name is <span class="name">John Doe</span>.</p> - wskazując, że jest to akapit (który przeglądarka ma już pomysł na obsługę) i ta część jego treści jest nazwą (co oznacza absolutnie dla przeglądarki, chyba że używa jej CSS lub JavaScript).

te znaczniki są zatem niezwykle przydatna zarówno w dodanie dodatkowych informacji do dokumentu HTML, który nie mieści się w semantycznych znaczników dostarczonych przez standard (patrz the hCard specification za doskonały przykład) oraz stosowania wizualny (CSS) lub struktura funkcjonalna (JavaScript) do dokumentu bez zmiany jego semantyki.

Answer 7

Brzmi jak trzeba przeczytać HTML specification

The p element:

Element p reprezentuje akapit.

The div element:

Element div nie ma specjalnego znaczenia. Reprezentuje swoje dzieci. Może być używany z atrybutami class, i title do oznaczania semantyki wspólnej dla grupy kolejnych elementów.

The span element:

Element span nie oznacza niczego na własną rękę, ale może być przydatna, gdy stosowane razem z globalnych atrybutów, na przykładclass, lang lub dir. Reprezentuje swoje dzieci.

Główną różnicą pomiędzy div i span jest to, że odległość wynosi flow content, phrasing content i palpable content, natomiast strefa tylko flow content i palpable content.

Zasadniczo ten sprowadza się do:

div są elementami blokowe i zazwyczaj może być umieszczony tylko w innych elementów blokowych, przy czym span elementy elementy wbudowane, i mogą być umieszczone w większości innych pierwiastków .

The HTML spec defines which elements are acceptable as descendents of each element.