Jak wymienić tekst na CSS?

Jak wymienić tekst na CSS?
Zastąpienie tekstu odbywa się głównie w językach programowania po stronie serwera, w tym PHP. Jednak programiści od czasu do czasu pracują pod pewnymi ograniczeniami i nie mogą zastąpić tekstu na serwerze. W takich scenariuszach zastąpienie tekstu za pomocą CSS jest dobrym wyborem. Jeśli użytkownik chce zastąpić tekst, CSS ”treść„Własność można wykorzystać. Ponadto możesz również stylizować wymieniony tekst za pomocą CSS.

Ten samouczek zbada:

  • Jak dodać tekst w HTML?
  • Jak wymienić tekst na CSS?

Jak dodać tekst w HTML?

W HTML tekst można dodawać na różne sposoby, na przykład element nagłówka „

”Służy do dodawania tekstu nagłówka lub„

Przejrzyj podane instrukcje, aby dodać tekst do dokumentu HTML.

Krok 1: Utwórz pojemnik „Div”

Zrób element „div” za pomocą „”Tag. Ponadto wstaw „„ID”Atrybut, aby przydzielić określoną nazwę elementowi.

Krok 2: Dodaj tekst

Następnie użyj tagu akapitowego „

”I przypisz to„klasa" atrybut. Następnie osadziłem trochę tekstu między tagami akapitu:


Linuxhint to jedna z najlepszych witryn samouczka. (Stary tekst)


Można zauważyć, że tekst został pomyślnie dodany:

Krok 3: Element „Div” stylu

Teraz skorzystaj z „ID„Selektor i id”#Main-Div„Aby uzyskać dostęp do elementu„ Div ”. Następnie zastosuj poniżej wyświetlone właściwości:

#Main-Div
Border: 3px Solid Black;
kolor tła: RGB (179, 233, 250);
Margines: 50px;
Styl czcionki: Kursywa;

Tutaj:

  • "granica„Właściwość służy do zdefiniowania granicy wokół elementu.
  • "kolor tła„Właściwość przydziela kolor na odwrocie elementu.
  • "margines”Określa przestrzeń wokół granicy elementu.
  • "styl czcionki”Określa konkretny styl tekstu jako„italski”:

Jak wymienić tekst na CSS?

Aby zastąpić tekst CSS, najpierw ukryj poprzedni tekst, wykorzystując „widoczność" nieruchomość. Następnie osadziłem tekst za pomocą „treść" nieruchomość.

Aby wymienić tekst w CSS, wypróbuj podaną procedurę.

Krok 1: Ukryj stary tekst

Najpierw uzyskaj dostęp do elementu, w którym osadziłeś tekst. W naszym scenariuszu uzyskamy dostęp do „

„Element według nazwy klasy„.Wymień-tekst". Następnie zastosuj „pozycja" I "widoczność" nieruchomości:

.Tekst zamień
Pozycja: względny;
Widoczność: ukryta;

Tutaj "pozycja”Określa, że ​​element zostanie ustawiony w stosunku do jego normalnej pozycji na stronie internetowej i„widoczność„Właściwość służy do ukrycia elementu.

Wyjście

Krok 2: Wymień tekst

Uzyskaj dostęp do tekstu „

”Tag według klasy„.Wymień-tekst". Użyj także pseudoklicznej „:Po”, Który wstawia tekst po zawartości wybranego elementu:

.Wymień-tekst: po
Treść: „Linuxhint jest organizacją z brytyjską. (Nowy tekst) ”;
Pozycja: absolutna;
Widoczność: widoczna;
po lewej: 0;
TOP: 0;

Opis wyżej wymienionych nieruchomości jest następujący:

  • "treść„Właściwość jest wykorzystywana do dodania zawartości w wybranym elemencie.
  • "lewy„W CSS służy do przydzielenia poziomej pozycji elementu, który jest ustawiony.
  • "szczyt”Określa pozycję w górnej stronie elementu.
  • "widoczność”Jest ustawiony jako„widoczny„Aby pokazać zawartość wewnątrz Div.

Wyjście

Można zauważyć, że tekst został pomyślnie zastąpiony za pomocą CSS.

Wniosek

Aby zastąpić tekst CSS, najpierw dodaj tekst, wykorzystując „

”Tag. Następnie uzyskaj dostęp do „

”Element w CSS za pomocą przypisanej klasy i zastosuj„widoczność„Własność o wartości”ukryty„Aby ukryć stary tekst. Następnie użyj pseudoklasy „:Po”Z przypisaną klasą„

" element. Wymień tekst z pomocą „treść„Własność i ponownie ustaw„widoczność„Nieruchomość jako„widoczny". Ten post wyjaśnił metodę zastąpienia tekstu HTML za pomocą CSS.