HTML & CSS 공부 정리 2일차(21.01.05)

JinJinJJara·2021년 1월 5일

HTML & CSS 공부

목록 보기
2/5

About HTML

HTML의 특징

1. Error을 보여주지 않는다

HTML은 content를 보여주는 것을 최우선으로 하기 때문에 코드가 규칙에 맞지 않게 작성되어도, html 없이 작성되어도 error을 내지 않는다.
아래와 같이 실제 없는 tag를 활용해도 browser에는 결과물이 반영된다.

<fruit> 난 오이가 싫어</fruit>

2. Tag <></>

HTML의 목적은 browser에게 content에 대해 알려 주는 것이다.
그를 위해 tag를 사용한다.
Tag를 통해 tag안에 있는 content가 tag에 해당하는 content라는 것을 알려준다.
Tag는 대다수의 경우 </>로 닫아주어야 한다.

<h1>Waves Like</h1>
<h2>Jazzyfact</h2>
  • H1~H6
    제목을 지칭하는 tag로 h1이 제일 크고 h6이 제일 작다

  • ul (unordered list), ol (ordered list), li (list item)
    위의 세가지 tag는 목록을 만들 때 사용하는 tag로 ul은 목록앞에 점이 있는, ol은 목록앞에 숫자가 있는 list를 말하고 li는 list 안에 들어가는 item들을 지칭한다.

<ol>
    <li>journey</li>
    <li>cross the street</li>
</ol>
<ul>
    <li>Life in Color</li>
    <li>Break</li>
    <li>Dali, Van, Picasso</li>
</ul>
  • a (anchor)
    a는 link, 즉 다른 사이트를 연결해주는 tag이다.
    어느 사이트로 연결하는지 지정해주는 attribute로 href가 쓰인다.
<a href='https://google.com'>To google</a>
  • img (image)
    img는 image를 넣는 tag이다. 특징은 closing tag가 없는 self-closing tag라는 것이다.
<img src='image link'>

3. Attribute

Attribute는 tag안에 추가하는 부가적인 정보이다.
밑의 target은 link를 클릭 했을 때 다른 창에서 열지, 같은 창에서 열지 결정하는 attribute이다.

<a href='https://google.com' target='_blank'>To google</a>

target은 링크를 새창에 열어줄지 기존 창에 덮어 띄울지 결정을 한다!
무수히 많은 종류의 tag와 attribute가 있으니 공부를 열심히 해야한다 🧐🧐🧐

profile
갈팡질팡 공부하는 중입니다

0개의 댓글