Computer >> 컴퓨터 >  >> 프로그램 작성 >> CSS

CSS 위치:끈적임;


위치:고정 속성을 사용하면 스크롤 위치를 기반으로 요소를 배치할 수 있습니다. 사용자가 아래로 스크롤할 때 요소를 상단에 고정으로 설정합니다.

예시

다음 코드를 실행하여 CSS 위치를 구현할 수 있습니다.sticky;

<!DOCTYPE html>
<html>
   <head>
      <style>
         div.sticky {
            position: -webkit-sticky;
            position: sticky;
            top: 0;
            padding: 10px;
            background-color: orange;
            border: 1px solid blue;
         }
      </style>
   </head>
   <body>
      <p>Scroll and see the effect!</p>
      <div class = "sticky">Sticky!</div>
      <div style = "padding-bottom:2000px">
         <p>This is demo text.</p>
         <p>Scroll down to view the sticky div.</p>
      </div>
   </body>
</html>