html/css 독학하기

코스 전체목록

닫기

u

설명

Obsolete 폐지됨

The HTML Underline Element (<u>) renders text with an underline, a line under the baseline of its content.

<u>요소는 내용 밑에 밑줄을 긋는다.

Usage Note: As all purely styling element, <u> has been deprecated in HTML 4 and XHTML 1, and obsoleted in HTML5. Use a <span> element, or another semantically appropriate element, and style it with the CSS text-decoration property, with the underline value.

사용시 참고: 모양을 꾸미기만 하는 다른 요소드로가 마찬가지로 <u>요소도 HTML 4와 XHTML 1에서 폐지예정되었고, HTML5에서 폐지된다. 따라서 <u> 요소 대신에 <span>을 쓰거나, 그 밖에 모양을 직접 꾸미지 않고 표현의 의도를 알려주는 요소를 사용하자. 그리고 그 요소에 CSS로 text-decoration를 underline으로 하면 내용의 밑에 밑줄을 표시할 수 있다.

속성

This element has no other attributes than the global attributes, common to all elements.
<u> 요소는 공통의 전역 속성 외 다른 속성은 가지지 않는다.
 

예제

<u>오늘의 특별요리</u>: 연어<br />
<p>그 <u>모든 것</u>이  <u>Dive into Python</u>에 설명되어 있다.

오늘의 특별요리: 연어
모든 것Dive into Python에 설명되어 있다.

이렇게 <u> 요소를 직접하는 것은 지금은 되지만 앞으로는 아니다.
should instead be
대신 이렇게 써야 한다.

<span style="text-decoration:underline;">오늘의 특별요리</span>: 연어
<p>그 <em>모든 것</em>이  <cite>Dive into Python</cite>에 설명되어 있다.

오늘의 특별요리: 연어
모든 것Dive into Python에 설명되어 있다.

분명하게 밑줄을 긋고 싶은 것이라면 <span> 요소를 대신 사용하고 style을 text-decoration:underline 지정한다.
CSS can be used to style those elements exactly the same, however.
또는 구체적으로 밑줄을 그으라고 하기보다는 표현의 의도에 촛점을 맞춰서 <em>으로 '모든 것'이 강조되어야 한다는 것을 나타내고, <cite>로 'Dive into Python'이라는 문구를 인용하고 있음을 보인다. 이렇게 하면 위 결과처럼 때에 따라 밑줄이 그어지지 않은 형태일 수도 있지만, 이는 이들의 style 속성을 어떻게 지정하느냐에 따라 얼마든지 밑줄을 그을 수 있으므로 CSS를 사용하는 방향으로 해야 한다.

DOM Interface

This element implements the HTMLElement interface.

<u> 엘리먼트는 HTMLElement 인터페이스를 구현한다.

참고

댓글

