De essentielle HTML-spørgsmål, du skal bogmærke

HTML har eksisteret i lang tid nu, så det er på tide at du lærte det grundlæggende. Hvad er det, hvordan det fungerer, og hvordan man skriver nogle almindelige elementer i HTML.

Før du starter, skal du sørge for at læse vores guide til gratis online HTML-redaktører 5 Bedste gratis online HTML-redaktører til at teste din kode 5 Bedste gratis online HTML-redaktører til at teste din kode I perioder, hvor du bare vil fikle med et lille uddrag af HTML, så du kan finjustere det til din smag, en online HTML-editor redigerer dig bedre. og de bedste websteder til HTML-eksempler i kvalitet 8 Bedste websteder til HTML-kodningseksempler af kvalitet 8 Bedste websteder til HTML-kodningseksempler af kvalitet Der er nogle fantastiske websteder, der tilbyder veludformede og nyttige HTML-kodningseksempler og -tutorials. Her er otte af vores favoritter. .

Hvad er HTML?

HTML er det sprog, der bruges til at konstruere websider. HTML står for Hypertext Markup Language og er simpelt et sæt instruktioner til din webbrowser. Ved hjælp af disse instruktioner viser din browser, hvordan en webside skal se ud.

Det er vigtigt at forstå, at det er et markup sprog, ikke et programmering Sprog. Programmeringssprog giver dig mulighed for at løse problemer, såsom matematisk ligning, manipulere data eller flytte et videospilkarakter.

Du kan ikke skrive nogen logik i HTML. Det drejer sig kun om layout.

Hvordan ser HTML ud??

HTML består af flere elementer kendt som “tags”. Mærker er instruktioner til styling af en bestemt del af din webside. Når det drejer sig om konstruktion, er HTML planerne, og tags er specifikke funktioner såsom vinduer eller døre.

Her er hvordan en meget grundlæggende webside ser ud i HTML:

  MUO-websted    

Mærker i HTML er foruddefineret og specificerer almindelige funktioner som billeder, links til andre websider, knapper med mere.

Langt de fleste tags skal være åben og lukket. Dette definerer ganske enkelt en funktion med tekst, billeder eller andre tags inde i den og afslutter derefter definitionen. At tænke tilbage på huse og åbne mærket er som at sige “start vinduet her”, og at lukke tagget er som at sige “her er hvor vinduet slutter”.

HTML-tags vises faktisk ikke på dit websted. Din browser følger instruktionen, men viser den aldrig for nogen besøgende. Det er dog ikke hemmeligt. Alle kan se på din HTML, når du har offentliggjort dine websider.

Mens der er et stort antal forskellige HTML-tags, behøver du ikke lære dem alle, før du kan kode et websted. I dag lærer du, hvordan du skriver nogle almindelige tags, og hvad de kan bruges til.

Hvad er HTML-tagattributter?

En sidste ting at vide om tags er egenskaber. Attributter definerer specielle egenskaber ved tags. Hvis tags er vinduer og døre, angiver egenskaber specifikke bygningsdetaljer. Dette kan være bredden og højden på rammen, uanset om vinduet åbnes, eller hvis døren har en lås.

Attributter er inkluderet i åbningskoden som denne:

Du kan ikke bare sammensætte dine egne tags eller attributter. Attributter og tags er foruddefineret af World Wide Web Consortium (W3C).

Hvad er HTML5?

HTML5 er den seneste version af HTML. Det indeholder flere nye tags, attributter og funktioner.

Da HTML er et sæt instruktioner, fortolker forskellige webbrowsere undertiden det forskelligt. En browser beslutter muligvis, at vinduer og døre skal males sort, medmindre du siger andet.

Mens browsere omsider er begyndt at blive ret konsistente med hinanden, kan du nogle gange stadig blive fanget ud med meget nye funktioner. Måske har Google Chrome implementeret et nyt tag, men Microsofts Internet Explorer har endnu ikke gjort det.

For det meste ser dine websider de samme ud over alle de store browsere, men det er stadig værd at have en hurtig test, før du offentliggør noget, især hvis du bruger nyere tags, som muligvis ikke understøttes af alle browsere endnu.

Hvis du gerne vil vide mere om HTML5, så tag et kig i vores HTML5 vejledning til at komme i gang Kom godt i gang med HTML5 Kom godt i gang med HTML5 Du har hørt om HTML5. Alle bruger det. Det indberettes som frelseren på Internettet, så folk kan skabe rige, engagerende websider uden at ty til at bruge Flash og Shockwave. .

Sådan kommenteres HTML

Som mange andre sprog, markering eller programmering, har HTML evnen til “kommentere” blokke af markup. En kommentar er noget, der ignoreres af browseren. Dette kan være en note til at minde dig selv om, hvad netop dette stykke på dit websted gør.

