[HTML5] HTML/CSS 2일차

HTML / CSS

✔ Preview

하이퍼링크 태그, 이미지 태그, 태그 내 emoji나 blank space 삽입

 

---

✍ Tag Summary

Anchor (a)

: <a> 태그는 같은 페이지 내의 특정 위치나 다른 url로 연결할 수 있는 하이퍼링크 태그이다. 

<a href="https://geniemon0104.tistory.com/">내 티스토리로 가기</a>
<a href="https://geniemon0104.tistory.com/" target="_blank">내 티스토리를 새 탭으로 띄워서 가기</a>

 

 

Horizontal Rule (hr)

: <hr> 태그는 페이지 크기에 맞추어 수평선(가로선)을 그어주는 태그이다.

<h1>제목 아래에 가로선을 넣고싶은데...</h1>
<hr>

 

 

Image (img)

: <img> 태그는 문서에 이미지를 넣을 때 사용되는 태그이며 src를 이용해 반드시 파일 경로를 지정해주어야 한다.

<img src="img1.jpg" width="400" alt="이미지1 입니다.">

* alt 속성의 경우, img1.jpg 파일이 다른 위치에 있거나 존재하지 않아 파일이 깨지게 되면 나타나게 될 문구를 적어주는 태그이다 (이미지의 대체 텍스트 설명)

 

 

HTML Entities

: HTML에서 별도로 정의되어 있는 예약어를 본래의 의미로 사용하기 위해 만든 문자셋.

• 띄어쓰기(Non-breaking Space) : &nbsp
• < : &lt;
• > : &gt;
• & : &amp;
• " : &quot; 
• ' : &apos;

* emoji의 경우, 아래 사이트를 참고해서 작성

https://www.w3schools.com/charsets/ref_emoji.asp

HTML Emoji Reference