Et nettsted består av tre hoveddeler som er overskrift, kropp og bunntekst. Disse delene er laget av kombinasjonen av mange andre elementer som overskrift, avsnitt, bilder og mer. Mer spesifikt er overskriften den viktigste delen av en hvilken som helst webside fordi den inneholder all informasjonen relatert til websiden, inkludert tittelen, beskrivelsen og logoen.

I denne håndboken vil vi diskutere “" stikkord. Så la oss starte!

HTML -topptaggen

HTML gir "”Tag, som brukes til å definere tittelen og overskriften til det relaterte innholdet på en webside. Du kan også legge til en overskrift, avsnitt, logo, bilde og lenker i overskriften.

Syntaks

Syntaksen til topptaggen er:

HTML -elementer

Elementene du vil inkludere i overskriften, må legges inn mellom åpnings- og lukkende topptagger.

La oss flytte til eksemplet der vi skal lære å lage en overskrift.

Eksempel: Hvordan lage en overskrift?

I HTML -filen vil vi først bruke "”Tag for å lage en overskrift. Etter det, legg til en overskrift “

”Og fire lenker ved hjelp av“”Tag i“" stikkord. I “href", Legg til "#”Og angi lenken til siden du vil legge til. Neste, tilordne navnene på lenkene som "Hjem”,“Om”,“Kontakt oss”, Og“Personvernregler”. Disse lenkenavnene vises på overskriften på websiden.

Html

Linuxhint

Hjem
Om
Kontakt oss
Personvernregler

I det undervernede bildet kan du se at overskriften er opprettet:

Du kan også style overskriften ved hjelp av CSS. Her er metoden for å gjøre det.

I CSS vil vi bruke “Overskrift”For å få tilgang til overskriften som er opprettet i HTML. Her, bruk "Tekstalign”Eiendomsverdi som“senter”For å justere overskriften og lenker i midten av siden. Vi vil også sette bakgrunnsfargen på overskriften som "RGB (80, 80, 79)”Og sett fargen på overskriften som“RGB (206, 158, 34)”. Vi vil justere skriftstørrelsen til “30px”. Etter det, sett polstringen som “30px”.

CSS

Overskrift
tekst-align: sentrum;
Bakgrunn: RGB (80, 80, 79);
Farge: RGB (206, 158, 34);
Font-størrelse: 30px;
polstring: 30px;

Følgende bilde viser at overskriften er stylet vellykket:

Nå vil vi style lenkene.

Stilkoblinger

For å gjøre dette, først, bruk "en”For å få tilgang til lenkene. Her vil vi sette verdien av "tekstdekorasjon”Eiendom som“ingen”For å fjerne standard dekorasjon av lenkene. Sett etter det margin-venstre som "40px”, Margin-høyre som“30px”, Og margin-top som“50px”. Til slutt vil vi sette fargen på koblingene som "RGB (206, 158, 34)”:

en
Tekstdekorasjon: Ingen;
Margin-venstre: 40px;
Margin-høyre: 30px;
Margin-top: 50px;
Farge: RGB (206, 158, 34)

Her er resultatet som viser at overskriften er stylet vellykket:

Header med logo

Du kan også legge til en logo i overskriften på websiden. For dette må du legge til et logobilde i HTML -filen og angi den på overskriften ved hjelp av CSS.

Eksempel

Her vil vi lage en div inne i topptaggen og navngi Div -klassen som "bilde”. Den gjenværende delen av overskriften er den samme som forrige eksempel:

..

I CSS vil vi bruke “.bilde”For å få tilgang til div og legge til et logobilde ved hjelp av“bakgrunn”Eiendom. I “URL ()”, Vi vil legge til banen til bildet som“URL (logo.png)”. Her vil vi bruke “Ingen repeter”For å unngå repetisjon av bildet. Til slutt vil vi sette bredden på logoen som "250px”Og høyden som“100px”:

.bilde
Bakgrunn: URL (logo.png) ingen repetisjon;
Bredde: 250px;
Høyde: 100px;

Ved hjelp av koden over oppnås følgende utgang, og det kan sees at logoen legges til øverst til venstre hjørne av overskriften:

Header med bilde

Det er også mulig å lage en overskrift med bakgrunnsbildet. La oss lage det.

Eksempel

Først vil vi legge til bildet i HTML -filen, det samme som forrige eksempel, og deretter legge til banen til bildet i URL () som "bilde.jpg”Og bruk en“Ingen repeter”Verdi for å unngå repetisjon av bildet. Etter det, bruk bakgrunnen-posisjonsegenskapen til å sette posisjonen til bildet som “senter”Og bakgrunnsstørrelse som“dekke”For å sette bildet i hele overskriften. Til slutt, sett høyden på bildet som "250px”:

.bilde
Bakgrunn: URL (bilde.jpg) ingen repetisjon;
Bakgrunnsposisjon: sentrum;
Bakgrunnsstørrelse: Deksel;
Høyde: 250px;

Her er resultatet som viser at bildet legges til i overskriften:

Det er det! Vi har forklart overskriftskoden i detalj.

Konklusjon

I HTML, “”Tag brukes til å lage websideoverskriften. I overskriften kan delen av nettsiden, overskriften, kort avsnitt, logo, bakgrunnsbilde og navigasjonslinje legges til. I denne håndboken diskuterte vi taggen og ga et eksempel ved å opprette og style websideoverskriften.