搜索文档
首页
HTML/CSS
JavaScript
服务端开发
Java教程
移动端
数据库
当前位置:
首页
HTML/CSS
CSS 教程
CSS 基础教程
源代码
清空
点击运行
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>CSS fixed固定定位</title> <style> .box{ position: fixed; top: 200px; left: 100px; color: #fff; width: 60%; background: #f44712; padding: 20px; } .container{ padding: 50px; margin: 50px; position: relative; border: 5px solid black; font-family: Arial, sans-serif; } .container p{ line-height: 50px; } </style> </head> <body> <div class="container"> <div class="box"> <h2>fixed固定定位盒子</h2> <div><strong>Note:</strong> 此框的位置相对于文档的视口是固定的。 它不会随页面滚动。</div> </div> <p>CSS提供了丰富的文档样式外观，以及设置文本和背景属性的能力；允许为任何元素创建边框，以及元素边框与其他元素间的距离，以及元素边框与元素内容间的距离；允许随意改变文本的大小写方式、修饰方式以及其他页面效果。</p> <p>CSS可以将样式定义在HTML元素的style属性中，也可以将其定义在HTML文档的header部分，也可以将样式声明在一个专门的CSS文件中，以供HTML页面引用。总之，CSS样式表可以将所有的样式声明统一存放，进行统一管理。</p> </div> </body> </html>
运行结果
