HTML Essentialsi petuleht: sildid, atribuudid ja palju muud

Veebilehtede loomine algab HTML-ist. Nende kaunistamine ja interaktiivseks muutmine tuleb hiljem. Kuid funktsionaalsete staatiliste veebisaitide loomise alustamiseks on vaja HTML-i mõistmist. (Kas soovite selle märgistuskeele kiiret tutvustust? Lugege meie HTML-i KKK.)

Keeleõppe osana on olemas pikk nimekiri elementidest, mida peate oma HTML-i sõnavarasse lisama. Ja see ülesanne võib alguses tunduda hirmutav, mistõttu oleme koostanud järgmise petulehe. See annab teile lihtsa viisi HTML-i elementide avastamiseks/mõistmiseks/meenutamiseks igal ajal, kui neid vajate.

Petuleht hõlmab silte ja atribuute veebilehtede struktureerimiseks, teksti vormindamiseks, vormide, piltide, loendite, linkide ja tabelite lisamiseks. See sisaldab ka silte, mis võeti kasutusele HTML5-s ja HTML-koodides sageli kasutatavate erimärkide jaoks.

TASUTA ALLALAADIMINE: See petuleht on saadaval a allalaaditav PDF meie turustuspartnerilt TradePub. Selle esmakordseks kasutamiseks peate täitma lühikese vormi. Lae alla HTML Essentialsi petuleht.

HTML Essentialsi petuleht

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

...

Otsetee	Tegevus
Põhisildid
...	HTML-dokumendi esimene ja viimane silt. Kõik muud sildid asuvad nende avamise ja sulgemise siltide vahel.
...	Määrab dokumendi metaandmete kogu.
	Kirjeldab lehe pealkirja ja kuvatakse brauseri tiitliribal.
...	Sisaldab kogu veebilehel kuvatavat sisu.
Dokumendi teave
Mainib baas-URL-i ja kõik suhtelised lingid dokumendile.
Lisateavet lehe kohta, nagu autor, avaldamiskuupäev jne.
Lingid välistele elementidele, nagu stiililehed.
	Sisaldab dokumendi stiiliteavet, nagu CSS (kaskaadlaaditabelid).
	Sisaldab linke välistele skriptidele.
Teksti vormindamine
... VÕI ...	Muudab teksti paksuks.
...	Kursiivistab teksti ja muudab selle paksuks.
...	Kursiivis teksti, kuid ei muuda seda paksuks.
...	Läbikriipsutatud tekst.
...	Viitab tsitaadi autorile.
...	Sildistab teksti kustutatud osa.
...	Näitab jaotist, mis on sisusse sisestatud.
...	Hinnapakkumiste kuvamiseks. Kasutatakse sageli koos silt.
...	Lühemate tsitaatide jaoks.
...	Lühendite ja täisvormide jaoks.
...	Määrab kontaktandmed.
...	Definitsioonide jaoks.
...	Koodilõikude jaoks.
...	Alamindeksite kirjutamiseks
...	Ülaindeksite kirjutamiseks.
...	Teksti suuruse vähendamiseks ja üleliigse teabe märgistamiseks HTML5-s.
Dokumendi struktuur
...	Pealkirjade erinevad tasemed. H1 on suurim ja H6 on väikseim.
...	Sisu plokkideks jagamiseks.
...	Sisaldab tekstisiseseid elemente, nagu pilt, ikoon, emotikon, ilma lehe vormingut rikkumata.
...	Sisaldab lihtteksti.
	Loob uue rea.
	Joonistab horisontaalse riba, mis näitab jaotise lõppu.
