[Html] HTML 속성, HTML 줄바꿈 태그 종류

HTML 속성

<!-- HTML 링크  -->
<a href="https://www.w3schools.com">This is a link</a>

<!-- HTML 이미지 : alt는 이미지가 표시되지 않을 경우 대체 할 텍스트 -->
<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">

<!-- 빈 HTML 요소 -->
<br>
    
<!-- 스타일 속성 : 색상, 글꼴, 크기 등과 같은 요소에 스타일을 추가하는 데 사용 -->
<p style="color:red;">This is a red paragraph.</p>
    
<!-- 제목 속성 : 요소 위에 마우스를 올리면 제목 속성의 값이 도구 설명으로 표시 -->
<p title="I'm a tooltip">This is a paragraph.</p>

 

큰 따옴표? 작은 따옴표?

속성 값을 묶는 큰따옴표는 HTML에서 가장 일반적이지만 작은따옴표도 사용할 수 있습니다.

일부 상황에서는 속성 값 자체에 큰따옴표가 포함되어 있으면 작은따옴표를 사용해야 합니다.

<p title='John "ShotGun" Nelson'>
<p title="John 'ShotGun' Nelson">

 

 

HTML 제목

HTML 제목은 웹페이지에 표시하려는 제목이나 부제목입니다.

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

참고: 브라우저는 제목 앞뒤에 공백(여백)을 자동으로 추가합니다.

참고: HTML 제목은 제목에만 사용하세요. 텍스트를 크게 또는 굵게 표시하기 위해 제목을 사용하지 마세요.

 

HTML 단락

단락은 항상 새 줄에서 시작하며 일반적으로 텍스트 블록입니다.

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

참고: 단락은 항상 새 줄에서 시작되며 브라우저는 단락 앞뒤에 공백(여백)을 자동으로 추가합니다.

 

HTML 수평 규칙

태그 <hr>는 HTML 페이지에서 주제 구분을 정의하며 가장 자주 수평 규칙으로 표시됩니다.

요소 <hr>는 HTML 페이지에서 콘텐츠를 분리하거나 변경 사항을 정의하는 데 사용됩니다.

<h1>This is heading 1</h1>
<p>This is some text.</p>
<hr>
<h2>This is heading 2</h2>
<p>This is some other text.</p>
<hr>

 

HTML 줄 바꿈

HTML <br>요소는 줄 바꿈을 정의합니다.

<br>새 단락을 시작하지 않고 줄바꿈(새 줄)을 원할 경우 사용하세요 .

<p>This is<br>a paragraph<br>with line breaks.</p>

 

 

HTML <pre> 요소

HTML <pre>요소는 미리 서식이 지정된 텍스트를 정의합니다.

요소 내부의 텍스트 <pre>는 고정 너비 글꼴(일반적으로 Courier)로 표시되며 공백과 줄 바꿈을 모두 유지합니다.

<pre>
  My Bonnie lies over the ocean.

  My Bonnie lies over the sea.

  My Bonnie lies over the ocean.

  Oh, bring back my Bonnie to me.
</pre>