HTML & CSS

HTML 텍스트요소 (3) 문자열 서식

yul_S2 2023. 1. 15. 23:51
반응형

Text Formatting

 

코드

<html>

<head>
<title>문자열서식</title>
</head>

<body>

<h1>bold와strong</h1>
<!--텍스트를 굵게 표시를 해야 할 경우에는 <b>(bold text)태그나 <strong>태그를 사용한다.-->
<p><b>이 문장은 굵게 표시합니다.</b>은 단순히 글씨가 굵은 부분이에요!</p>
<p><strong>이 문장은 강조하여 표시합니다.</strong></p>
<hr>

<h1>i와em</h1>
<!--이탤릭체를 표시를 해야 할 경우에는 <i>(italic text)태그나 <em>(emphasized text)태그를 사용한다.-->
<p><i>이 문장은 이테릭체입니다.</i></p>
<p><em>이 문장은 강조합니다.</em></p>
<hr>

<h1>마킹 mark</h1>
<!--<mark> 태그는 텍스트에 하이라이팅(highlighting)을 해준다-->
<p>이 부분은 <mark>하이라이팅</mark> 됩니다 </p>
<hr>

<h1>추가 ins</h1>
<!--<ins>(insert)태그는 텍스트 밑줄을 쳐서 텍스트를 삽입한 거처럼 해준다.-->
<p>내가 좋아하는 과일을 <ins>바나나</ins> 사과입니다.</p>
<hr>

<h1>삭제 del</h1>
<!--<del>(delete)태그는 텍스트에 줄을 쳐서 텍스트를 지운 거처럼 해준다.-->
<p>내가 좋아하는 과일을 <del>바나나</del> 사과입니다.</p>
<hr>


<h1>위첨자 sup</h1>
<!--위첨자는 <sup>(superscript)태그를 사용한다.-->
<p>X<sup>2</sup> + Y<sup>3</sup> = Z</p>
<hr>

<h1>아래첨자 sub</h1>
<!--아래첨자는 <sub>(subscript)태그를 사용한다.-->
<p>물을 나타내는 화학식은 H<sub>2</sub>O 입니다.</p>
<hr>
</body>
</html>

 

▲ 결과

 

1. bold & strong

텍스트를 굵게 표시를 해야 할 경우에는 (bold text)태그나 태그를 사용한다.

 

2. i와 em

이탤릭체를 표시를 해야 할 경우에는 <i>(italic text)태그나 <em>(emphasized text)태그를 사용한다.

 

3. 마킹

<mark> 태그는 텍스트에 하이라이팅(highlighting)을 해준다

 

4. 추가

<ins>(insert)태그는 텍스트 밑줄을 쳐서 텍스트를 삽입한 거처럼 해준다

 

5. 삭제

<del>(delete)태그는 텍스트에 줄을 쳐서 텍스트를 지운 거처럼 해준다.

 

6. 위첨자

위첨자는 <sup>(superscript)태그를 사용한다.

 

7. 아래첨자

아래첨자는 <sub>(subscript)태그를 사용한다.

 

 

반응형