댓글 본문
  1. engfordev
    ^.^ 잘 해주셨습니다!!
    오늘의 요리는 연어이군요~!
    대화보기
    • Sang Young Lee
      예제에 대해서 번호를 붙이지는 않았지만, 옛날 형태와 권장 형태를 분리해서 한꺼번에 설명하는 방법으로 고쳤습니다. 그러면서 예문도 번역해 봤습니다.
    • Sang Young Lee
      밑줄만 먹네요. 참고로 <u>처럼 보이게 하기 위해서 실제로는 &lt;u&gt; 라고 입력했습니다.
      대화보기
      • engfordev
        아.. 태그로 쓴 부분이 다 없어져버렸군요 OTL
        훔.. 그런데 제가 말씀드린 거 다 이해하셨죠? ㅋㅋ
        대화보기
        • Sang Young Lee
          댓글이 아마도 태그를 허용하는 모양입니다. 밑줄 이탤릭 굵게 그러니 태그 자체가 보이게 하려면 <u> 이렇게 해야 하지 않을 까 싶습니다. 이게 어떻게 보일지 저도 궁금한데요....
          대화보기
          • engfordev
            제가 단 댓글에 다 밑줄이 그어져버린 것 말씀이신가요? ㅎㅎ
            저도 쓰고 나서 어리둥절 했는데요, 대체 어찌된 조화인지를 모르겠어요 ^^;
            대화보기
            • Sang Young Lee
              댓글에 태그를 사용했는데 아마도 이들이 모두 묻혀 버린 것이 아닌가 짐작해 봅니다. 잠시 잠깐씩 이건 뭐지 해야 한다는.... ^^;
            • engfordev
              grizlupo님>> 우왓~ 금새 해주셨네요? ^^아주 잘 해주셨습니다~~노란색 부분 표시하신 부분에 대해서 의견을 몇 가지 드릴게요 :)
              #a line under the baseline of its content
              내용의 밑에 줄을 표시하는 것이니, 번역하신 표현만 두어도 괜찮을 듯요~
              #구체적인 모양이 아니라 표현의 의도를 표시하는 엘리먼트
              요소 대신에 이나 다른 요소(모양을 직접 꾸며주는게 아니라 표현의 의도를 알려주는 요소)를 사용하자. 그리고 이 요소의 CSS에서 text-decoration 속성값을 underline으로 해주면 밑줄을 표현할 수 있다.
              여기서 another semantically approapriate element는 이런 의미일까요?일반인의 시선에서 좀 끄적여둡니다.
              그 블럭을 지정하는, p나 ol 등등.. 여튼 취지는 이런 것이 아닌가 해요. 본문에다가 바로 모양을 지정하는 태그를 쓰지 말고, 모양은 CSS로 처리해라..
              요 부분을 한국어로 어떻게 표현해야 할지는 저도 좀더 고민해볼게요. ^^https://docs.google.com/spread...일단 요기에 추가해두었습니다.
              #This element has no other attributes than the global attributes, common to all elements.모든 요소에서 가지고 있는 전역 속성 외에 요소가 가지는 특별한 다른 속성은 없다.
              #예제부분
              예제도 한국어로 써주면 어떨까요? :)내용은 자유롭게 바꾸셔도 좋아요~
              # should instead be
              요 부분은.. 지금 두 부분을 제시하고 있잖아요?

              All of that is explained in Dive into Python.이렇게 쓰는 대신에..
              All of that is explained in Dive into Python.이렇게 써야 한다..
              이런 의미인 것 같아요.
              훔.. 이 부분은 각 예제코드에 번호 같은 것을 달아도 좋을 것 같네요..
              예제(1), 예제(2), 예제(3) 이렇게 각각의 예제 위에 달아준 후..
              예제(2) 대신에 예제(3)처럼 써야 한다. 결국 모양은 똑같지만 표현하는 방식이 다르다..
              # All of that is explained in Dive into Python. <- 요 부분은 예제(3)이 출력된 결과이고요. CSS can be used to style those elements exactly the same, however.
              저는 이렇게 해보았는데요 .. >>예제(2) 대신에 예제(3)처럼 써주면 이런 결과가 나온다. 예제(2)에서와는 다르게 아무런 밑줄 표시가 되어 있지 않다. 그러나 여기에다가 CSS를 사용하면 예제(2)의 모양처럼 똑같이 꾸며줄 수 있다.
              grizlupo님의 설명이 더 좋은 것 같은데요? 다만 중간에 약간 추가하고 말을 조금 바꿔본 버전입니다~
              예제(3)에서 보면 로 밑줄을 긋지 않고 을 사용해서 All을 강조하고 싶다는 의도를 나타내고 있다. 그리고 로 Dive into Python라는 문구를 인용하고 있음을 보인다. 비록 아직은 밑줄이 그어져 있지 않지만 여기에 CSS로 이들의 style 속성을 어떻게 지정하느냐에 따라 밑줄을 그을 수도 있고, 전혀 다른 모양으로도 만들 수 있다.
            버전 관리
            김나솔
            현재 버전
            선택 버전
            graphittie 자세히 보기