Hvordan lage en enkel HTML -side

Hvordan lage en enkel HTML -side
En webside er et dokument på World Wide Web skrevet på et hypertekstmarkeringsspråk. Dette språket består av hundrevis av elementer, også referert til som "Tagger”. Mens det kaskaderende stilarket kan hjelpe med HTML for å gi stylingegenskaper til HTML -elementene.

Når du starter nettutvikling, kan det hende at nybegynnere ikke kjenner til metoden for å lage en enkel HTML -side og utføre den. Så denne håndboken vil demonstrere:

  • Forutsetninger for å opprette en webside
  • Hvordan lage en enkel HTML -side?
  • Hvordan style en enkel HTML -side?

Forutsetninger for å opprette webside

For å opprette en webside er forutsetningene:

  • Text Editor
  • nettleser

Text Editor som forutsetning for å lage webside

Et dataprogram som tillater brukere å redigere, lagre og skrive ut tekst er en tekstredigerer. Flere tekstredaktører kan brukes til å lage webprogrammer, websider og mer, for eksempel Visual Studio -kode, sublim tekst, notisblokk og så videre. Hvis du er nybegynner, er notisblokken relativt enkel å bruke. Men for store prosjekter er det bedre å bruke alle andre redaktører som sublim tekst eller visuell studiokode.

Nettleser som forutsetning for visning av webside

En nettleser er programvare som tar deg hvor som helst på internett. Den henter informasjon og viser dem på en skjerm.

Hvordan lage en enkel HTML -side?

La oss begynne å lage en enkel HTML-side trinn for trinn.

Trinn 1: Opprett tom mappe
Lag først en tom mappe som depot for prosjektet vårt:

Trinn 2: Åpne tekstredigerer
For å skrive HTML -kode, velg først tekstredigereren etter eget valg. For eksempel vil vi bruke Notisblokk ++, og arbeidsområdet vil på en eller annen måte se slik ut:

Trinn 3: Legg til HTML -elementer i tekstredigerer
HTML -elementer brukes til å konstruere forskjellige komponenter i HTML -dokumentet. For eksempel for å legge til et avsnitt,

Tag brukes, overskrifter tagger er betegnet som

,

,

,

,

, og
. For å legge til et bilde, kan en tag brukes. Alle disse taggene er lagt til i start- og lukkingsmerkeene til rotelementet .

For eksempel har vi lagt til HTML -prøvekoden i filen vår som følger:



Min første HTML -side


Html


Velkommen til min første HTML -side.



Bildet nedenfor viser et eksempelskode skrevet i Notepad ++ Editor:

Trinn 4: Lagre fil
Lagre HTML -filen i mappen du har opprettet i det første trinnet ved å klikke på "Lagre”Alternativ som vist nedenfor:

Som et resultat vil du bli bedt om å spesifisere filnavnet og den. Etter å ha gjort det, klikker du på "Lagre”-Knappen som vist nedenfor:

Trinn 5: Åpne fil med nettleser
Følg trinnene for å se hvordan HTML-filen vises i nettleseren:

  • Åpne først mappen der HTML -filen er lagret.
  • Velg filen og høyreklikk på filen. Som et resultat vises en rullegardinmeny.
  • Velg deretter "Åpne med”Alternativ og velg deretter nettleseren du vil bruke til å åpne websiden. For eksempel har vi valgt "Google Chrome”:

Ved å velge nettleseren vil HTML -koden generere resultatet som følger:

Slik kan vi lage en enkel HTML -side. Du kan bruke stiler på disse HTML -elementene ved hjelp av CSS.

Hvordan style en enkel HTML -side?

CSS, eller Cascading Style Sheet, brukes til å spesifisere hvordan HTML -elementene vises på nettleseren. Det tillater brukere å bruke flere stylingegenskaper på HTML -elementer slik at websiden ser mer attraktiv og tiltalende.

La oss nå style den ovennevnte HTML-siden ved hjelp av CSS-egenskapene:

  • Legg først til en tag i hodeseksjonen i HTML -filen.
  • Inne i den brukes H1 for å få tilgang til

    Tag som vi vil bruke forskjellige egenskaper.

  • For å legge til skriftfargen, bruk "farge”Eiendom og setter verdien som“rød”.
  • Tekstalign”Eiendomsverdien er satt som“senter”, Som betyr at overskriften vil vises i sentrum.
  • For å understreke overskriften, “tekstdekorasjon”Eiendom er satt som“8px understreket grått”, Der 8px representerer bredden på linjen, understreker er dekorasjonsegenskapen, og grå er fargen. Brukere kan angi eiendomsverdiene i henhold til deres preferanser.
  • Tilsvarende vil vi bruke noen egenskaper på

    element også.

Nedenfor er koden for det ovenfor beskrevne scenariet:


Min første HTML -side

Lagre filen og åpne den deretter i nettleseren:

Det er kult! Vi har lært å lage en enkel HTML -side og style den med noen CSS -egenskaper.

Konklusjon

For å utvikle et nettsted, for det første, må brukerne lære HTML- og CSS -språk som HTML -språk gir strukturen på websiden, og for å forskjønne websidene, bruker vi CSS -egenskaper. Disse egenskapene er satt i henhold til brukerens valg. For å lage en enkel HTML -fil, kan du enten bruke en tekstredigerer eller en kodeditor og følge den gitte prosedyren. Denne håndboken har forklart hvordan du oppretter en enkel HTML -side med CSS ved hjelp av praktisk implementering.