Programming/HTML5 - CSS3

그룹화와 섹셔닝

Chanho. 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


저작자표시