HTML Essentials Cheat Sheet: oznake, atributi in več

Gradnja spletnih strani se začne s HTML. Polepšati jih in narediti interaktivne pride kasneje. Toda če želite začeti ustvarjati funkcionalna statična spletna mesta, potrebujete razumevanje HTML. (Želite hiter uvod v ta označevalni jezik? Preberite naše HTML FAQ.)

Kot del učenja jezika obstaja dolg seznam elementov, ki jih morate dodati v svoj besednjak HTML. In ta naloga se lahko sprva zdi zastrašujoča, zato smo pripravili naslednjo varalko. Omogoča vam enostaven način za odkrivanje/razumevanje/priklic elementov HTML, kadar koli jih potrebujete.

Varovalni list zajema oznake in atribute za strukturiranje spletnih strani, oblikovanje besedila, dodajanje obrazcev, slik, seznamov, povezav in tabel. Vključuje tudi oznake, ki so bile uvedene v kodah HTML5 in HTML za pogosto uporabljene posebne znake.

BREZPLAČEN PRENOS: Ta varovalka je na voljo kot prenosljiv PDF od našega distribucijskega partnerja, TradePub. Za prvi dostop do njega boste morali izpolniti kratek obrazec. Prenesi HTML Essentials Cheat Sheet.

HTML Essentials Cheat Sheet

... ... ... ... ...

...

Bližnjica	Ukrep
Osnovne oznake
...	Prva in zadnja oznaka dokumenta HTML. Vse druge oznake ležijo med temi zapiralnimi in končnimi oznakami.
...	Določa zbirko metapodatkov za dokument.
	Opisuje naslov strani in se prikaže v naslovni vrstici brskalnika.
...	Vključuje vso vsebino, ki bo prikazana na spletni strani.
Informacije o dokumentu
Omenja osnovni URL in vse relativne povezave do dokumenta.
Za dodatne informacije o strani, kot so avtor, datum objave itd.
Povezave do zunanjih elementov, kot so slogovne tabele.
	Vsebuje informacije o slogu dokumenta, kot je CSS (kaskadne liste slogov).
	Vsebuje povezave do zunanjih skriptov.
Oblikovanje besedila
... ALI ...	Besedilo naredi krepko.
...	Ležeče besedilo in ga naredi krepko.
...	Besedilo je ležeče, vendar ne krepko.
...	Prečrtano besedilo.
...	Citira avtorja citata.
...	Označi izbrisani del besedila.
...	Prikaže razdelek, ki je bil vstavljen v vsebino.
...	Za prikaz ponudb. Pogosto se uporablja z oznaka.
...	Za krajše ponudbe.
...	Za okrajšave in polne oblike.
...	Določa kontaktne podatke.
...	Za definicije.
...	Za odrezke kode.
...	Za pisanje podpisov
...	Za pisanje nadpisov.
...	Za zmanjšanje velikosti besedila in označevanje odvečnih informacij v HTML5.
Struktura dokumenta
...	Različne ravni naslovov. H1 je največji, H6 pa najmanjši.
...	Za razdelitev vsebine na bloke.
...	Vključuje vgrajene elemente, kot so slika, ikona, čustveni simbol, ne da bi pokvarili oblikovanje strani.
...	Vsebuje golo besedilo.
	Ustvari novo vrstico.
	Nariše vodoravno vrstico, da prikaže konec odseka.
Seznami
...	Za naročen seznam artiklov.
...	Za neurejen seznam artiklov.
...	Za posamezne postavke na seznamu.
...	Seznam predmetov z definicijami.
...	Opredelitev enega samega izraza v skladu z vsebino telesa.
...	Opis za definirani izraz.
Povezave
...	Sidrna oznaka za hiperpovezave.
...	Oznaka za povezavo do e-poštnih naslovov.
...	Sidrna oznaka za seznam kontaktnih številk.
...	Sidrna oznaka za povezavo do drugega dela iste strani.
...	Pomika se do razdelka div na spletni strani. (Različica zgornje oznake)
Slike
	Za prikaz slikovnih datotek.
Atributi za oznaka
src=”url”	Povezava do izvorne poti slike.
alt=”besedilo”	Besedilo, ki se prikaže, ko miško premaknete nad sliko.
višina=” ”	Višina slike v slikovnih pikah ali odstotkih.
širina=” ”	Širina slike v slikovnih pikah ali odstotkih.
poravnaj=” ”	Relativna poravnava slike na strani.
meja=” ”	Debelina roba slike.
	Povezava do zemljevida, ki ga je mogoče klikniti.
	Ime slike zemljevida.
