Különbség a DIV és a SPAN között

és HTML-címkék, amelyek meghatározzák az elemeket a HTML-kódban.

HTML (Hypertext Markup Language) egy strukturált kód, amelyet az online, minden nap látogatott weboldalak készítéséhez és megjelenítéséhez használunk bármilyen eszközön.

Más technológiák és programozási nyelvek integrálhatók a HTML-be, hogy dinamikus és fejlett funkciókat biztosítsanak a webhelyen.

A HTML megértése

Hipertext jelölőnyelv (HTML) egy széles körben használt jelölőnyelv, és egy web böngészőben megjelenített weboldal „mögött” lévő struktúrájára és kódjára utal..

A HTML egy olyan szövegfájl, amely speciális kódot (szintaxist) használ az oldal stílusának, tartalmának, elrendezésének és formátumának meghatározására. Az haszonkulcs A kifejezés azt jelzi, hogy a szöveg / kód feldolgozásra és bemutatásra készül, azaz egy weboldalon, egy böngészőben.

A World Wide Web Consortium (W3C) [i] felismeri a HTML formális jelölőnyelvként a weblapok fejlesztésében, ezért a legtöbb böngésző támogatja a HTML-t. Tehát a weboldalakat elismert nyelven lehet kifejleszteni, a különböző böngészők által könnyen értelmezhetőek, hogy az oldalt a tervező szándéka szerint megjelenítsék..

A jelenlegi változatban még mindig használt HTML4, de lassan megszűnik, mivel a HTML5 nagyobb támogatást és elfogadást kap a dinamikus és rugalmas weboldalak számára..

A reagálás az internetes fejlesztés alapvető elemévé válik, hogy könnyebb, dinamikusabb felhasználói élményt nyújtson, amelyet több eszközön, például okostelefonokon, táblagépeken és laptopokon kell alkalmazni..

Lépcsőzetes stíluslapok (CSS) a dinamikus és érzékeny oldalak építésének szerves részévé válik. Ez egy külön fájl, amely minden elem attribútumait meghatározza, például betűtípust, színt, igazítást - tehát a fejlesztő nem adja meg az elem stílusát minden alkalommal, amikor azt a HTML-kódban használja..

A HTML alapvető felépítése

Annak érdekében, hogy a fejlesztési nyelvből a legtöbbet hozza ki, a szabványos fájlszerkezet betartása és a legjobb szintaxishasználat figyelembevétele kulcsfontosságú a stabil, céltudatos és vizuálisan vonzó webtartalom biztosításában..

A HTML oldal struktúráját elemek határozzák meg (címkéknek is nevezik). A HTML-kód írásakor ezek az elemek párban vannak feltüntetve - azaz minden címkének nyitásra és bezárásra van szükség. Kezdet és vége.

Egy elem megnyílik a szintaxissal: és lezárva.  Az / ferde vonal jelzi az elem meghatározásának végét.

Az elem attribútumait és tartalmát e két pont között határozzuk meg.

Az minimális elemek A HTML fájlhoz szükségesek a meghatározás,, (csak HTML4) és címkék.

  • DOCTYPE meghatározás

A Definíciót (DTD) először deklarálni kell egy HTML fájl első címkéjének, tehát az oldal feldolgozásakor a böngésző tudja, hogy milyen típusú fájl van, ezért helyesen tudja értelmezni és megjeleníteni az oldalt..

A HTML4-ben vannak a DTD variációi (az oldal attribútumaitól és elemeitől függően), de a tipikusabb állításokat a következőképpen foglalják bele:

vagy

A DTD a HTML5-ben sokkal egyszerűbb:

· HTML, fej és test

  • A címke azt jelzi, hogy egy HTML fájl, és ez a HTML elem gyökere, amely tartalmazza az összes többi, benne meghatározott további elemet; bevált gyakorlatként javasoljuk a nyelvi tulajdonság felvételét; például:
  • A HTML4-ben kötelező, de a HTML5-ben nem kötelező. Ez egy olyan elem, amely más, a dokumentumrészhez kapcsolódó elemeket tartalmaz, például a címet, a hivatkozási szkripteket, a stílusokat és a metaadatokat. A zárt címkét fel kell használni a 
  • Az elem tartalmazza az oldal fő tartalmát, beleértve a táblázatokat, a képek szövegét, a listákat stb. Miután a címkét bezárták, az elem most véget érhet. Az új HTML5 elem használata az oldal vagy a tartalom egy másik része választható.

