HTML에서 텍스트에 밑줄을 긋는 방법

작가: Clyde Lopez
창조 날짜: 19 칠월 2021
업데이트 날짜: 1 칠월 2024
Anonim
HTML에서 텍스트에 밑줄을 긋는 방법
동영상: HTML에서 텍스트에 밑줄을 긋는 방법

콘텐츠

기존 HTML 밑줄 방법은 u> / u> 태그를 사용하는 것이지만 지금은 최신 CSS 기반 방법을 사용합니다. 밑줄은 밑줄이 있는 텍스트를 링크와 혼동하기 쉽기 때문에 텍스트에 주의를 끄는 나쁜 방법으로 간주됩니다.

단계

방법 1/2: 현대적인 방법

  1. 1 CSS에서 "text-decoration" 속성을 사용하세요. 현재 u> 태그는 텍스트에 밑줄을 긋는 데 사용되지 않습니다.
    • 이 속성을 추가하면 나중에 이전 태그가 폐기될 때 코드를 변경할 필요가 없습니다.
  2. 2 span> 태그를 사용하여 특정 텍스트에 밑줄을 긋습니다. 밑줄을 긋고 싶은 텍스트 앞에 "text-decoration" 속성과 함께 시작 태그를 입력합니다. 텍스트 끝에 닫는 태그 / span>을 입력합니다.

    span style = "text-decoration: underline;"> 이 텍스트는 밑줄이 그어집니다. / span>

  3. 3 style> 섹션에 HTML 요소를 지정하여 밑줄을 긋기 쉽도록 합니다. CSS 스타일시트를 사용하여 수행할 수도 있습니다. 예를 들어, 모든 수준 3 제목에 밑줄을 긋려면 "스타일" 섹션에 다음 코드를 추가합니다.

    html> head> style> h3 {텍스트 장식: 밑줄; } / style> / head> body> h3> 이 제목은 밑줄을 긋습니다 / h3> / body> / html>

  4. 4 CSS 클래스를 만들어 텍스트에 빠르게 밑줄을 긋습니다. 스타일시트 또는 style> 섹션에서 클래스를 생성하여 나중에 호출할 수 있습니다. 클래스에는 아무 이름이나 지정할 수 있습니다.

    html> head> style> .underline {텍스트 장식: 밑줄; } / style> / head> body> div> 빠른 밑줄 / div> 다양한 div> 요소 / div> / body> / html>에 이 클래스 사용

  5. 5 텍스트를 강조 표시하는 다른 방법을 생각해 보십시오. 사용자가 혼동하지 않도록 밑줄을 사용하지 않는 것이 좋습니다. em> 태그를 사용하여 텍스트를 기울임꼴로 만드는 것이 좋습니다. CSS를 사용하여 이 태그에 다른 스타일 옵션을 추가합니다.

    html> 머리> 스타일> em {색상: 빨강; } / style> / head> body> "em" 요소의 모든 항목은 기본적으로 이탤릭체로 표시되며 추가 스타일 옵션 덕분에 빨간색 / em>으로 표시됩니다. / 본문> / html>

방법 2/2: 레거시 방법

  1. 1 이전 u> / u> 태그를 사용하지 마십시오. 더 이상 사용되지 않습니다. 즉, 이러한 태그는 여전히 작동하지만 권장되지 않거나 권장되지 않습니다. HTML이 콘텐츠 스타일을 사용자 정의하기 위한 것이 아니기 때문입니다. u> 태그는 여전히 작동하지만 철자가 틀린 단어나 중국어 고유명사와 같은 다른 텍스트와 다른 텍스트를 나타내야 합니다.
  2. 2 u> / u> 태그를 사용하여 요소에 밑줄을 긋습니다(시연용). 이러한 태그를 사용해야 하는 경우는 거의 없습니다. 이전 사이트를 편집해야 할 수도 있으므로 태그가 무엇인지 알고 있는 것이 가장 좋습니다.

    html> body> 기존 HTML u> 태그를 사용하면 / u> 요소에 빠르게 밑줄을 긋는 것이 가능했지만 다른 스타일 요소를 건드리면 혼란스러워졌습니다. 따라서 요즘에는 CSS 요소인 "text-decoration"을 밑줄로 사용합니다. / 본문> / html>

  • 웹 페이지의 콘텐츠를 강조 표시하는 데 밑줄을 치는 것보다 거의 항상 더 나은 방법이 있습니다. 밑줄은 사용자를 혼란스럽게 할 수 있습니다. CSS를 사용하여 텍스트를 강조 표시하는 방법에 대해 생각해 보세요.