Območje slike slikovnega zemljevida.
Atributi za oznaka
oblika=""	Oblika območja slike.
koordinate=” ”	Koordinate območja slike zemljevida.
Obrazci
...	Nadrejena oznaka za obrazec HTML.
Atributi za oznaka
action=”url”	URL, kamor so poslani podatki obrazca.
metoda=” ”	Določa protokol za oddajo obrazca (POST ali GET).
enctype=” ”	Shema kodiranja podatkov za oddaje POST.
samodokončanje	Določa, ali je samodokončanje obrazca vklopljeno ali izklopljeno.
novalidat	Določa, ali je treba obrazec potrditi pred oddajo.
sprejemni nabori znakov	Določa kodiranje znakov za oddajo obrazcev.
cilj	Prikazuje, kje bo prikazan odgovor na oddajo obrazca.
...	Združi povezane elemente v obliki/
...	Določa, kaj mora uporabnik vnesti v vsako polje obrazca.
...	Napis za element fieldset.
Določa, katero vrsto vnosa naj prevzame uporabnik.
Atributi za oznaka
vrsta=””	Določa vrsto vnosa (besedilo, datumi, geslo).
ime=””	Določa ime vnosnega polja.
vrednost=””	Določi vrednost v vnosnem polju.
velikost=””	Nastavi število znakov za vnosno polje.
maksimalna dolžina=””	Nastavi omejitev dovoljenih vnosnih znakov.
zahtevano	Polje za vnos postane obvezno.
širina=””	Nastavi širino vnosnega polja v slikovnih pikah.
višina = ""	Nastavi višino vnosnega polja v slikovnih pikah.
placeholder=””	Opisuje pričakovano vrednost polja.
vzorec=””	Določa regularni izraz, ki ga lahko uporabite za iskanje vzorcev v besedilu uporabnika.
min=””	Najmanjša dovoljena vrednost za vhodni element.
max=””	Največja dovoljena vrednost za vhodni element.
onemogočeno	Onemogoči vnosni element.
...	Za zajemanje daljših nizov podatkov od uporabnika.
...	Določa seznam možnosti, med katerimi lahko uporabnik izbira.
Atributi za oznaka
ime=””	Določa ime za spustni seznam.
velikost=””	Število možnosti, ki jih ima uporabnik.
večkraten	Nastavi, ali lahko uporabnik izbere več možnosti s seznama.
zahtevano	Določa, ali je za oddajo obrazca potrebna izbira možnosti.
samodejno ostrenje	Določa, da je spustni seznam samodejno v fokusu, ko se stran naloži.
...	Določi elemente na spustnem seznamu.
vrednost=””	Prikaže besedilo za katero koli dano možnost.
izbrani	Nastavi privzeto možnost, ki je prikazana.
...	Oznaka za ustvarjanje gumba za oddajo obrazca.
Predmeti in okvirji iFrame
	Opisuje vdelano vrsto datoteke.
Atributi za
višina = ""	Višina predmeta.
širina=””	Širina predmeta.
vrsta=””	Vrsta medija, ki ga vsebuje predmet.
	Inline okvir za vdelavo zunanjih informacij.
ime=””	Ime iFrame.
src=””	Izvorni URL za vsebino znotraj okvirja.
srcdoc=””	Vsebina HTML znotraj okvirja.
višina = ""	Višina iFrame.
širina=” ”	Širina iFrame.
Doda dodatne parametre za prilagoditev iFrame.
...	Vdela zunanjo aplikacijo ali vtičnik.
Atributi za
višina = " "	Nastavi višino vdelave.
širina=" "	Nastavi širino vdelave.
vrsta=””	Vrsta ali oblika vdelave.
src=””	Izvorna pot vdelane datoteke.
mize
...	Definira vso vsebino za tabelo.
Opis tabele.
Glave za vsak stolpec v tabeli.
Definira telesne podatke za tabelo.
Opisuje vsebino za nogo tabele.
Vsebina za eno vrstico.
	...	Podatki v enem elementu glave.
	...	Vsebina znotraj ene celice tabele.
Skupine stolpcev za oblikovanje.
En sam stolpec informacij.
Nove oznake HTML5
...	Določa glavo spletne strani.
	Določa nogo spletne strani.
...	Označuje glavno vsebino spletne strani.
...	Določa člen.
	Določa vsebino stranske vrstice strani.
...	Določa določen razdelek na spletni strani.
...	Za opis dodatnih informacij.
...	Uporablja se kot naslov za zgornjo oznako. Uporabniku je vedno viden.
...	Ustvari pogovorno okno.
...	Uporablja se za vključevanje grafikonov in številk.
	Opisuje a element.
...	Poudari določen del besedila.
	Nabor navigacijskih povezav na spletni strani.
...	Določen element s seznama ali menija.
...	Meri podatke v danem območju.
...	Postavi vrstico napredka in sledi napredku.
...	Prikaže besedilo, ki ne podpira pripisov Ruby.
...	Prikaže podrobnosti o tipografskih znakih v vzhodni Aziji.
...	Pripis Ruby za vzhodnoazijsko tipografijo.
...	Označuje čas in datum.
Prelom vrstice znotraj vsebine.
¹ Znakovni predmeti HTML5
" ALI "	Narekovaji
< ALI &lt ;	Znak manj kot (
> ALI &gt ;	Večje od znaka (>)
ALI &nbsp ;	Neprekinjen prostor
© ALI &kopirati ;	Simbol avtorskih pravic
™ ALI &ucirc ;	Simbol blagovne znamke
@ ALI &Uuml ;	simbol "na" (@)
& ALI &amp ;	Simbol ampersanda (&)
• ALI &ouml ;	Majhna krogla
¹ Med tipkanjem znaka HTML prezrite presledek pred podpičjem.

Ustvarite spletno mesto za praktično izkušnjo

Ko enkrat razumete osnove kode HTML in imajo delovno znanje CSS in JavaScript, preizkusite se pri izdelavi spletne strani Kako narediti spletno mesto: za začetnikeDanes vas bom vodil skozi postopek izdelave celotne spletne strani iz nič. Ne skrbite, če se to sliši težko. Vodil vas bom skozi vsak korak. Preberi več . Prav tako se prepričajte, da shranite naše goljufija lastnosti CSS3 Varovalka o osnovnih lastnostih CSS3Obvladajte osnovno sintakso CSS z našo goljufijo lastnosti CSS3. Preberi več in JavaScript goljufija Ultimate JavaScript Cheat SheetPridobite hitro osvežitev o elementih JavaScript s tem varovalnim listom. Preberi več za nadaljnjo uporabo!