HTML elemek

A HTML5 új elemeket hozott létre a fejlesztés és a tervezés megkönnyítése érdekében, és eltávolította a HTML4-ben használt elemeket is. A HTML4 és a HTML5 közötti különbségek listáját a World Wide Web Consortium (W3C) teszi közzé [ii].

HTML DIV TAG

A fejlesztésekkel és az új elemekkel, valamint a CSS fejlesztéseivel egyes elemeket korábban eltérő, jobb módokon lehet felhasználni, és a weboldalak gyorsabbak, funkciógazdagabbak és gyönyörűbbek! a CSS-sel, a HTML5-rel használva helyettesíthetők bizonyos elemek, amelyeket túlzottan használtak, például .

A címke népszerű az oldal tartalmának szétválasztásakor. Az elem létrehozásakor automatikusan beszúr egy szünetet
a szöveg vagy a tartalom együttes megőrzése, ahelyett, hogy az szöveget az oldalon átneveznék.

A weboldal hozzáférhetőségével és a keresőmotor optimalizálásával a technikák meglehetősen tudományossá válnak, és a WC3 azt ajánlja, hogy ne térjenek vissza a HTML5 használatához.

Példaként egy szépen felépített, de egyszerű blogformátumra vegye fontolóra az új HTML5 elemeket a CSS-sel, az elem használata helyett; használja az elemet a fő tartalomhoz, az elemet az oldal, a fejléc vagy a lábléc bármely tartalmának kiemeléséhez vagy elkülönítéséhez (bárhol!), és az elem segítségével menüt vagy csoport linkeket tarthat az oldal böngészéséhez..

Ezek az új elemek a HTML5 segítségével könnyen azonosítják a tartalom típusát. A címkét azonban a CSS-rel is használják rugalmas webhelyek létrehozására.

Az egyes elemek létrehozásakor (saját azonosítójával vagy osztályával) a CSS fájl meghatározható az egyes elemek manipulálására.

Az alábbi HTML példa több elem használatának példáját mutatja be:

Példáim

Az elemeknek különböző attribútumaik lehetnek, különösképpen a reagáló interakciók méretétől függően, a használt eszköz képernyő méretétől függően.

Itt található egy példa arra, hogyan lehet az egyes elemeket stilizálni a HTML megfelelő CSS fájljában - hivatkozással az egyes címkékre.

#Fejléc

szélesség: 800px;

magasság: auto

margin-left: auto;

margin-left: auto;

#Featured

magasság: 150px;

Background-color: #CCC;

HTML SPAN TAG

Az elem egy beépített elem, és csak a törés kivételével vonalra szakad meg
a címkét használják, és a megnyitott és bezárott címkék közötti meghatározott szöveg (tartalom) sorként jelenik meg (alapértelmezés szerint más elemek használata nélkül).

Az inline elemek szöveges elemek a HTML fájlban, és meghatározhatók egy másik elem sorában.

Mint az elemnek nincs jelentés az optimális referenciaképesség érdekében. Alapvetően megmutatja az elem tartalmát, de az összes példány meghatározható a CSS-ben a stílushoz, ha helyesen címkézik, más attribútumokkal gazdagítják, vagy JavaScripttal manipulálják..

Az alábbi példában a kék szöveg kiemeli, hogy a span elem miként lehet beágyazott elemként eltérő tulajdonságokkal rendelkezik, mint a szülő elem - p> bekezdés:

A példa megnyitásához kattintson az oldal alján található ikonra.

Ha egy böngészőben tekintik meg, akkor a fenti elem szövege a bekezdéstől eltérő betűtípussal jelenik meg, hangsúlyozva, hogy a felhasználónak a példa eléréséhez kattintson rá..

Megjegyzés: nincs különbség a HTML4 és a HTML5 között.