HTML oldal létrehozása: lépésenkénti utasítások, technológia és ajánlások
Gondolod, hogyan hozhat létre HTML oldalt? Ehhez néhány órát kell eltöltened, és ismered a HTML alapjait. És elkészítheti első oldalát 5 perc alatt.
A HTML jelentése a HyperText Markup Language. A fordításban ez a "hiperszöveges jelölőnyelv". Fontos megérteni, hogy a HTML nem programozási nyelv, hanem weboldal jelölés.
Minden modern böngésző felismerheti. Ezután az információkat a felhasználó számára kényelmesen megjelenítik, ahogy azt korábban a szerző tervezte.
Ezen a nyelven speciális címkéket használnak. Minden címke elvégzi a funkcióját. Sokan vannak. Ideális esetben mindent meg kell tanulnod. De egy kezdő alapismeret elég.
HTML alapok
Mielőtt létrehozna egy HTML oldalt, meg kell tudnia, hogy mit készített. Ezen a nyelven két fogalom létezik: egy elem és egy címke.
Annak megadásához, hogy hol kezdődik és zár be ez az elem, használja a nyitó és záró címkét. Úgy néz ki.
<nyitó címke> tartalom </ closing tag>
Amint látja, a nyitó és záró címkék csak "/" -ban különböznek.
Az egész HTML dokumentum ezek gyűjteményeelemekkel. A dokumentum szerkezetére vonatkozóan vannak bizonyos követelmények. Az oldal összes tartalmának két <html> és </ html> címke között kell lennie. Amikor megírja a kódot, hagyja abba a szokást, hogy azonnal állítsa be a nyitó és záró címkét.
Ne felejtsük el, hogy a HTML nyelv szerkezete saját hierarchiájával rendelkezik. Egyébként fészekelésnek nevezik. A HTML-címke a legfontosabb, mert mindenki más benne van.
A HTML két gyermek:
- <fej> ... </ head>;
- <test> .. </ body>.
A HEAD blokk különböző szolgáltatási információkat jelez. Ez az információ nem jelenik meg a böngészőben. Például útmutatók a fejlesztőknek, minden programnak, robotoknak és még sok másnak.
A legfontosabb, hogy itt nincs tartalom.
A BODY rész a dokumentum tartalmát jelzi a felhasználó számára.
Tanulja meg a címkék megnyitását és bezárását egyszerre, mert 10 beágyazott elem lehet. Ezenkívül a kényelem érdekében javasoljuk, hogy a beágyazott címkék legyenek behúzva. Például, mint ez.
<Html>
<Head>
</ head>
<Body>
</ body>
</ html>
Tehát az egyenlő fontosságú címkék isegy szinten, és a gyerekek - "belül". Tehát sokkal kényelmesebb a felismeréshez és a kód szükséges darabjának megkereséséhez. Ellenkező esetben zavarodhat. De a hely, a fej és a test címkék megtakarítása nélkül végezhető el. Ez azért történik, hogy mindenki másnak ne legyen felesleges bemélyítése. Minden más kívánatos, hogy elkülönüljön.
Hogyan hozzunk létre egy egyszerű HTML oldalt
A kód megírásához szükség van valamilyen szerkesztőre. Sokan vannak. A Notepad ++ és az Adobe Dreamweaver népszerűek. Használhat notebookot is.
Így néz ki a Notepad ++ szerkesztő.
Ez egy nagyon hasznos szerkesztő és ingyenes. A fenti Adobe Dreamweaver díjköteles. A notebookok HTML kódolására szánt szerkesztők közötti különbség az, hogy a speciális címkéket kiemelik. Ha nincs kiemelve, akkor azt jelenti, hogy helytelenül írtál.
Annak érdekében, hogy a háttérvilágítás megfeleljen a nyelvnek, meg kell adnia a beállításokat.
Nézzük meg, hogyan hozzunk létre egy HTML oldalt a Jegyzettömbben. Ez azt jelenti, hogy befejeztük a technikai részt, majd közvetlenül a címkék vizsgálatához.
Hogyan hozzunk létre egy weboldalt a notepad HTML-ben?
Először nyissa meg a jegyzettömböt.
Ezután írja be azt, ami a következő képernyőképen látható.
Gyakorolj a kézírással, nem csak a másolással. Ha kézzel írsz, akkor jobban emlékezzetek a teljes címke adatbázisra.
Ezután kattintson a "Fájl mentése" menüre, és adja meg a fájlnevet, de a .html kiterjesztéssel.
Ezután megnyithatja a fájlt a böngészőben, és megcsodálhatja az eredményt. Most érdemes megértenünk, hogyan hozzunk létre egy weblapot a notepad HTML-ben.
World Consortium W3C
Van olyan szervezet, mint a W3C, amelyfejleszti és végrehajtja az internet minden szabványát. Minden böngésző megfelel ezeknek a szabványoknak és a feldolgozási oldal elrendezéseknek (kódok) e szabályok szerint.
A HTML-fejlesztők hivatalos oldalán megtalálható a táblázatban szereplő összes címke és szabály. E cikk keretében a legalapvetőbbnek tartjuk.
Gondolod, milyen szabályok létezhetnek? Minden leírt címke saját ajánlással rendelkezik. Számos közülük:
- Választható címke.
- Tiltott.
- Üres címke.
- idejétmúlt
- Az elveszett.
Címkék a HTML-ben
Mielőtt létrehozna egy HTML oldalt, meg kell értenie, hogy mi legyen a HEAD szolgáltatási részében.
A HEAD területen mind kötelező, mind pedigopcionális címkék. A kötelező címke egy címsor. Ezt a <title> Title </ title> jelzi. Ez az egész dokumentumhoz van hozzárendelve. És amit látsz az eredmények között a Google keresőben, a címcímke.
Menjünk tovább a BODY részhez. Vannak olyan elemek, amelyek megjelenik a böngészőben, és vannak olyan nem megjelenített is. Például a megjegyzések nem jelennek meg a felhasználónak. Jegyzetekhez vagy más alkalmazottakhoz való utalás esetén, ha csapatban dolgozik.
A következőket jelölik: <! - Comment ->
Minden ami <között van!- és ->, a program így értékeli. Ne feledje, hogy egy megjegyzéscímkét nem csatolhat egy másik megjegyzéscímkéhez. Mivel a <! -> megnyitásakor nem fog megjelenni mindaz, ami folytatódik. Az információ nem lesz látható, amíg a kezelő nem látja a zárócímkét ->.
Példa erre a fészkelésre:
<! - első megjegyzés <! - második megjegyzés -> az első megjegyzés folytatása ->
Az eredmény a böngészőben a következő lesz
folytatása az első megjegyzés ->
És itt van egy darab <! - első megjegyzés <! - második megjegyzés -> nem lesz látható. A második <! - tag megnyitását figyelmen kívül hagytuk, és egyszerű szövegként kezeltük.
A szövegben szereplő fejlécek
A cím nem csak a címsorban található HEAD részben jelenik meg. Ebben az összefüggésben feltétlenül meg kell jelölni a címet. Mert csak a felhasználó fogja látni.
A fejlécek különböző szinteken érkeznek. Ez hierarchiát hoz létre a szövegben. Megegyezik a könyvek kötetek, fejezetek, bekezdésekkel.
Csak 6 szint van. A legfontosabb fejlécet a <h1> Fejléc </ h1> jelzi. Az oldal előrehaladása tekintetében a h1 és a címcímkék szövegének meg kell egyeznie. Ráadásul a h1 esztétikai szempontból csak egy lehet. De ez nem jelenti azt, hogy a böngésző nem fog feldolgozni az ezt követő h1-et. Megtehető, amennyit csak akar, de ez nem kívánatos.
A feliratokhoz használja a h2 - h6 címkéket. Ezek az úgynevezett első, második, harmadik, negyedik, ötödik és hatodik szintek címe. Ez az információk fészkelését és a kategóriák szerinti felosztást eredményezi.
Úgy néz ki, mint ez.
bekezdés
A kód fő szövegét a <p> címkében kell formázni.. </ p>. A "bekezdés" szóból származik. Mindegyik bekezdést egy <p> címkével kell formázni, és nem minden egy kupacban. A normál sortörés nem fog feldolgozni. Minden megjelenik egy sorban. A kötőjelekhez használnia kell a <br> címkét.
Vegye figyelembe, hogy a költöztetés címkéje nincs lezárva. Egyedülálló.
Tekintsük a költészet példáját.
Különböző címkék, a "név" mellett, vannak éssaját attribútuma. Például egy bekezdéscímke egy "alignment" attribútummal rendelkezik, amelyet igazítással jelölünk. Az értéket balra, jobbra, középre teheti. Vagyis illessze a bal vagy a jobb oldali szélét vagy a közepét.
Linkek használata
Valószínűleg már gondolkodott: de hogyan lehet létrehozni egy linket tartalmazó HTML oldalt? Ebben nincs semmi bonyolult. Egy HTML oldalra mutató hivatkozások létrehozása egyszerű. Ehhez speciális <a> címke van. Saját szükséges tulajdonságokkal rendelkezik. A helyes link így néz ki:
<a href="adkey"> link szöveg </a>
Ha nem adja meg a címet és a szöveget, akkor ez a hivatkozás haszontalan vagy láthatatlan a felhasználó számára.
következtetés
Olyan sok címke létezik, és mindegyik rendelkezik saját tulajdonságokkal. Miután elolvasta ezt az információt, meg kellett értened, hogyan hozhat létre HTML weboldalt.
Annak érdekében, hogy bővítsem tudásomat ebbenrégióban további irodalmat kell olvasnod és fel kell használnod a hivatalos HTML címkék könyvtárat, amely a W3C weboldalán található. Ha nem használja a nyelvtanárok rendszeresen frissített könyvtárát, akkor nehéz lesz szakembergé válni ezen a területen.
</ p>
