HTML - 텍스트 입력시에 사용하는 태그들로 독후감 써보기

김정원·2022년 1월 13일
0

글의 크기를 조절하는 h 태그

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    
    <title>Document</title>
</head>
<body>
    <h1> 1</h1>   <!-- 자동  바뀜 --!>
    <h2>2</h2>
    <h3>3</h3>
    <h4>4</h4>
    <h5>5</h5>
    <h6>6</h6>
</body>
</html>
Document

1

2

3

4

5
6

글의 제목에 활용되는 h 태그 입니다.
위와 같이 별도의 개행을 하지 않아도 h의 태그가 마치게 되면 자동으로 개행이 되는 것을 볼 수 있습니다.

blockquote - 인용문 태그

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    
    <title>Document</title>
</head>
<body>
    <h1> 인용문 </h1> 
    <blockquote> 
    	인용문 태그는 blockquote 태그를 사용합니다. 	
    </blockquote>
    
</body>
</html>
Document

인용문

인용문 태그는 blockquote 태그를 사용합니다.

텍스트를 꾸며주는 strong ,b, em, i 태그

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    
    <title>Document</title>
</head>
<body>
   <strong> strong 태그 </strong> <br>
   <b> b 태그 </b> <br>
   <em> em 태그 </em> <br>
   <i> i태그 </i> <br>
    
   <strong> <em> strong + em 태그 </em> </strong> 
</body>
</html>
Document strong 태그
b 태그
em 태그
i태그
strong + em 태그

글자의 굵기를 강조하는 텍스트는 strong 과 b를 사용합니다.
위와같이 큰 차이는 없지만 웹사이트에서 화면 낭독기는 strong 태그를 활용한 부분을 강조해 읽어주니, 정말 중요한 내용은 strong 태그를 사용하시는 걸 추천드립니다.

em 태그와 i태그는 둘 다 기울기를 보여주는 텍스트 입니다.
em은 문장중에 특별히 강조하고 싶은 부분에 사용하고
i는 용어나 관용구에 사용합니다.
마지막과 같이 strong +em 태그를 같이 접합시키면 굵기와 텍스트 기울기를 동시에 조절할 수 있습니다.

위 텍스트는 제가 '습관의 힘 ' 책을 읽고 정리한 내용중 일부인데요.
위의 텍스트로 태그들을 활용하여 정보 웹을 만들어 보겠습니다.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    
    <title>Document</title>
</head>
<body>
   <h2>습관고리 - <em> 3단계의 고리 </em></h2>>
   인간의 뇌는 <b>바깥쪽이</b> 가장 늦게 발전 되었다. <br> 
   생리적인 행위, 무의식적인 행동은 원시적 구조물이기에 뇌의 안쪽에서 행해진다 <i> 즉, 가장 기본적인 생리적인 행위를 담당하는 부분은 뇌의 안쪽. </i> <br>
   쥐도 반복되는 길 <i>(매일 다니는 길 )</i> 이 습관화과 되면 <strong>뇌의 활동이 줄어든다.</strong> <br> 
   기저핵은 패턴을 기억해서 패턴대로 행동하도록 만드는 조절장치이다. <br> 
   <strong> <em>습관이 형성되는 이유는 우리 뇌가 활동을 절약할 방법을 끊임없이 찾기 때문이다. </em></strong>
       </body>
</html>
Document

습관고리 - 3단계의 고리

>
인간의 뇌는 바깥쪽이 가장 늦게 발전 되었다.
생리적인 행위, 무의식적인 행동은 원시적 구조물이기에 뇌의 안쪽에서 행해진다 즉, 가장 기본적인 생리적인 행위를 담당하는 부분은 뇌의 안쪽.
쥐도 반복되는 길 (매일 다니는 길 ) 이 습관화과 되면 뇌의 활동이 줄어든다.
기저핵은 패턴을 기억해서 패턴대로 행동하도록 만드는 조절장치이다.
습관이 형성되는 이유는 우리 뇌가 활동을 절약할 방법을 끊임없이 찾기 때문이다.

중요한 부분은 strong태그, 저의 개인적인 견해가 들어간 부분은 i태그로 활용하여
독서부분을 정리했습니다. HTML은 텍스트 위주의 웹사이트를 제작합니다.

처음 HTML을 접하신다면, 독후감 같이 본인 스스로 꾸밀 수 있는
웹사이트를 제작해보시는 것을 추천합니다 !

profile
garden

0개의 댓글