Welcolme my Tutorial blog

퍼블리셔와 디자이너를 위한 사이트입니다.
동영상과 소스를 보면서 따라하는 튜토리얼 사이트입니다.

Welcolme my Tutorial blog

웹 표준 사이트 따라하기 튜토리얼 입니다.
유튜브 영상과 같이 보면서 따라하는 튜토입니다.

Welcolme my Tutorial blog

사이트는 현재 만드는 중입니다.
버그와 잘못된 링크가 엄청 많습니다.

안녕하세요!

현재는 베타버전입니다.

이 사이트는 코딩을 동영상과 소스를 보면서 따라하는 튜토리얼 사이트입니다.

에디터가 드리는 인사

티스토리 뷰

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>Layout06</title>
    <style>
        * {margin: 0; padding: 0;}
        #wrap {text-align: center; font-size: 30px; color: #fff;}
        #header {height: 140px; line-height: 140px; background: #ffe1e4;}
        #banner {height: 450px; line-height: 450px; background: #fbd6e3;}
        #contents {height: 950px; line-height: 950px; background: #ead5ee;} 
        #footer {height: 220px; line-height: 220px; background: #d6ebfd;}
        .container {width: 1100px; height: inherit; margin: 0 auto; background: rgba(0,0,0,0.1);}
    </style>
</head>
<body>
    <div id="wrap">
        <div id="header">
            <div class="container">header</div>
        </div>
        <div id="banner">
            <div class="container">banner</div>
        </div>
        <div id="contents">
            <div class="container">contents</div>
        </div>
        <div id="footer">
            <div class="container">footer</div>
        </div>
    </div>
</body>
</html>




<div id="wrap">
    <div id="header">
        <div class="container">header</div>
    </div>
    <div id="banner">
        <div class="container">banner</div>
    </div>
    <div id="contents">
        <div class="container">contents</div>
    </div>
    <div id="footer">
        <div class="container">footer</div>
    </div>
</div>
<style>
    * {
        margin: 0;
        padding: 0;
    }

    #wrap {
        text-align: center;
        font-size: 30px;
        color: #fff;
    }

    #header {
        height: 140px;
        line-height: 140px;
        background: #ffe1e4;
    }

    #banner {
        height: 450px;
        line-height: 450px;
        background: #fbd6e3;
    }

    #contents {
        height: 950px;
        line-height: 950px;
        background: #ead5ee;
    }

    #footer {
        height: 220px;
        line-height: 220px;
        background: #d6ebfd;
    }

    .container {
        width: 1100px;
        height: inherit;
        margin: 0 auto;
        background: rgba(0, 0, 0, 0.1);
    }
</style>
웹 표준 사이트 만들기(2019) - layout06

웹 표준 사이트를 만들기 위한 기본 레이아웃 유형6 입니다.

완성
광고

공유하기

  • 네이버 블러그 공유하기
  • 페이스북 공유하기
  • 트위터 공유하기
  • 트위터 공유하기
  • 트위터 공유하기
태그보기

전체메뉴

질문하기
댓글
  • 프로필사진 송형일 안녕하세요 너무 감사하게 강의영상을 보고 잘 배우고 있습니다. 유익한 영상 정말 너무너무 감사합니다.
    그런데 제가 여기를 즐겨찾기 하고 매일 찾아보면서 하고있는데 즐겨찾기를 해서 들어왔을 경우 오른쪽 메뉴파일을 열면 안에있는 내용들이 보이질 않아요
    유튜브로 연결된 링크로 들어오면 메뉴가 보이는데 즐겨찾기로 들어오면 메뉴가 보이질 않아서요 혹시 해결방법이 있으시면 알려주세요~

    그리고 정리도 좋고 영상내용도 좋고 정말 너무 감사합니다 이런 강의영상을 무료로 볼 수 있는게 정말 감사합니다.
    2018.12.27 14:12 신고
  • 프로필사진 큐브 저도 이거 생각하고 있었는데 ㅎㅎ
    강의 넘 잘듣구 있습니다 ㅎㅎ
    재밌어요!
    2019.01.14 17:25 신고
  • 프로필사진 @webs 죄송해요. 버그입니다. 고쳐야 하는데. 조만간 고쳐놓겠습니다 2018.12.27 15:24 신고
댓글쓰기 폼