Heim >Web-Frontend >HTML-Tutorial >CSS position:fixed 实现html元素固定于某位置_html/css_WEB-ITnose
CSS position:fixed 实现html元素固定于某位置_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:25:13955Durchsuche
本文章通过实例向大家讲解position:fixed 实现html元素固定于某位置。实例中div将固定于网页右下角，主要使用到css position:fixed 属性，需要的码农可以参考一下。
CSS实现div固定于网页右下角实例代码:
将一个元素固定于网页右下角的效果使用非常频繁，比如返回顶部的按钮，或者说是信息提示框之类的，下面就介绍一下如何使用CSS实现此效果，代码实例如下:
<!DOCTYPE html><html><head><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></head><body><div id="footer"></div></body></html> 在线运行
以上代码实现了我们的要求，div块能够固定在网页右下角部位，无论是否拖动滚动条。
Stellungnahme：
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
Vorheriger Artikel：【移动适配】一个像素的border怎么实现_html/css_WEB-ITnoseNächster Artikel：Jmeter 使用笔记之 html 报告扩展（一）_html/css_WEB-ITnose