Kako naučiti HTML (sa ilustracijama) -

HTML je smanjenje engleskog jezika Hyper Text Markup jezik (Hypertekxt označavajući jezik). Ovaj kôd ili jezik na kojem se stvara osnovno označavanje web lokacija. Ako se nikad ne programirate, učenje može izgledati teško, ali u stvari sve što trebate započeti učenje je najjednostavniji uređivač teksta i internet pretraživač. Možete čak i naučiti neke primjere HTML markira koji su naišli na tebi na mrežnim forumima, prilagođenim prilagođenim stranicama ili u članovima. HTML - korisno sredstvo za bilo koji korisnički internet i proučavanje njegovih baza trebat će manje vremena nego što mislite.

Korake

Dio 1 od 2:

Proučavanje temelja HTML-a

jedan. Otvorite HTML dokument. Većina urednika teksta (bilježnica ili notepad ++ za Windows, TexteDit za Mac, Gedit za GNU / Linux) može se koristiti za kreiranje HTML datoteka. Kreirajte novi dokument i sačuvajte ga pomoću datoteke → Spremite oba u format web stranice ili promijeniti ekstenziju datoteke na .Html ili .Htm umjesto toga .Doc, .RTF ili drugo širenje.

Može se pojaviti upozorenje da će se datoteka biti spremljena kao "jednostavan tekst" umjesto RTF formata ili da se formatiranje i slika neće biti spremljena. To je normalno - za HTML ove opcije nisu potrebne.

2. Otvorite kreiranu datoteku u pretraživaču. Spremite praznu datoteku, pronađite ga na svom računalu i otvorite dvostruki klik miša. U pretraživaču bi se trebala otvoriti prazna stranica. Ako se to dogodi, povucite datoteku na adresnu traku preglednika. U procesu uređivanja HTML datoteke možete ažurirati ovu stranicu za prikaz promjena.

Imajte na umu da na ovaj način ne stvarate web stranicu na Internetu. Drugi ljudi nemaju pristup ovoj stranici, a ne treba vam internetska veza za testiranje lokalne stranice. Preglednik jednostavno tumači HTML kod ", čitanje", kao da je ovo web stranica.

3. Shvatite koje su oznake označavanja. Za razliku od običnog teksta, oznake se ne prikazuju na stranici. Umjesto toga, oni ukazuju na pretraživač, kako prikazati stranicu i njegov sadržaj. Oznaka "Otvaranje" sadrži upute. Na primjer, može obavijestiti pregledač da tekst treba prikazati kao odvažan. Također je potrebna i "zatvaranje" oznaka koja prikazuje pretraživač, gdje se pouči završava. U ovom primjeru tekst između otvaranja i zatvaranja prikazat će se podebljanim podebljanim. Oznake se bilježe unutar znakova nejednakosti, ali zatvaranje za zatvaranje počinje sa nagibom.

Otvaranje oznake bilježi se između znakova nejednakosti: <Otvaranje oznake>

U završnoj oznaci prije deskriptora (naslov), oznaka je izvršena oblikovanom značajkom: Zatvaranje>

Pročitajte da biste saznali o korištenju različitih oznaka. Za ovaj korak je dovoljno da se setite formata snimanja. Oznake se bilježe između znakova nejednakosti: < > i

U nekim tutorijalima, HTML označava elemente poziva, a tekst između oznaka otvaranja i zatvaranja naziva se sadržaj elementa.

4. Pozovite u oznaci urednika . Svaka HTML datoteka mora započeti s oznakom I završiti s oznakom . Ove oznake ukazuju na preglednik da su svi sadržaji između oznaka napisani u HTML-u. Dodajte ove oznake u svoj dokument:

Često HTML datoteke počinju od niza , što znači da preglednici moraju prepoznati cijeli datoteku Ashtml. Međutim, ova linija nije neophodna, može pomoći u rješavanju problema sa kompatibilnošću.

Biranje Na vrhu dokumenta.

Pritisnite ENTER ili Vratite nekoliko puta da biste stvorili više praznih žica, a zatim upišite

zapamtite da sve Kod koji ćete stvoriti slijedeći ovaj članak morat će pisati između ove dvije oznake.

pet. Kreirajte odjeljak u datoteci . Između oznaka i Napravite otvor oznaku i zatvaranje oznake . Dodajte nekoliko praznih linija između njih. Sadržaj zabilježen između oznaka i , Nije prikazano na samoj stranici. Slijedite ove korake i vidjet ćete šta je potrebna ova oznaka:

Između oznaka i Pisati i

Između oznaka i Pisati Kako naučiti HTML - .

Spremite promjene i otvorite datoteku u pretraživaču (ili ažurirajte stranicu ako je datoteka već otvorena). Pogledajte tekst koji se pojavljuje u naslovu stranice iznad niza adrese?

