ABOUT ME

chanho Yoon
chyoon0512@gmail.com


깃허브


블로그 이사!

이 블로그로 이사했어요!!


Today
-
Yesterday
-
Total
-
  • 그룹화와 섹셔닝
    Programming/HTML5 - CSS3 2019. 3. 26. 19:16
    반응형

    - 그룹화 작업할 때는 div 태그로

    - id는 큰 영역을 사용 할때 ( 본문 )  //  특정영역 바로가기 사용

    - class는 다소 중요하지 않은 부분을 사용할 때 ( 중복사용 가능 )


    섹셔닝 요소 


    - 섹셔닝 요소를 사용할 땐 항상 제목부터 사용.

    - main menu를 nav



    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>About | Enlighten Designs</title>
        <!-- 아래는 만약 익스플로러 9보다 낮다면 이 코드를 실행하라는 코드이다 -->
        <!--[if lt IE 9]>      
        <script src="js/html5shiv.min.js"></script>
        <![endif]-->
    </head>
    <body>
        <dl class="skip_nav">
            <dt><strong>skip navigation</strong></dt>
            <dd><a href="#contents">Skip to content</a></dd>
        </dl>
        <hr>
        <div id="wrap">
            <!-- header -->
            <header id="header">  <!-- 큰 영역은 id라고 하고 , 다소 중요하지 않은 부분은 class라고 한다. -->
                <h1>Enlighten Designs</h1>
                <nav>
                    <h2>Main menu</h2>
                </nav>
            </header>    
            <!-- //header -->
            <!-- container -->
            <div id="container">
                <!-- contents -->
                <section id="contents">
                    <h2>About</h2>
                    <h2>Cntact Us</h2>
                </section>
                <!-- //contents -->
                <!-- aside -->
                <aside id="aside">
                    <h2>Aside</h2>
                </aside>
                <!-- //aside -->
     
            </div>
            <!-- //container -->
            <!-- footer -->
            <footer id="footer">
                
            </footer>
            <!-- //footer -->
        </div>
     
    </body>
    </html>
    cs


    'Programming > HTML5 - CSS3' 카테고리의 다른 글

    플롯(float) 지정하기 , 해지하기  (0) 2019.03.31
    배경스타일 알아보기  (0) 2019.03.30
    웹표준의 세가지 계층  (0) 2019.03.26
    검색 엔진  (0) 2017.07.11
    HTML5 시맨틱(Semantic) 태그  (0) 2017.07.09

    댓글

Designed by Tistory.