Loendid
...	Tellitud kaupade nimekirja jaoks.
...	Järjestamata kaupade loendi jaoks.
...	Loendi üksikute üksuste jaoks.
...	Üksuste loend koos määratlustega.
...	Üksiku termini määratlus, mis on kooskõlas keha sisuga.
...	Määratletud termini kirjeldus.
Lingid
...	Hüperlinkide ankrusilt.
...	Sildid e-posti aadressidega linkimiseks.
...	Ankrusilt kontaktnumbrite loetlemiseks.
...	Ankrumärgend sama lehe teise osa linkimiseks.
...	Liigub veebilehe jaotisesse div. (ülaltoodud sildi variatsioon)
Pildid
	Pildifailide kuvamiseks.
Atribuudid jaoks silt
src=”url”	Link pildi lähteteele.
alt=”tekst”	Tekst, mis kuvatakse, kui hiirekursor on pildi kohal.
kõrgus=” ”	Pildi kõrgus pikslites või protsentides.
laius=” ”	Pildi laius pikslites või protsentides.
joondada=” ”	Kujutise suhteline joondus lehel.
piiri =” ”	Pildi serva paksus.
	Link klikitavale kaardile.
	Kaardipildi nimi.
Pildikaardi pildiala.
Atribuudid jaoks silt
kuju =" "	Pildiala kuju.
koordinaadid=” ”	Kaardi kujutise ala koordinaadid.
Vormid
...	HTML-vormi ülemmärgend.
Atribuudid jaoks silt
action=”url”	URL, kuhu vormi andmed esitatakse.
meetod=” ”	Määrab vormi esitamise protokolli (POST või GET).
enctype=” ”	Andmete kodeerimise skeem POST-esituste jaoks.
automaatne täitmine	Määrab, kas vormi automaatne täitmine on sisse või välja lülitatud.
novalideerida	Määrab, kas vorm tuleks enne esitamist kinnitada.
aktsepteeri-märgikomplektid	Määrab vormide esitamise märgikodeeringu.
sihtmärk	Näitab, kus kuvatakse vormi esitamise vastus.
...	Rühmitab seotud elemendid kujul/
...	Määrab, mida kasutaja peab igale vormiväljale sisestama.
...	Väljakomplekti elemendi pealkiri.
Määrab, millist tüüpi sisendit kasutajalt võtta.
Atribuudid jaoks silt
tüüp=””	Määrab sisestuse tüübi (tekst, kuupäevad, parool).
nimi=””	Määrab sisestusvälja nime.
väärtus=””	Määrab väärtuse sisestusväljal.
suurus =""	Määrab sisestusvälja märkide arvu.
max pikkus =""	Määrab lubatud sisestusmärkide piirangu.
nõutud	Muudab sisestusvälja kohustuslikuks.
laius=””	Määrab sisestusvälja laiuse pikslites.
kõrgus =""	Määrab sisestusvälja kõrguse pikslites.
kohatäide=””	Kirjeldab välja eeldatavat väärtust.
muster=””	Määrab regulaaravaldise, mida saab kasutada kasutaja tekstist mustrite otsimiseks.
min=””	Sisendelemendi minimaalne lubatud väärtus.
max=””	Sisendelemendi maksimaalne lubatud väärtus.
puudega	Keelab sisendelemendi.
...	Pikemate andmejadade hõivamiseks kasutajalt.
...	Määrab valikute loendi, mille hulgast kasutaja saab valida.
Atribuudid jaoks silt
nimi=””	Määrab ripploendi nime.
suurus =""	Kasutajale antud valikute arv.
mitmekordne	Määrab, kas kasutaja saab valida loendist mitu valikut.
nõutud	Määrab, kas vormi esitamiseks on vajalik suvandite valimine.
autofookus	Määrab, et pärast lehe laadimist fookustatakse automaatselt ripploendit.
...	Määratleb üksused ripploendis.
väärtus=””	Kuvab mis tahes valiku teksti.
valitud	Määrab kuvatava vaikevaliku.
...	Vormi esitamise nupu loomise silt.
Objektid ja iFrame'id
	Kirjeldab manustatud failitüüpi.