6. Kreirajte odjeljak . Sve ostale oznake i tekst u ovom primjeru evidentiraju se u odjeljku tijela, čiji sadržaj prikazuje na stranici. Poslije Zatvarajuća oznaka, ali prije TEGGING TAG TAG i . Do kraja ovog članka, radite s odjeljkom tijela. Vaša datoteka bi trebala izgledati ovako:



Kako naučiti HTML -

7. Dodajte tekst pomoću različitih stilova. Vrijeme je za dodavanje sadašnje stranice sadržaja! Sve što pišete između oznaka tijela bit će prikazano na stranici nakon ažuriranja u pretraživaču. Ne koristite Simboli < ili >, Budući da će pretraživač pokušati tumačiti sadržaj kao oznaku umjesto teksta. Pisati zdravo! (ili šta god želite), a zatim pokušajte dodavati ove oznake u tekst i vidjeti šta se događa:

zdravo! Označite tekst "Italic": zdravo!

zdravo! Označite tekst "odvažan": zdravo!

zdravo! Tekst olog: ~~zdravo!~~

Prikazuje font kao gornji indeks:

_zdravo! Prikazuje font u obliku donjeg indeksa: _zdravo!

Isprobajte različite oznake zajedno. Kako će izgledati zdravo!?

osam. Podijelite tekst na odlomke. Ako pokušate napisati nekoliko redaka teksta u HTML datoteci, primijetite da se u pregledniku ne prikazuju da se prekide redovi. Da biste podijelili tekst na paragrafe, morate dodati oznake:

Ovo je poseban odlomak.

Nakon te rečenice treba biti jaz red 
 Prije početka ove linije.

Ovo je prva oznaka koja ne zahtijeva zatvaranje oznake. Takve oznake se nazivaju "prazno".

Kreirajte naslove za prikaz imena particija:
Zaglavlje teksta: Najveći zaglavlje
Zaglavlje teksta (zaglavlje drugog nivoa)
Zaglavlje teksta (zaglavlje treće razine)
Zaglavlje teksta (Četvrto zaglavlje)
Zaglavlje teksta (najmanja zaglavlje)

devet. Naučite kreirati liste. Postoji nekoliko načina za stvaranje lista na web stranici. Isprobajte sljedeće opcije i odlučite što vam se najviše sviđa. Imajte na umu da je za popis potreban jedan par oznaka u cjelini (na primjer

i Za izrađeni popis), a svaki element liste označava se drugi par oznaka, na primjer

Označena lista:

Prva linija
Drugi niz
Itd

Numerirana lista:

Jedan

Dvoje

Tri

Lista definicija:

Kafa
- vruće piće
Limunada
- Hladno piće

Slika pod nazivom Saznajte HTML korak 10

10. Napravite stranicu koristeći RASP redova, horizontalne linije i Slike. Vrijeme je da dodate nešto osim teksta na stranicu. Isprobajte sljedeće oznake ili slijedite veze da biste dobili više informacija. Upotrijebite internet hosting za kreiranje veze do slike koju želite postaviti:

Vodoravna linija:

Umetnite sliku:

Slika pod nazivom Saznajte HTML korak 11

jedanaest. Dodajte veze. Možete koristiti ove oznake za kreiranje hiperveza na druge stranice i web stranice, ali s obzirom da još nemate web stranicu, sada ćete naučiti kako stvoriti "sidro", odnosno veze na određena mjesta na stranici:

Stvorite oznaku sidra Na mjestu stranice na koju želite pogledati. Dođite sa razumljivim i nezaboravnim imenom:

Tekst na koji se odnosite.

Koristite oznaku , Da biste stvorili relativnu vezu ili referencu na vanjski resurs:

Tekst ili slika koja će poslužiti kao veza.

Da biste se uputili na relativnu vezu druge stranice, dodajte znak # nakon glavne veze i ime sidra. Na primjer, https: // bos.panoutx.info / LUCINE-HTML # SAVETI Odnosi se na odjeljak vrhova ove stranice.

2. dio 2:

Napredni HTML nivo

jedan. Upoznati se sa atributima. Atributi se bilježe unutar oznake, što ukazuje na dodatne informacije. Format atributa Takav: Ime ="smisao", gde naslov određuje atribut (na primjer, Boja Za atribut u boji), a vrijednost ukazuje na njegovu vrijednost (na primjer, crvena za crveno).

Atributi su zapravo korišteni u prethodnom dijelu temelja HTML-a. Označiti Koristi atribut Src, Sidra relativnih veza koriste atribut Ime, I veze koriste atribut href. Kao što ste već primijetili, svi atributi su napisani u formatu ___ ="___".

Slika pod nazivom Saznajte HTML korak 13

