TIL no.2-HTML

두번째 til이다

괜히 다른블로그에 대충 써놓아서 두번 일하는 느낌이지만 기분좋게 써보겠다 :)............

semantic

html에서 기본적으로 맥락, 단락의 구분을 위해 사용하는 방식들이 많이 존재한다.
h1~h6라거나 (글자크기 마다 의미가 있음. 기억 못하겠으니 사용할때 검색해야징)
em과 같은 이탤릭 강조체
솔직히 다 외울 자신도 없고 그러고 싶지도 않고 구글을 믿어야겠다.

<h1>~<h6>: 글자 크기 마다 제목 주제 소주제 내용 등이 존재하나 기억 못하겠음
<em></em> 과 같은 강조체용 semantic tag
<p></p>와 같은 paragraph의 약자인 것 같은데 단락을 나눠 주는 것.

list

list로는 ul(unorderd list)와 ol(ordered list)가 있다.
문자 그대로 순서 없고 순서 있는 것. 아래와 같이 세부에 li tag를 사용하여 나열한다.

<ul>
  <li>milk</li>
  <li>eggs</li>
  <li>bread</li>
  <li>hummus</li>
</ul>

<ol>
  <li>Drive to the end of the road</li>
  <li>Turn right</li>
  <li>Go straight across the first two roundabouts</li>
  <li>Turn left at the third roundabout</li>
  <li>The school is on your right, 300 meters up the road</li>
</ol>

Hyper link

우리가 원하는 다른 resource들과 연결해주는 방식이라고 한다.
Tip)URL은 html, text, image, video, audio 등 웹상에 존재하는 어느것이든
연결 할 수 있다.
URL= Uniform Resource Locator
ex) BBC Website

아래과 같이 사용 가능하다.

<p>This is
    <a href="https://programmingwihtclothes.tistory.com/" title= "Best blog" target=_blank>my blog</a>
</p>

설명목록

dl:Description lists

dt:Description term

dd:Description definition

위 태그 이용하여 리스트의 용어 정의 질문 및 답변과 같은 항목의 설명 표시 등을 나타낸다.

(위에서 아래로 하위 항목 나타냄)

<dl>
  <dt>aside</dt>

     <dd>
   In drama, where a character shares a comment only with the audience for humorous or dramatic effect. 
     </dd>
     <dd>
   In writing, a section of content that is related to the current topic. 
     </dd>
</dl>