🐣TIL 2 - HTML 배우기(1)

2022.03.29 화요일

1. 웹페이지 알아보기

• URL : 웹상에서 문서, 이미지, 동영상 등의 자원들의 위치를 나타내는 주소, 즉 웹페이지를 찾기 위한 주소
  Ex. 구글 URL → https://www.google.co.kr/
• IP : 컴퓨터 네트워크 상에서 각 장치들의 고유 번호
• PORT : 네트워크 서비스나 특정 프로세스를 식별하는 논리 단위, 포트 번호는 IP 주소와 함께 쓰여 해당하는 프로토콜에 의해 사용된다.
  Ex. ftp://000.000.000.000:21 포트번호는 21
  
  

2. HTML Living Standard 란?

• 현재 사용 되어지는 HTML 표준 문법
• HTML 은 태그와 그의 속성으로 구성되어 있다.
• 태그를 쓸 때는 보통 여는 태그와 닫는 태그로 쓴다.
  Ex. <div> 내용 </div>
• 일부 요소는 여는 태그만 쓴다.
• 태그의 속성은 항상 여는 태그에 삽입한다.
  Ex. <a href = “주소”> 내용 </a>
  
  

3. Grouping Content

• 그룹으로 묶어서 나타낼 수 있는 HTML 태그

1) p 태그

    <p>
   Lorem ipsum dolor, sit amet consectetur 
   adipisicing elit. Obcaecati, vel adipisci.
    </p>

2) ul, li 태그

	<ul>
      <li>one</li>
      <li>two</li>
      <li>three</li>
    </ul>

3) ol 태그 - type : 숫자, 알파벳(대문자, 소문자) 등

	<ol type="i">
      <li>one</li>
      <li>two</li>
      <li>three</li>
    </ol>

4) dl, dt, dd 태그 : 주로 목록 안에 용어, 설명을 추가할 때 사용

	<dl>
      <dt>HTML</dt>
      <dd>마크업 언어 입니다.</dd>
    </dl>

5) figure, figcaption 태그

	<figure>
      <img width="auto" height="300px" src="img/flower.jpg" alt="" />
      <figcaption>관심 받고 싶어하는 아기</figcaption>
    </figure>

6) pre 태그 : HTML에 작성한 코드를 화면에 그대로 보여준다. 주로 컴퓨터 코드를 표현할 때 사용하며, 실제로는 잘 사용하지 않는다.

 	 <pre>
        <code>
          let val= 1;
          function myFunc(value){
            return value;
          }
          myFunc(val);
        </code>
     </pre>

7) blockquote 태그 : 인용블럭 cite: 글자 기울임 표시

	<blockquote>
      <p>제발 그만해.. 이러다가 다~~ 죽어!</p>
      <cite>오징어게임 오일남</cite>
    </blockquote>

8) main : HTML <main> 요소는 문서의 주요 콘텐츠를 나타낸다.(문서의 핵심 기능에 직접적으로 연결되어 있는 부분)

9) hr : 장면 전환 혹은 문단 안에서 주제가 변경되었을 때 그 구별을 위해 사용, 단락을 구분할 때 사용하므로 <p> 태그 내 사용은 웹 표준에 어긋난다.

<h1>hello world!</h1>
<hr>
<p>hello <br> world</p>

4. 자주 쓰이는 태그