Questo articolo ti guiderà sulla modifica dei contenuti in CSS.
Come modificare il contenuto in CSS?
Per modificare il contenuto in CSS, useremo i metodi seguenti:
Passiamo attraverso ogni metodo uno per uno!
Metodo 1: Utilizzare :: After Selector con proprietà Content per modificare il contenuto in CSS
IL "::Dopo"Il selettore posiziona il contenuto specificato dopo l'elemento HTML utilizzando il CSS"contenuto" proprietà. Questa operazione aiuta ad aggiungere il contenuto all'elemento selezionato. Inoltre, il "Schermo"La proprietà può essere utilizzata per nascondere il contenuto esistente.
Diamo un'occhiata all'esempio seguente per capire come modificare il contenuto in CSS usando il :: After Selector.
Esempio
Ecco la nostra pagina HTML con il testo "Buongiorno!!!". Sostituiamo il contenuto aggiunto:
Attualmente abbiamo aggiunto un " Buongiorno!!! Nel nostro file CSS, ora useremo il :: After Selector come "corpo :: dopo"E usa il"contenuto"Proprietà con il valore"Buonasera"All'interno della sua definizione. Di conseguenza, il selettore CSS posizionerà il testo subito dopo il testo scritto. Infine, nascondi il testo esistente usando il "Schermo"Proprietà e impostare il suo valore su"nessuno": Ora, salva il tuo file HTML e aprilo semplice sul browser o usa “Live Server"Per lo stesso scopo: Come puoi vedere, il contenuto è stato modificato con successo utilizzando il selettore :: After CSS: Metodo 2: usa :: prima del selettore con proprietà del contenuto per modificare il contenuto in CSS In CSS, il “::Prima"Il selettore viene utilizzato per far apparire il contenuto proprio prima del contenuto esistente di un elemento. Può essere usato in combinazione con "contenuto"Proprietà per aggiungere nuovi contenuti all'elemento selezionato. Esempio Specifica il :: prima del selettore subito dopo il corpo come "corpo :: prima". Questo posizionerà i nuovi contenuti prima del contenuto esistente. Si noti che tutte le altre proprietà rimangono le stesse dell'esempio precedente: Produzione Abbiamo spiegato diversi metodi per modificare il contenuto in CSS. Conclusione Per cambiare il contenuto, "::Dopo" E "::Prima"I selettori CSS sono usati con il"contenuto" proprietà. Nel primo approccio, il testo specificato viene aggiunto dopo l'elemento selezionato, mentre il secondo selettore CSS funziona al contrario. Inoltre, il "Schermo"La proprietà può essere utilizzata per nascondere il contenuto esistente di un elemento. Ecco come il contenuto viene modificato completamente in CSS. Abbiamo coperto i due metodi per cambiare il contenuto in CSS.