Notice
Recent Posts
Recent Comments
Link
«   2024/04   »
일 월 화 수 목 금 토
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
Tags more
Archives
Today
Total
관리 메뉴

moozi

6/18 html5 2반 sec.html 본문

카테고리 없음

6/18 html5 2반 sec.html

moozi 2015. 6. 19. 11:30

<html>
    <head>
        <title>보안스쿨</title>
        <style>
            /* 스마트폰 */
            @media (max-width:799px){
                body{
                    background-color: aqua;                   
                }
                h1{
                    color:red;
                }
            }
           
            /* 태블릿 */
            @media only screen and (min-width:800px) and (max-width:1023px){
                body{
                    background-color:cadetblue;
                }
                h1{
                    color:blue;
                }
            }
           
            /* 데스크탑 */
            @media only screen and (min-width:1024px){
                body{
                    background-color: chartreuse;
                }
                h1{
                    color:orange;
                }
            }
           
           
            @font-face{
                font-family: SeoulNamsanFont;
                src: url('SeoulNamsanEB.ttf');
            }
           
            h1, h2{
                font-family: SeoulNamsanFont;
            }
               
               
            .header{
                background-color: darkcyan;
                color: white;
                padding: 1em;
            }
           
            .box_style{
                border: 2px solid red;
                float: left;
                width: 190px;
                margin: 5px;
                padding: 5px;
            }
           
            .clear_style{
                clear:both;
            }
           
            .footer_style{
                background-color: darkcyan;
                color: white;
                padding: 5px;
            }
        </style>
    </head>
    <body>
        <header>
            <div class="header">
                <h1>보안스쿨</h1>
            </div>
          
            <div class="box_style">
                <h2>컴퓨터보안학과</h2>
                <p>
                   컴퓨터보안학과는 일반적인 보안관련과목을 배웁니다.
                   컴퓨터보안학과는 일반적인 보안관련과목을 배웁니다.
                   컴퓨터보안학과는 일반적인 보안관련과목을 배웁니다.
                </p>
            </div>
          
            <div class="box_style">
                <h2>해킹바이러스대응학과</h2>
                <p>
                    해킹바이러스대응학과는 모의해킹, 해킹기법에 대응하는법을 배웁니다.
                    해킹바이러스대응학과는 모의해킹, 해킹기법에 대응하는법을 배웁니다.
                    해킹바이러스대응학과는 모의해킹, 해킹기법에 대응하는법을 배웁니다.
                </p>
            </div>
           
            <div class="footer_style clear_style">           
                <p>
                    COPYRIGHT KOREA IT SCHOOL ALLRIGHT RESERVED.
                </p>
            </div>
          
        </header>
    </body>
</html>

 

 


 

Comments