html

태그(꺽쇠+요소명); 웹콘텐츠(ui요소) 를 저장하는(감싸는) 역할을 한다.

1.텍스트
    1-1. 제목 : h1~h6(중요도)>태그 선택자
  1-2. 문단 : p(:클래스명을 지정해야한다.)>클래스 선택자

2.이미지
  2-1. 일반 이미지 : <img src="상대경로" alt="이미지에 대한 설명">
  2-2. 초상화(증명사진, 인물사진), 예술작품 
<figure>
   <img src="상대경로" alt="이미지에 대한 설명">
   <figcaption>이미지에 대한 설명</figcaption>
</figure>

3.비디오
  <video>
    <source src="상대경로">
  </video>

4.오디오

5.목록(리스트) : 제품스팩, 메뉴(a요소,인라인:ul(flex-container)/li(flex-items)) ,입력폼(인라인)
        ul : 목록태그,  li:항목태그 
  <ul>
    <li></li>
    <li></li>
  </ul>

6.하이퍼링크 : 웹 페이지의 계층구조, 정보구조(IA)
  <a href="상대경로" target="_blank"> target="_blank"는 새창으로 띄운다.
  href 속성값: 상대경로, 절대경로, url경로, 아이디경로(내부경로), 메일경로, 전화경로(모바일) 등을 사용할 수 있다.

7.테이블
<table>
  <thead>
    <tr>
      <td>text</td>
       <td>text</td>
    </tr>
 </thead>

<tbody>
    <tr>
      <td>text</td>
       <td>
<h3>text</h3>
<img src="상대경로">
<p class="content">text</p>
       </td>
    </tr>
 </tbody>
</table>

8.입력폼
  <input type="text" name="name(변수명: 서버단으로 사용자가 입력한 데이터를 전송하기 위해 네임속성을 쓰는것이다)"  
   required(필수입력:유효성 검증, 입력란에 값이 채워졌는지에 대해 판단해주는 속성이다.
   input요소에 값을 입력하지 않았거나 유효하지 않은 상태로 전송버튼을 누르면 오류메세지를 보낸다)
  placeholder=입력필드란에 처음부터 표시되어 있는 디폴트 값>

*placehorder는 필수 요소는 아니지만 거의 필수요소라고 볼 수 있다.

<input type="checkbox" name="hoby" value="운동" chaecked>운동
<input type="submit" value="전송">
<input type="reset" value="초기화">
<input type="button" value="버튼">

9.버튼
   9-1 . a요소: a요소는 하이퍼링크를 가지고 있기 때문에 많이 쓴다. css에서 display:block; 적용하여 레이아웃 관련
     스타일시트가 적용되도록 박스 유형을 변경해야한다.
     9-2 button:(하이퍼링크 기능이 없어서 상대적으로 잘 안쓴다.) <button>메뉴</button>