테스트 사이트 - 개발 중인 베타 버전입니다

css position: fixed;

· 8년 전 · 2326

css position: fixed;

 

position: fixed;가 있는 요소 는 뷰포트를 기준으로 배치됩니다. 

즉, 페이지가 스크롤 되어도 항상 같은 위치에 유지됩니다. 

위쪽, 오른쪽, 아래쪽 및 왼쪽 속성은 요소의 위치를 ​​지정하는 데 사용됩니다.

 

고정 요소는 일반적으로 위치한 페이지에 간격을 두지 않습니다.

 

페이지의 오른쪽 아래에 고정 된 요소가 있음을 확인하십시오. 

다음은 사용 된 CSS입니다.

 

div.fixed {

    position: fixed;

    bottom: 0;

    right: 0;

    width: 300px;

    border: 3px solid #73AD21;

}

 

 

<!DOCTYPE html>

<html>

<head>

<style>

div.fixed {

    position: fixed;

    bottom: 0;

    right: 0;

    width: 300px;

    border: 3px solid #73AD21;

}

</style>

</head>

<body>

 

<h2>position: fixed;</h2>

 

<p>An element with position: fixed; is positioned relative to the viewport, which means it always stays in the same place even if the page is scrolled:</p>

 

<div class="fixed">

This div element has position: fixed;

</div>

 

</body>

</html>




댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시글 목록

번호 제목
3087
3086
3085
3084
3083
3082
3081
3080
3079
3078
3077
3076
3075
3074
3073
3072
3071
3070
3069
3068
3067
3065
3064
3063
3062
3061
3060
3059
3058
3057