Jak podkreślać tekst w HTML

Autor: Clyde Lopez
Data Utworzenia: 19 Lipiec 2021
Data Aktualizacji: 1 Lipiec 2024
Anonim
Cross Out Effect on Text / Strikethrough Text | HTML and CSS
Wideo: Cross Out Effect on Text / Strikethrough Text | HTML and CSS

Zawartość

Starsza metoda podkreślenia HTML polega na użyciu znaczników u> / u>, ale teraz używa nowoczesnej metody opartej na CSS. Podkreślanie jest uważane za zły sposób na zwrócenie uwagi na tekst, ponieważ łatwo jest pomylić podkreślony tekst z linkiem.

Kroki

Metoda 1 z 2: Nowoczesna metoda

  1. 1 Użyj właściwości „text-decoration” w CSS. Obecnie znacznik u> nie jest używany do podkreślania tekstu.
    • Dodając tę ​​właściwość, nie musisz zmieniać kodu w przyszłości, gdy stare tagi zostaną wycofane.
  2. 2 Użyj tagu span>, aby podkreślić określony fragment tekstu. Wprowadź znacznik początkowy wraz z właściwością „text-decoration” przed tekstem, który chcesz podkreślić. Na końcu tekstu wpisz tag zamykający / span>.

    span style = "text-decoration: underline;"> Ten tekst zostanie podkreślony. / span>

  3. 3 Określ elementy HTML w sekcji style>, aby ułatwić podkreślenie. Można to również zrobić za pomocą arkusza stylów CSS. Na przykład, aby podkreślić wszystkie nagłówki poziomu 3, dodaj następujący kod do sekcji „style”:

    html> głowa> styl> h3 {tekst-dekoracja: podkreślenie; } / style> / head> body> h3> Ten nagłówek będzie podkreślony / h3> / body> / html>

  4. 4 Utwórz klasę CSS, aby szybko podkreślić tekst. Możesz utworzyć klasy w arkuszu stylów lub w sekcji style>, aby wywołać je później. Klasa może mieć dowolną nazwę.

    html> head> style> .underline {tekst-dekoracja: podkreślenie; } / style> / head> body> Użyj tej klasy do div> szybkie podkreślenie / div> różne div> elementy / div> / body> / html>

  5. 5 Pomyśl o innych sposobach wyróżniania tekstu. Zalecamy unikanie podkreślania, aby uniknąć dezorientacji użytkowników. Lepiej użyć znacznika em>, aby tekst był kursywą. Użyj CSS, aby dodać inne opcje stylizacji do tego tagu.

    html> głowa> styl> em {kolor: czerwony; } / style> / head> body> Wszystko w elemencie "em" będzie oznaczone kursywą (domyślnie) i pomalowane na czerwono / em> dzięki dodatkowym opcjom stylu. / body> / html>

Metoda 2 z 2: starsza metoda

  1. 1 Unikaj używania starych tagów u> / u>. Są przestarzałe, co oznacza, że ​​te tagi nadal działają, ale są zniechęcane lub zniechęcane. Dzieje się tak, ponieważ HTML nie jest przeznaczony do dostosowywania stylu treści. Znacznik u> nadal działa, ale musi reprezentować tekst inny niż inny tekst, na przykład błędnie napisane słowa lub chińskie nazwy własne.
  2. 2 Użyj znaczników u> / u> do podkreślenia elementów (tylko do celów demonstracyjnych). Nie ma prawie jednego przypadku, w którym musisz użyć tych tagów. Być może trzeba będzie edytować starą witrynę, więc najlepiej jest wiedzieć, jakie są tagi.

    html> body> Stary tag HTML u> umożliwiał szybkie podkreślenie / u> elementów, ale jeśli dotykano innych elementów stylizacji, robiło się chaotycznie. Dlatego obecnie używają elementu CSS „text-decoration” do podkreślenia. / body> / html>

Porady

  • Prawie zawsze istnieje lepszy sposób na podkreślenie treści na stronie internetowej niż podkreślanie. Podkreślanie może dezorientować użytkowników. Zastanów się, jak wyróżnić tekst za pomocą CSS.