본문 바로가기
Web/HTML5 & CSS

HTML5(4) - 문서구조

by SeleniumBindingProtein 2022. 1. 28.
728x90
반응형

1. div 
    1) division, 분할, 문서의 부분이나 섹션을 정의
    2) 단순히 특정 범위를 묶는(wrap) 용도로 사용
        - 특별한 의미가 없는 구분을 위한 요소
    3) 묶인 부분들에 CSS나 JS를 적용하게 됨.
    4) 블록(상자) 요소

2. h 
    1) 제목을 의미하는 요소 (Heading) 
    2) 블록(상자) 요소  
    3) 숫자가 작을수록 더 중요한 제목을 정의.
    
3. p 
    1) 문장을 의미하는 요소 (Paragraph)
    2) 블록(상자) 요소

4. ul 
    1) 순서가 필요없는 목록의 집합을 의미 (Unordered list)
    2) <li></li> 
        - 목록 내 각 항목 (List Item)
    3) 블록(상자) 요소 
    
5. a 
    1) 같은/다른 페이지로 이동하는 하이퍼링크를 지정하는 요소. (Anchor)
    2) href : 링크 URL
       target : 링크 URL의 표시(브라우저 탭) 위치  (_blank)
    3) 인라인(글자) 요소   

6. span 
    1) 특별한 의미가 없는 구분을 위한 요소. 
    2) 인라인(글자) 요소 

7. br 
    1) 줄바꿈 요소(Break)  
    2) 인라인(글자) 요소
    
8. input 
    1) 사용자가 데이터를 입력하는 요소.    
    2) 인라인(글자) 요소, 블록(상자) 요소 = Inline-block 
    3) type  속성 
        - 입력받을 데이터의 타입 
        - 값
            - text  : 화면에 출력,   value : 미리 입력된 값(데이터)
                                ,   placeholder : 사용자가 입력할 값(데이터)의 힌트 
                                ,   disabled : 입력 요소 비활성화 

9. table
    1) tr(table row) : 표에 행을 삽입
    2) th(table heading) : 표의 제목 셀 생성
       td(table data) : 표의 일반 셀 생성



10. 전역 속성
    1) style 
        - <태그 style="스타일"></태그>
        - 요소에 적용할 스타일(css)을 지정 
    2) class 
        - <태그 class="이름"></태그>        
        - 요소를 지칭하는 중복 가능한 이름
    3) id
        - <태그 id="이름"></태그>        
        - 요소를 지칭하는 고유한 이름

728x90
반응형

'Web > HTML5 & CSS' 카테고리의 다른 글

HTML5(6) - CSS 기본문법2  (0) 2022.01.28
HTML5(5) - CSS 기본문법  (0) 2022.01.28
HTML5(3) - review  (0) 2022.01.28
HTML5(2) - 문서  (0) 2022.01.28
HTML5(1) - 개요  (0) 2022.01.28

댓글