Како променити садржај у ЦСС-у

Kako Promeniti Sadrzaj U Css U



У веб апликацијама, сваки програмер настоји да побољша изглед и укупно корисничко искуство са сваког аспекта. Понекад програмери желе да раде ствари другачије и боље од других. На пример, приказивање текста на нечему, а затим мењање у нешто друго у складу са ажурирањима. Ово се све може урадити уз помоћ ЦСС различитих својстава и селектора.

Овај текст ће вас упутити о промени садржаја у ЦСС-у.

Како променити садржај у ЦСС-у?

Да бисмо променили садржај у ЦСС-у, користићемо следеће методе:







Хајде да прођемо кроз сваки метод један по један!



Метод 1: Користите ::афтер Селецтор са својством садржаја да бисте променили садржај у ЦСС-у

::после ” селектор поставља наведени садржај иза ХТМЛ елемента користећи ЦСС “ садржаја ' имовина. Ова операција помаже у додавању садржаја изабраном елементу. Поред тога, „ приказ ” својство се може користити за сакривање постојећег садржаја.



Хајде да погледамо доњи пример да бисмо разумели како да промените садржај у ЦСС-у користећи селектор ::афтер.





Пример

Ево наше ХТМЛ странице са текстом „ Добро јутро!!! ”. Заменимо додати садржај:



Тренутно смо додали „ <п> “ ознака са текстом у делу тела наше ХТМЛ датотеке:

< стр > Добро јутро!!! < / стр >

У нашој ЦСС датотеци, сада ћемо користити ::афтер селектор као „ тело::после ” и користите „ садржаја ” својство са вредношћу “ Добро вече ” унутар своје дефиниције. Као резултат тога, ЦСС селектор ће поставити текст одмах иза написаног текста. На крају, сакријте постојећи текст помоћу „ приказ ” својство и подесите његову вредност на “ ниједан ”:

< стил >

тело::после {

садржаја : 'Добро вече' ;

}

стр {

приказ: нема;

}

< / стил >

Сада сачувајте своју ХТМЛ датотеку и једноставно је отворите у претраживачу или користите „Сервер уживо ” у исту сврху:

Као што видите, садржај је успешно промењен коришћењем ::афтер ЦСС селектора:

Метод 2: Користите ::бефоре Селецтор са својством садржаја да бисте променили садржај у ЦСС-у

У ЦСС-у, „ ::пре него што ” селектор се користи да би се садржај појавио непосредно испред постојећег садржаја елемента. Може се користити у комбинацији са „ садржаја ” да бисте додали нови садржај изабраном елементу.

Пример

Наведите селектор ::бефоре одмах иза тела као „ тело::пре ”. Ово ће поставити нови садржај испред постојећег садржаја. Имајте на уму да сва остала својства остају иста као у претходном примеру:

< стил >

тело::пре {

садржаја : 'Добро вече' ;

}

стр {

приказ: нема;

}

< / стил >

Излаз

Објаснили смо различите методе за промену садржаја у ЦСС-у.

Закључак

Да бисте променили садржај, „ ::после ' и ' ::пре него што ” ЦСС селектори се користе са „ садржаја ' имовина. У првом приступу, наведени текст се додаје иза изабраног елемента, док други ЦСС селектор ради супротно. Штавише, „ приказ ” својство се може користити за сакривање постојећег садржаја елемента. Овако се садржај у ЦСС-у потпуно мења. Покрили смо две методе промене садржаја у ЦСС-у.