KCP 창업 지원, 수수료 국내최저 2.9% 제공 이벤트!

sticky > 그누보드5 팁자료실

그누보드5
영카트5
스터디
Q & A
제작의뢰
컨텐츠몰
부가서비스
소모임
커뮤니티
부가서비스
신용카드 2.9%

그누보드5 팁자료실

sticky 정보

sticky

본문

오늘 노마드코더에서 본건데 꿀팁이네요

position: sticky;

아래 코드 실행해서 스크롤 해보세요

 

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <style>

        html, body {

            margin: 0;

            padding: 0;

        }

        header {

            background: #0f0;

            line-height: 100px;

            text-align: center;

        }

        nav {

            background: #0af;

            top: 0;

            position: sticky;

            line-height: 30px;

            text-align: center;

        }

        .main {

            background: #1a1;

            height: 2000px;

            text-align: center;

        }

        footer {

            background: #834;

            text-align: center;

        }

    </style>

</head>

<body>

    <header>

        header

    </header>

    <nav>

        nav

    </nav>

    <div class="main">

        aaaa

    </div>

    <footer>

        Footer

    </footer>

</body>

</html>

추천3

댓글 전체

전체 1,718 |RSS
그누보드5 팁자료실 내용 검색

회원로그인

(주)에스아이알소프트 (06212) 서울시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 대표메일:admin@sir.kr
사업자등록번호:217-81-36347 대표:홍석명 통신판매업신고번호:2014-서울강남-02098호 개인정보보호책임자:이총

© SIRSOFT