Ovaj tekst će vas uputiti u mijenjanje sadržaja u CSS-u.
Kako promijeniti sadržaj u CSS-u?
Kako bismo promijenili sadržaj u CSS-u, koristit ćemo metode u nastavku:
Prođimo kroz svaku metodu jednu po jednu!
Metoda 1: Koristite ::after Selector sa svojstvom sadržaja za promjenu sadržaja u CSS-u
' ::nakon ” selektor postavlja navedeni sadržaj nakon HTML elementa pomoću CSS-a “ sadržaj ” vlasništvo. Ova operacija pomaže u dodavanju sadržaja odabranom elementu. Osim toga, ' prikaz ” svojstvo se može koristiti za skrivanje postojećeg sadržaja.
Pogledajmo donji primjer da bismo razumjeli kako promijeniti sadržaj u CSS-u pomoću selektora ::after.
Primjer
Ovdje je naša HTML stranica s tekstom ' Dobro jutro!!! ”. Zamijenimo dodani sadržaj:
Trenutno smo dodali ' “ s tekstom u odjeljku tijela naše HTML datoteke:
< str > Dobro jutro!!! < / str >U našoj CSS datoteci sada ćemo koristiti selektor ::after kao ' tijelo::poslije ' i koristite ' sadržaj ' svojstvo s vrijednošću ' Dobra večer ” unutar svoje definicije. Kao rezultat toga, CSS selektor će postaviti tekst odmah iza napisanog teksta. Na kraju, sakrijte postojeći tekst pomoću ' prikaz ” i postavite njegovu vrijednost na „ nikakav ”:
< stil >tijelo::poslije {
sadržaj : 'Dobra večer' ;
}
str {
prikaz: nijedan;
}
< / stil >
Sada spremite svoju HTML datoteku i jednostavno je otvorite u pregledniku ili upotrijebite “Live Server ” za istu svrhu:
Kao što vidite, sadržaj je uspješno promijenjen korištenjem ::after CSS selektora:
Metoda 2: Koristite ::before Selector sa svojstvom sadržaja za promjenu sadržaja u CSS-u
U CSS-u, ' ::prije ” selektor se koristi kako bi se sadržaj pojavio neposredno prije postojećeg sadržaja elementa. Može se koristiti u kombinaciji s ' sadržaj ” za dodavanje novog sadržaja odabranom elementu.
Primjer
Odredite selektor ::before odmah nakon tijela kao ' tijelo::prije ”. Ovo će postaviti novi sadržaj ispred postojećeg sadržaja. Imajte na umu da sva ostala svojstva ostaju ista kao u prethodnom primjeru:
< stil >tijelo::prije {
sadržaj : 'Dobra večer' ;
}
str {
prikaz: nijedan;
}
< / stil >
Izlaz
Objasnili smo različite metode za promjenu sadržaja u CSS-u.
Zaključak
Za promjenu sadržaja, ' ::nakon ' i ' ::prije ” CSS selektori koriste se s “ sadržaj ” vlasništvo. U prvom pristupu, navedeni tekst se dodaje nakon odabranog elementa, dok drugi CSS selektor radi suprotno. Štoviše, ' prikaz ” Svojstvo se može koristiti za skrivanje postojećeg sadržaja elementa. Ovo je način na koji se sadržaj potpuno mijenja u CSS-u. Pokrili smo dvije metode mijenjanja sadržaja u CSS-u.