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>
게시글 목록
| 번호 | 제목 |
|---|---|
| 2952 |
HTML
zencoding
|
| 2951 | |
| 2950 |
HTML
html table 2
|
| 2949 |
HTML
HTML Table 1
|
| 2948 |
HTML
HTML 파일 경로
|
| 2947 |
HTML
HTML <script> 태그
|
| 2946 |
HTML
Iframe 구문
|
| 2945 |
HTML
html 하이퍼링크2
|
| 2944 |
HTML
html 하이퍼링크 1
|
| 2943 |
HTML
HTML comment 태그
|
| 2942 | |
| 2941 | |
| 2940 | |
| 2939 |
HTML
짧은 인용문을위한 HTML
|
| 2938 |
HTML
HTML 서식 예제
|
| 2937 |
HTML
HTML 서식 요소
|
| 2936 | |
| 2935 |
HTML
HTML 줄 바꿈
|
| 2934 | |
| 2933 |
HTML
Headings 에 중요성
|
| 2932 |
HTML
HTML 스타일 속성
|
| 2931 |
HTML
HTML <pre> 요소
|
| 2930 |
HTML
HTML 줄 바꿈
|
| 2929 | |
| 2928 |
CSS
CSS 코멘트 삽입
|
| 2927 |
CSS
CSS 기본 문법
|
| 2926 |
HTML
HTML addr
|
| 2925 |
HTML
HTML 서식 요소
|
| 2924 |
기타
디바이스별 해상도
|
| 2923 |
HTML
HTML 이미지 img 태그
|
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기