2. Eksperimentirajte sa HTML tablicama. Stvaranje tablice uključuje upotrebu različitih oznaka. Možete eksperimentirati ili Pročitajte detaljnije upute.

Kreirajte tabele tabele:

Sadržaj svakog reda tablice ulazi u oznake:

Zaglavlje stupca određuje se oznakom:

Ćelije u narednim linijama:

Primjer upotrebe ovih oznaka:

Stupac 1: mjesec Stupac 2: Ušteda
Januar 5000 rubalja

Stupac 1: mjesec	Stupac 2: Ušteda
Januar	5000 rubalja

Slika pod nazivom Saznajte HTML korak 14

3. Naučite dodatne oznake odjeljka za glavu. Već ste naučili oznaku , Ide na početak svake HTML datoteke. Pored oznake , Postoje i druge oznake za ovaj odjeljak:

Meta Tags, u kojem su sadržane Metapodaci, koristi od strane pretraživača za indeksaciju web lokacije. Da biste svoju web stranicu olakšali u pretraživačima, koristite jednu ili više oznaka za otkrivanje (Završne oznake nisu potrebne). Koristite jedan atribut i vrijednost na oznaci: - ili

Oznake , Vodeći na datotekama treće strane, na primer, na stilu (CSS) koji se kreiraju pomoću druge vrste kodiranja i omogućuju vam da promijenite HTML stranicu koristeći uzor u boji, i mnogim drugim funkcijama.

Oznake

Slika pod nazivom Saznajte HTML korak 15

4. Eksperimentirajte sa HTML kodom drugih web lokacija. Odličan način istraživanja HTML-a bit će pregledati izvorni kod drugih web stranica. Možete desnom tipkom miša kliknuti na stranicu i odaberite "Pogledajte izvorni kod" ili nešto slično u gornjem izborniku pregledača. Pokušajte odrediti koja postaje nepoznata oznaka ili potražite informacije o tome na Internetu.

Iako ne možete uređivati stranice drugih ljudi, izvorni kôd možete kopirati u svoju datoteku da biste kasnije eksperimentirali sa oznakama. Imajte na umu da CSS oznaka možda nije dostupna, a boja i oblikovanje mogu izgledati drugačije.

Slika pod nazivom Saznajte HTML korak 16

pet. Proučite detaljnije vodiče. Na Internetu su na primjer mnogo web lokacija posvećenih HTML oznakama W3SChools ili Htmlbook. U prodaji su knjige papira, ali pokušajte pronaći trenutnu publikaciju, jer se standardi mijenjaju i razvijaju. Još je bolje savladati CSS za kontrolu oznake i izgledu stranice. Nakon proučavanja CSS-ovih web dezanja obično uče jаvascript.

Savjeti

Notepad ++ - odličan besplatni program sličan redovnom prijenosniku, ali možete spremiti i testirati svoj kôd u pretraživač na mreži. (Takođe podržava gotovo bilo koji jezik - HTML, CSS, Python, jаvascript i tako dalje).
Pronađite neku jednostavnu stranicu na mreži, sačuvajte kôd na računar i eksperimentirajte s njim. Pokušajte premjestiti tekst, promijenite font, zamijenite slike - bilo šta!
Možete započeti bilježnicu na kojoj ćete snimiti oznake da biste ih uvijek imali pri ruci. Takođe možete ispisati ovu stranicu i ukusiti ga.
Kada pišete kod, radite to pažljivo, tako da ste vi i drugi ljudi mogli razumjeti. Korištenje komentara u HTML-u: Neće se odraziti na stranici, ali bit će vidljivi u dokumentu dokumenta.
XML I RSS Dobivanje sve popularnije. Kod stranice koji sadrži XML i RSS tehnologije, neiskusno korisniku teže čitati i razumjeti, ali ovi alati su vrlo korisni.
HTML oznake za označavanje ne ovise o registru, ali preporučuje se upotreba samo malim slovima (kao u primjerima u ovom članku) - i za standardizacijske svrhe i za kompatibilnost s XHTML-om.

Upozorenja

Neke oznake u posljednjih nekoliko godina izašli su iz svakodnevnog života i zamijenjene su novim, dajući istim ili nekim dodatnim efektima.
Ako želite provjeriti svoju stranicu, idite na web stranicu W3 i saznajte moderne HTML zahtjeve. HTML se standardi mijenjaju s vremenom i zamijeniti neke oznake dolaze nove, koje bolje rade u modernim pretraživačima.

Sta ti treba

Uređivač teksta, kao što su Notepad (Windows) ili TexteDit (MAC)
Papir / Notepad (nije potrebno)
HTML Editor, kao što je Notepad ++ (Windows) ili TextWrangler (MAC) (nije potrebno)