300x250
h1~h6 태그
<!DOCTYPE html>
<html>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
</html>
h태그는 일반적인 제목을 작성할 때 사용합니다.
h뒤에 붙은 숫자로 제목의 크기를 나타내고 1이 가장 크고 6이 가장 작습니다.
p 태그
<!DOCTYPE html>
<html>
<body>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>
일반적인 문자를 작성할 때 사용하는 태그입니다.
a 태그
<!DOCTYPE html>
<html>
<body>
<h2>HTML Links</h2>
<p>HTML links are defined with the a tag:</p>
<a href="https://www.w3schools.com">This is a link</a>
</body>
</html>
가장 많이 사용되는 링크 태그입니다.
지금껏 보지 못한 태그 안 href라는 것을 볼 수 있을 겁니다.
이것을 태그 속성(attibute)이라고 합니다.
href="" < 큰따옴표 사이에 오는 문자는 url 혹은 파일 경로가 될 수 있겠습니다.
a태그의 This is a link를 클릭하면 href의 속성 값으로 이동되는 것을 확인할 수 있습니다.
img 태그
<!DOCTYPE html>
<html>
<body>
<h2>HTML Images</h2>
<p>HTML images are defined with the img tag:</p>
<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">
</body>
</html>
img태그는 이미지 파일을 화면에 나타낼 때 사용됩니다.
설명
src 속성 : 이미지 파일 url 혹은 파일 경로를 입력합니다.
alt 속성 : 이미지 파일을 불러오지 못하거나 시각장애인을 위해 사용되는 이미지 설명 속성입니다.
width 속성 : 이미지의 가로 크기를 픽셀 단위로 지정합니다.
height 속성 : 이미지의 세로 크기를 픽셀 단위로 지정합니다.
300x250
'IT > IT 인터넷' 카테고리의 다른 글
| CSS Flexbox로 간단하고 효율적인 레이아웃 만들기 (0) | 2025.01.17 |
|---|---|
| HTML과 CSS로 개인 프로필 페이지 만들기 (0) | 2025.01.17 |
| 웹 페이지 언어설정과 툴팁 [lang속성, title속성] (0) | 2021.09.22 |
| HTML 코드작성 (0) | 2021.09.20 |
| HTML 기본 (1) | 2021.09.20 |