CSS position:fixed 实现html元素固定于某位置

WBOY
Freigeben: 2016-06-01 09:53:16
Original
1883 Leute haben es durchsucht

CSS实现div固定于网页右下角实例代码:
将一个元素固定于网页右下角的效果使用非常频繁,比如返回顶部的按钮,或者说是信息提示框之类的,下面就介绍一下如何使用CSS实现此效果,代码实例如下:

<code class="language-html">


<title>CSS position:fixed 实现html元素固定于某位置</title>
<style type="text/css">
*{
  padding:0;
  margin:0;
}
body{height:1000px;}
#footer{
  position:fixed;
  background:#eee;
  bottom:20px;
  right:10px;
  width:100px;
  height:100px;
}
</style>


<div id="footer"></div>

</code>
Nach dem Login kopieren

在线运行

以上代码实现了我们的要求,div块能够固定在网页右下角部位,无论是否拖动滚动条。

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage