“ arba „ Taip pat galima naudoti žymas, bet gera praktika yra naudoti “ žymą. Tada priskirkite „ antraštę “ klasėje, kad antraštės skiltyje pritaikytumėte CSS stilius. Po to pridėkite „

“ žymą ir priskirkite jai „klasę“ Antraštė “, kad būtų rodomas turinys „Sveiki atvykę į Linuxhint!“:

klasė = 'antraštė' >

< h1 klasė = 'Antraštė' > Sveiki atvykę į Linuxhint! < / h1 >

< / antraštė>

Po to pasirinkite „ “ pažymėkite klasę ir priskirkite šiuos stilius:

---

---

.antraštė {

fono vaizdas: url ( „../bg.jpg“ ) ;

fonas- dydis : dangtelis;

fono kartojimas: nekartoti;

spalva : balti dūmai;

fono padėtis: viršuje;

padding: 0px 20px 20px 20px;

}

Aukščiau pateikto kodo paaiškinimas nurodytas toliau:

• Pirmiausia nustatykite vaizdą ' bg.jpg “ kaip antraštės skyriaus foną naudojant „ fono vaizdas ' nuosavybė.
• Toliau „ fono dydžio “ ir „ fono kartojimas “ ypatybės naudojamos atitinkamai vaizdo dydžiui nustatyti ir vaizdo pasikartojimui sustabdyti.
• Po to nustatykite teksto spalvą ir vaizdo padėtį į viršų naudodami „ spalva “ ir „ fono padėtis “ savybes.
• Pabaigoje „ kamšalas ypatybė naudojama tarpo tarp antraštės turinio ir kraštinės nustatymui.

Įvykdžius aukščiau pateiktą kodą, tinklalapis atrodo taip:

Aukščiau pateiktame išvestyje rodoma, kad sukurta antraštės dalis ir jai taikomi CSS stiliai.

2 veiksmas: sukurkite naršymo juostą

Daugeliu atvejų antraštėje taip pat gali būti naršymo juosta. Norėdami sukurti naršymo juostą, HTML “ žyma gali būti labai naudinga. Štai kodėl pridėkite naršymo juostos elementus naudodami „ “ žymas ir priskirti „klasę“ veikti “:

klasė = 'antraštė' >



< a klasė = 'veiksmas' href = '#' >Namai< / a >

< a klasė = 'veiksmas' href = '#' >Paslaugos< / a >

< a klasė = 'veiksmas' href = '#' >Apie mus< / a >

< a klasė = 'veiksmas' href = '#' >Susisiekite su mumis< / a >

< a klasė = 'veiksmas' href = '#' >Nauji atvykėliai< / a >

< / ne>

< br >< br >

< h1 klasė = 'Antraštė' > Sveiki atvykę į Linuxhint! < / h1 >

< / antraštė>

Įvykdžius aukščiau pateiktą kodą, tinklalapis atrodo taip:

Aukščiau pateikta išvestis parodo, kad naršymo juostos elementai ' Namai “, „ Paslaugos “, „ Apie mus “, „ Susisiekite su mumis “ ir „ Nauji atvykėliai “ buvo sukurti.

3 veiksmas: taikykite stilius naršymo juostos elementams

Norėdami sukurti naršymo juostos elementų stilių, pasirinkite „ veikti “ klasę ir priskirkite šias CSS stilių ypatybes:

.veikti {

tekstas-dekoravimas: nėra;

spalva : baltas;

ekranas: blokas;

pamušalas: 15px;

šriftas- dydis : didelis;

plūdė: kairė;

paraštė: 0 tšk. 20 tšk.;

}

Aukščiau pateikto kodo paaiškinimas yra toks:

• Pirma, „ tekstas-dekoravimas ypatybė nustatyta į „nėra“, kad būtų pašalintas iš anksto nustatytas „ “ žymą.
• Norėdami pagerinti teksto matomumą vartotojui, „ baltas “ ir „ didelis “ reikšmės pateikiamos „ spalva ' ir ' šrifto dydis ' nuosavybė.
• Po to „ ekranas “ ir „ plūdė “ savybės padeda “ “, kad būtų rodomi toje pačioje eilutėje.
• Pabaigoje „ kamšalas “ ir „ marža ” ypatybių reikšmės naudojamos tarpai tarp kiekvienos „ “ žymos sukurti.

Įvykdžius aukščiau pateiktą kodą, tinklalapis atrodo taip:

Aukščiau pateikta išvestis rodo, kad naršymo juostos elementai dabar yra sukurti.

4 veiksmas: pridėkite užvedimo efektą prie naršymo juostos elementų

Kaip ir aukščiau pateiktame išvestyje, užvedimo efektas nepasiekiamas naršymo juostos elemente. Norėdami pridėti abu, pasirinkite „ Antraštė “ klasė, kuri yra priskirta „

“ žymą. Po to pridėkite „ :užveskite pelės žymeklį “ parinkiklis su “ veikti “ klasę, kad pritaikytumėte pelės žymeklio efektą naršymo juostos elementams:

.act:hover {

siena : 2px vientisas baltas;

spalva : mėlyna violetinė;

}

.Antraštė {

tekstas- lygiuotis : centras;

marža: 18 % 0px;

}

Aukščiau pateikto kodo paaiškinimas pateikiamas žemiau:

• Pirmiausia nustatykite „ siena ' 2 pikselių tipo kietą medžiagą ir priskirkite baltą ' spalva “. Kartu su juo nustatykite „ mėlynai violetinė “ spalva tik tada, kai vartotojas užveda pelės žymeklį ant naršymo juostos elementų.
• Tada pasirinkite „ Antraštė “ klasę ir nustatykite jos lygiavimą į „ centras “ ir pateikite šiek tiek paraštės, kad skyrius atrodytų didesnis.

Įvykdžius aukščiau pateiktą kodą, galutinė antraštės išvaizda atrodo taip:

Aukščiau pateiktame išvestyje rodoma, kad antraštė sukurta naudojant HTML ir CSS.

Išvada

HTML faile žyma „

“ naudojama antraštės skyriui sukurti. Po to vartotojai gali pritaikyti CSS ypatybes, pvz., užpildymą ir fono paveikslėlius, kad pagerintų antraštės skyrių. Tai taikoma visiems antraštės elementams, pvz., naršymo juostai. Norėdami sukurti naršymo juostą, vartotojai gali naudoti žymą „