Atribuudid jaoks
kõrgus =""	Objekti kõrgus.
laius=””	Objekti laius.
tüüp=””	Meediumi tüüp, mida objekt sisaldab.
	Sisene raam välisteabe manustamiseks.
nimi=””	iFrame'i nimi.
src=””	Raami sees oleva sisu allika URL.
srcdoc=””	HTML-sisu raami sees.
kõrgus =""	iFrame'i kõrgus.
laius=” ”	iFrame'i laius.
Lisab iFrame'i kohandamiseks lisaparameetreid.
...	Manustab välise rakenduse või pistikprogrammi.
Atribuudid jaoks
kõrgus =" "	Määrab manustamise kõrguse.
laius=” ”	Määrab manustamise laiuse.
tüüp=””	Manuse tüüp või vorming.
src=””	Manustatud faili lähtetee.
Tabelid
...	Määrab tabeli kogu sisu.
Tabeli kirjeldus.
Päised iga tabeli veeru jaoks.
Määrab tabeli kehaandmed.
Kirjeldab tabeli jaluse sisu.
Ühe rea sisu.
	...	Andmed ühes päiseüksuses.
	...	Sisu ühes tabelilahtris.
Rühmitab veerud vormindamiseks.
Üks teabe veerg.
HTML5 uued sildid
...	Määrab veebilehe päise.
	Määrab veebilehe jaluse.
...	Märgib veebilehe põhisisu.
...	Määrab artikli.
	Määrab lehe külgriba sisu.
...	Määrab veebilehe konkreetse jaotise.
...	Lisateabe kirjeldamiseks.
...	Kasutatakse ülaltoodud sildi pealkirjana. On alati kasutajale nähtav.
...	Loob dialoogiboksi.
...	Kasutatakse diagrammide ja jooniste lisamiseks.
	Kirjeldab a element.
...	Tõstab esile konkreetse tekstiosa.
	Veebilehe navigeerimislinkide komplekt.
...	Konkreetne üksus loendist või menüüst.
...	Mõõdab andmeid etteantud vahemikus.
...	Paigutab edenemisriba ja jälgib edenemist.
...	Kuvab teksti, mis ei toeta Ruby annotatsioone.
...	Kuvab Ida-Aasia tüpograafia tähemärkide üksikasju.
...	Rubiini annotatsioon Ida-Aasia tüpograafia jaoks.
...	Tuvastab kellaaja ja kuupäeva.
Reavahetus sisu sees.
¹HTML5 tähemärgiobjektid
"VÕI &quot ;	Jutumärgid
< VÕI &lt ;	Väiksem kui märk (
> VÕI &gt ;	Suurem kui märk (>)
VÕI &nbsp ;	Mittepurunev ruum
© VÕI &copy ;	Autoriõiguse sümbol
™ VÕI &ucirc ;	Kaubamärgi sümbol
@ VÕI &Uuml ;	Sümbol „at” (@)
& VÕI &amp ;	Ampersandi sümbol (&)
• VÕI &ouml ;	Väike kuul
¹ Ignoreerige HTML-i märgi sisestamisel semikooloni ees olevat tühikut.

Looge praktiliste kogemuste jaoks veebisait

Kui olete aru saanud HTML-koodi põhitõed ja teil on tööalased teadmised CSS-ist ja JavaScriptist, proovige kätt veebisaidi loomisel Kuidas veebisaiti teha: algajateleTäna juhendan teid täieliku veebisaidi loomise protsessis nullist. Ärge muretsege, kui see kõlab raskelt. Juhendan teid igal sammul sellest läbi. Loe rohkem . Samuti säästke kindlasti meie CSS3 atribuutide petuleht Oluliste CSS3 atribuutide petulehtMeie CSS3 atribuutide petulehe abil saate hallata olulist CSS-i süntaksit. Loe rohkem ja JavaScripti petuleht Ultimate JavaScripti petulehtSelle petulehe abil saate kiiresti värskendust JavaScripti elementide kohta. Loe rohkem edaspidiseks kasutamiseks!