Ved at kommentere markering instruerer du browseren til at ignorere en eller flere tags. Dette kan være nyttigt til at fjerne funktionalitet eller til at skjule et stykke på dit websted uden at slette koden.

Når en webbrowser ser en kommentar, forstår den den som “Brug ikke disse instruktioner, før jeg siger andet”. Kommentarer består af en “åbning” kommentar, og a “lukning” kommentar, ligesom tags.

Her er et eksempel:

Kommentering af kode udføres nøjagtigt på samme måde:

I stedet for en meddelelse, skal du placere din markering mellem kommentar tags.

Sådan indsættes billeder i HTML

Indsættelse af billeder i din HTML gøres med billedtaggen:

Skriftstørrelse kan let ændres ved hjælp af størrelse attribut:
MUO Big Text
Hvis du gerne vil ændre fontfarve, kan dette let gøres med farve attribut:
MUO rød tekst
Disse attributter er unikke for skrifttype tag. Hvis du ønsker at bruge et andet tag, kan du gøre det rede tags ved at placere den ene i den anden:
MUO rød tekst
Sådan tilføjes et link i HTML
Links kan tilføjes vha -en tag:
MakeUseOf.com
Det href attribut er destinationen for dit link.
Sådan opretter du en tabel i HTML
HTML-tabeller involverer indlejring af flere forskellige tags. Du skal starte med en bord tag:
Tilføj nu nogle rækker ved hjælp af tr tag:
Brug endelig TD tag for at oprette dine tabelceller, som også vil oprette kolonnerne:
Det er muligt at gå overbord og gå helt vild med dit bordlayout, men det er normalt bedst at holde tingene enkle, hvis det er muligt. Tidligere blev tabeller brugt til at strukturere en webside, men denne praksis er dateret og ser forfærdelig ud. Hold tabeller simpelthen til videresendelse af data til læseren.
Brug af CSS med HTML
Disse eksempler har dækket det grundlæggende, men hvis du ønsker at blive virkelig kreativ, skal du bruge CSS. Kaskaderende stilark giver dig meget større kontrol over dit webstedsdesign og giver dig mulighed for at genbruge en hel del kode mellem forskellige dele af dit websted.
Mens vi har tutorials om at lære CSS 5 Baby-trin til at lære CSS og blive en Kick-Ass CSS Sorcerer 5 Baby-trin til at lære CSS og blive en Kick-Ass CSS Sorcerer CSS er den eneste vigtigste ændring websider har set i det sidste årti, og det banede vejen for adskillelse af stil og indhold. På den moderne måde definerer XHTML den semantiske struktur ... og hurtige CSS-eksempler 10 enkle CSS-kodeeksempler, du kan lære på 10 minutter 10 enkle CSS-kodeeksempler, du kan lære på 10 minutter. Vi vil undersøge, hvordan du opretter et inline stilark, så du kan øve dine CSS-færdigheder. Derefter går vi over på 10 grundlæggende CSS-eksempler. Derfra er din fantasi grænsen! , er der stadig nogle opsætninger, du kan gøre i HTML.
Hvis du gerne vil skrive CSS ved siden af ​​din HTML, kan du bruge stil attribut. Denne attribut anvender ganske enkelt CSS til det tag, det bruges på:
Selvom denne måde fungerer godt, finder du det hårdt arbejde at vedligeholde, hvis du har en masse markup, som kræver lignende styling.
Den bedre måde er at bruge stil tag, placeret inden i hoved tag. Her kan du definere CSS for hele din side:
   MANGE CSS-REGLER   
Stilmærket har en attribut af tekst / css. Dette er påkrævet for at lade din browser vide den nøjagtige stil, som du kan forvente i tagget.
Den tredje og sidste måde at bruge CSS på er gennem en ekstern fil ved hjælp af link tag. Dette knytter din HTML til CSS, der er gemt i sin egen fil, hvilket er godt, hvis du har en stor mængde af den:
Der er flere attributter i brug her. Det rel attribut erklærer dit link som et stilark. Typen af “tekst / css” er endnu en gang defineret i type attribut og href attribut er hvor du kan finde den eksterne fil.
Hvordan opretter du et websted med HTML?
Som du har set, er HTML ikke så slemt, vel? Ved hjælp af et par enkle tags og attributter kan du hurtigt samle en webside, selvom du aldrig har skrevet HTML før!
Hvis du ønsker at skrive et komplet websted, så sørg for at tage et kig på vores begynderguide til oprettelse af et websted Sådan oprettes et websted: For begyndere Sådan oprettes et websted: For begyndere i dag vil jeg guide dig igennem processen med at oprette et komplet websted fra bunden. Bare rolig, hvis dette lyder svært. Jeg vil guide dig gennem det hvert skridt på vejen.   .