텍스트 아래의 줄이 표준 밑줄이 아닌 점선이되도록 HTML 텍스트에 어떻게 밑줄을 긋나요? 가급적이면 별도의 CSS 파일을 사용하지 않고이 작업을 수행하고 싶습니다. 저는 html의 초보자입니다.
텍스트 아래의 줄이 표준 밑줄이 아닌 점선이되도록 HTML 텍스트에 어떻게 밑줄을 긋나요? 가급적이면 별도의 CSS 파일을 사용하지 않고이 작업을 수행하고 싶습니다. 저는 html의 초보자입니다.
답변:
CSS 없이는 불가능합니다. 사실, <u>
태그는 단순히 text-decoration:underline
브라우저의 내장 CSS를 사용하여 텍스트에 추가 하는 것입니다.
수행 할 수있는 작업은 다음과 같습니다.
<html>
<head>
<!-- Other head stuff here, like title or meta -->
<style type="text/css">
u {
border-bottom: 1px dotted #000;
text-decoration: none;
}
</style>
</head>
<!-- Body, content here -->
</html>
<head>
요소하는 추가 <style>
태그 (나는 내 대답을 편집 한)
dotted
대신dashed
다음 CSS 코드 사용 ...
text-decoration:underline;
text-decoration-style: dotted;
border
을 사용 padding
하면 텍스트 외부에 배치 되므로 텍스트에서 멀어집니다.
text-decoration: underline #000 dotted;
첫 번째 속성은 라인이고 두 번째는 색상이고 세 번째는 스타일입니다.
CSS가 없으면 기본적으로 이미지 태그를 사용해야합니다. 기본적으로 텍스트의 이미지를 만들고 밑줄을 추가하십시오. 이는 기본적으로 화면 판독기에 페이지가 쓸모 없다는 것을 의미합니다.
CSS를 사용하면 간단합니다.
HTML :
<u class="dotted">I like cheese</u>
CSS :
u.dotted{
border-bottom: 1px dashed #999;
text-decoration: none;
}
예제 페이지
<!DOCTYPE HTML>
<html>
<head>
<style>
u.dotted{
border-bottom: 1px dashed #999;
text-decoration: none;
}
</style>
</head>
<body>
<u class="dotted">I like cheese</u>
</body>
</html>
HTML5 요소는 점선 밑줄을 줄 수 있으므로 텍스트 아래에는 일반 밑줄이 아닌 점선이 있습니다. 그리고 title 속성은 사용자가 요소 위에 커서를 놓으면 도구 설명을 만듭니다.
참고 : 점선 테두리 / 밑줄은 기본적으로 Firefox 및 Opera에 표시되지만 IE8, Safari 및 Chrome에는 CSS 줄이 필요합니다.
<abbr title="Hyper Text Markup Language">HTML</abbr>
콘텐츠에 한 줄 이상이있는 경우 아래쪽 테두리를 추가해도 도움이되지 않습니다. 이 경우에는 사용해야합니다.
text-decoration: underline;
text-decoration-style: dotted;
텍스트와 줄 사이에 더 많은 숨을 쉴 수있는 공간을 원하면 다음을 사용하십시오.
text-underline-position: under;
@epascarello 의 답변 형식을 다시 지정했습니다 .
u.dotted {
border-bottom: 1px dashed #999;
text-decoration: none;
}
<!DOCTYPE html>
<u class="dotted">I like cheese</u>
이 방법을 시도해 볼 수 있습니다.
<h2 style="text-decoration: underline; text-underline-position: under; text-decoration-style: dotted">Hello World!</h2>
text-underline-position: under;
당신 이 없어도 여전히 점선 밑줄이 표시되지만이 속성은 더 많은 호흡 공간을 제공합니다.
이는 별도의 CSS 파일이나 태그를 사용하지 않고 인라인 스타일을 사용하여 HTML 파일 안에 모든 것을 포함하고 싶다고 가정합니다.
CSS 없이는 불가능하지 않습니다. 예를 들어 목록 항목으로 :
<li style="border-bottom: 1px dashed"><!--content --></li>
<style>
. 인라인 스타일은 매우 드물게 사용해야합니다.