ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [HTML] Day1 - HTML의 기본구조
    Frontend 2019. 2. 9. 21:59


    Day1 -HTML의 기본구조-

    1. 기본 구조
    <!DOCTYPE html>
    <html lang="ko">
    <head>
    <meta charset="utf-8"> -meta :페이지 설정을 웹 브라우저에게 알려주기 위해 사용-
    <meta http-equiv="X-UA-Compatible" content="IE=edge">-IE의 호환성 보기 모드를 금지하고 가장 최신 버전의 방식으로 HTML페이지를 보여줌-
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <title></title>
    <style></style> -style: CSS언어를 기술
    <link> -link: CSS언어를 별도로 명시한 외부 파일 연결
    </head>
    <body>
    </body>
    </html>
     
    2. 단락관련 태그
    <h1>~<h6>: 제목
    <ol>, <ul> / <li>: 리스트(ordered, unordered)
    <p>: 본문
    <blockquote>: 인용문
    <div>: 영역 나눔
    <hr/>: 직선 표시 / <br/>: 줄 바꿈
    <address>: 주소, 저작권(카피라이트), 회사 연락처 등등
    <!--주석 -->


    *id 속성: <tag id=""> -웹 페이지에서 고유한 요소를 의미하는 값.

    -특수문자:

    • &copy; :카피라이트 특수문자
    •  &nbsp; :띄어쓰기
    •  &amp; :&
    • <>: &lt; 내용&gt;---> <내용>
    • << >>: &laquo; 내용 &raquo;
    • 왼쪽 화살표/오른쪽 화살표: &larr; / &rarr;


    *구조를 표현하기 위한 기타 시멘틱 태그들
    <section>: 주로 <h1>~<h6>와 같이 사용
    <header>: 사이트 앞머리, 머릿글, 사이트 소개 등등
    <article>: 블로그 포스팅, 뉴스 기사, 회사 소개 등
    <aside>: 본문과 상관없는 사이드바/배너 영역
    <footer>: 페이지 하단
    <nav>:주로 메뉴
    <hgroup>: 제목과 관련 부제목 하나로 묶기
     


    반응형

    COMMENT