简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
집 > 웹 프론트엔드 > CSS 튜토리얼 > 본문

CSS 컨트롤 div가 브라우저 예제 코드 하단에 고정되었습니다.

高洛峰
풀어 주다： 2017-03-27 17:23:12
원래의
1896명이 탐색했습니다.

브라우저 하단에 고정된 CSS 컨트롤 div

참고: 이 기능은 페이지 높이가 더 작은 페이지에만 사용됩니다.

CSS 컨트롤 div가 브라우저 예제 코드 하단에 고정되었습니다.

코드는 다음과 같습니다. 

<html>
<head>
<style type="text/css">
body{
  margin:0px;
}
#main{
  width:100%;
  height:50px;
  position:absolute;
  top:100%;
  margin-top:-50px;
  background:#360;
  color:white;
}
</style>
</head>
<body>
<div style="border:1px solid #f00;width:500px;height:1800px"></div>
<div id="main">bottom</div>
</body>
</html>
로그인 후 복사

온라인에서 더 좋은 것을 찾았습니다.

브라우저 창이 무한히 줄어들면 오른쪽 스크롤 막대가 공백으로 표시되지 않습니다.

CSS 컨트롤 div가 브라우저 예제 코드 하단에 고정되었습니다.

rree

글쎄요, 위의 것은 별로 좋지 않은 것 같아요. 온라인에서 찾았는데 꽤 실용적이에요.

CSS 컨트롤 div가 브라우저 예제 코드 하단에 고정되었습니다.

아아아아

위 내용은 CSS 컨트롤 div가 브라우저 예제 코드 하단에 고정되었습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨：
css div固定在浏览器底部
원천：php.cn
이전 기사：CSS 배경 이미지는 화면 크기에 따라 자동으로 크기가 조정됩니다. 다음 기사：CSS를 사용하여 IE6에서 png 투명 이미지가 정상적으로 표시되는 문제를 해결하는 방법
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
제목 변경: 고정 div 열 및 나머지 너비 모든 열이 브라우저 창의 전체 높이가 되는 5열 레이아웃을 만들려고 합니다. 중간 열을 제외한 나머지 열은 브라우저/문서 스크롤 시 고정되어 움직이지 않아야 합니...
에서 2023-09-14 17:17:47
0
1
299
페이지가 전체 화면이 아닐 때 설명할 수 없는 오른쪽 여백 - Nuxt/Tailwinds Nuxt, Vue3 및 TailwindCSS를 사용하여 간단한 이력서 페이지를 만들려고 합니다. 브라우저가 전체 화면이면 모든 것이 괜찮아 보이고 모든 것이 잘 ...
에서 2023-09-01 00:05:46
0
1
256
페이지 제목과 페이지 앵커가 겹치는 문제 해결 HTML 페이지에 정의된 높이로 상단에 고정된 스크롤되지 않는 헤더가 있는 경우: URL 앵커(#fragment 부분)를 사용하여 브라우저가 페이지의 특정 위치로...
에서 2023-08-21 19:18:36
0
2
297
android - 手机qq浏览器如何去掉浏览器底部的菜单栏？ 如图： 这是手机qq打开某个网页出现的情况，在屏幕底部qq浏览器又多加了一个工具栏，导致的结果就是，能够一屏显示完整内容的页面，却出现了滚动条，甚至如果项目footer元素采用浮动...
에서 2017-04-18 09:48:44
0
1
957
javascript - 小米浏览器中，图片导致fixed定位的元素无法显示 在小米手机自带的浏览器中（版本V8.6.5）, 我的布局代码是这样的, header 是fixed定位，content容器里面包含有图片。但是当有图片的时候，fixed定位的hea...
에서 2017-04-17 15:19:39
0
2
687
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！