Hogyan készítsünk egy HTML webhelyet lépésről lépésre a Notepadban

Melyek a HTML-címkék és hogyan kell használni őket egy webhely létrehozásához?

Jó a nap folyamán, kedves barátaim és olvasóim a blogomról. Úgy nézem ki, hogy a vkontakte már az ország népességének részei új designt állítanak fel. Az egyik fiókom ezt alávetették. De tényleg, én, ellentétben más felhasználókkal, nem látok pánikot. Jól megváltozott, és megváltozott. Miért ne? különben is. Ez nem róla van. Készen áll arra, hogy továbblépje a webhelyet egy notebookban?

Már megtanulta, hogy a legegyszerűbb oldalt a notebook, megtanulták a fő címkéket, hogy jelen kell lennie. És ma szeretnék mondani többet Címkék létrehozni egy HTML weboldal mutatnak néhány nagyon fontos közülük, és mutat a munka egy élő példa.

Koncepció és cél

Tag Ez a HTML Hypertext jelölőnyelv kötelező eleme. Szüksége van ezeknek a jeleknek, hogy beszéljenek egy bizonyos tartalmat (például, ahogy kell, és hogyan kell viselkednie. Ezeknek a címkéknek köszönhetően több, kevesebb, nagyobb, nagyobb színváltozást végezhetünk, helyezze el a hátteret, hozzon létre egy linket, képeket, képeket, tekercs szöveget egy asztalra és még sok másra.

Címkék vannak gőz és egyetlen, de az egyetlen valójában nagyon kicsi (ma átadjuk az egyiket). Valamennyi pár címke az elv szerint érvényes: először a nyitó címkét, majd a tartalom jön, majd ragaszkodik, és a zárás csak úgy van kialakítva, mint a slash hozzáadásával (/). Ezután a belsejében lévő tartalom a csapattal összhangban változik, amit adott, például megváltoztatni a színt.

A gyakorlatban úgy néz ki

Tagcontent / címke

De a legfontosabb dolog, hogy kövesse a helyességet, mert ha elfelejtesz valamit vagy helytelenül, akkor nem fogod látni a várt eredményt. Például példát adok a helytelen kialakításra

Számos címkét alkalmazhatunk egy tartalomra, amely esetben a matrotory elvén kell használni:

(P) bekezdés

Kezdjük, valószínűleg egy bekezdéscímke van. Azt a latin levél betűje jelöli P (Bekezdés bekezdés), és ahogyan már értették, a sarokblokkokban fekszik. A legtöbb címke, ez egy pár, azaz a szöveget ezek az értékek keretezik. Mit kell? Igen, hogy elválasztja a szöveget a bekezdések szerint.

Írjunk meg néhány szöveget az elkészített dokumentumunkba, csak három különböző szöveget kötünk a bekezdésekben.

Tehát kapunk egy dokumentumot a bekezdésekre osztva. De ha emlékszel, az utolsó leckében nem tudtunk semmit tenni. Általában meg kell adnod.

Menjen egy új stringhez (BR)

Új bekezdésre tudunk menni, és mi van, ha ez a bekezdés nem szükséges számunkra? Mi van, ha egy vagy több átmenetet kell tennünk egy új karakterláncra? A címke segít nekünk ebben Br (Szünet). Kicsit különbözik az előzőektől, hogy egyedülálló, és nem pár. Nos, ez nem világos, az Enter billentyű analógjaként szolgál a szokásos szövegszerkesztőben. Bárhol van beállítva, ha el kell halasztanod a karakterláncot.

Minden egyes bekezdésben minden negyedik szó után egy átmenetet fogunk tenni, és két bekezdés lesz a második és a harmadik bekezdés között. És nézzük meg, mennyire megy le. Ki kell kapcsolnia valamit.

Szövegválasztás

Ismerjük meg magával is, hogy a zsíros és dőlt betűs szövegrészeket hozzanak létre. Két pár címke segít ebben:

• Erős / erős zsír
• Em / em dőlt

Most csak próbálja meg a szövegdarabokat különböző helyeken lekapcsolni ezekkel a címkével, mentse el a dokumentumot és frissítse a böngészőben (vagy futtassa újra).

Most vegye figyelembe, hogy az első bekezdés a zsírban kiemelte, és a dőlt betű második bekezdése. A harmadik bekezdés egyáltalán nem érintettünk, ezért változatlan maradt.

Fejlécek (H1-H6)

Azt hiszem, nem kell megmagyarázni, hogy mi a címsorok. De meg kell említeni, hogy HTML-ben 6 ilyen típusú címsor van. A legnagyobbat általában csak egyszer helyezzük el az oldalon, majd csökken a fészkelés mértéke. Például az első szintű fejléc több második szintű fejlécet tartalmazhat, és minden második szintű fejléc tartalmazhat a 3. szint több szintjét, és.D.

A címsorokat a következő pár címkék jelölik:

Próbálja meg másolni a címkék közötti dokumentumot Test és mentse a HTML formátumban, és látni fogja, hogy mi történt. És meg kell kapnia, mint az alábbi ábrán.

Élő példa

Tehát az új címkék egy része, amelyet tanulmányoztunk, és meg kell emészteniük a találkozót. Általában semmi sem bonyolult itt. Pihenés? Szép munka. Most menj tovább.

Képzeld el, hogy technikai feladata van az ügyféltől, hogy weboldalt készítsen az igényeihez. Töltse le innen. Csak ott írt szöveg, de szükségünk van egy weboldalra. Srácok, csak egy kérés:

Kezdetben próbálja meg mindent megtenni a feladaton. És ha nehézségek merülnek fel, akkor nézd meg, mit írtam az alábbiakban.

1. Nyissa meg a Notepad ++ parancsot, és írja elő az előző leckében (HTML, fej, cím, test).
2. Között Test és / Test Helyezzen be szöveget a technikai feladatból (csak a fejlécek és a vers). Azonnal mentse el ezt a dokumentumot HTML formátumban, és nézze meg, hogyan jelenik meg a böngészőjében. Nagyszerű, igen? 
3. A Lukomorye tölgy zöldségének fejlécét H1, és a vers Ruslan és Lyudmila keretezés H2.
4. A bekezdések által keretes négy sor P. Ne felejtsük el, hogy először nyitott címkét kell elhelyezned, és négy vonal zárva. Nos, azt hiszem, már megértetted.
5. Most minden sor után meg kell tenni Br, Ellenkező esetben a vonal átvitele, amelyet nem fog megtörténni, és mindent meg fognak ragadni egymásba. Csak ne tegye az utolsó sorba, ahol a bekezdés zárva van. Mivel utána / P Az automatikus sor átvitel egy térrel történik. 

Ez valójában minden cselekvési tervünk. Csak azt állítja, hogy látjuk, hogy a végén kiderült. Úgy tűnik, hogy minden helyes, és a technikai feladat minden feltételével. Hogy elfelejtettem csinálni ezt a tk-t? Kérjük, írjon a megjegyzésekben.

Nézze meg, hogyan változott mindent a kezdeti opcióhoz képest, köszönhetően a címkékkel. A következő cikkekben fogjuk érinteni munka egyéb elemeivel jelölés, de egyébként azt tanácsolom, ha felkeresi a HAB oldalon, hiszen mindig lehet látni a tippeket ebben az esetben: mit, hol és hogyan tegye, amit kölcsönhatásba lép a böngészőknek megfelelő és T.D.

És persze, ha már nem várja meg, hogy elsajátítsák a nyelvet Hypertext Markup, akkor biztos, hogy a tanfolyam „HTML5 és CSS3 a semmiből, hogy a pro”. A kurzus kiváló, és minden rendben van, és részletesen leírja, hogyan kell három különböző típusú webhelyet ülni. Jelenleg tanulmányozom őt, és tanácsot adok neked. A teljes kezdőknek számos bónusz tanfolyama van a HTML és a CSS-en.

Nos, hadd mondjam el. Várja meg a következő óráimat, ahol továbbra is meghódítjuk a helyszíni épületek csúcsát (hangosan mondta). És ne hagyj ki semmit, azt javaslom, hogy feliratkozom a blog frissítésére. Általában köszönöm a figyelmet. Sok szerencsét. Viszlát!

Tisztelettel, Dmitry Kostin