CSS之position属性

最新推荐文章于 2022-07-03 14:34:03 发布

zf429_0

最新推荐文章于 2022-07-03 14:34:03 发布

阅读量187

点赞数

分类专栏： CSS

本文链接：https://blog.csdn.net/zf429_0/article/details/107631330

版权

这篇博客详细介绍了CSS中的position属性，包括其不同参数的含义和效果，如static、relative、absolute、fixed以及inherit。同时，文章还讨论了HTML的三种布局方式，两大元素类型，z-index的概念以及它在元素叠加顺序中的作用。此外，博主还阐述了定位与盒子模型的关系，如何通过调整元素的外边距和内边距实现定位。

摘要由CSDN通过智能技术生成

1. HTML中的三种布局方式

标准流顺序布局

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>标准流</title>
        <style type="text/css">
            .test {
                width: 100px;
                height: 100px;
                background: red;
                border: 1px solid #fff;
            }
        </style>
    </head>
    <body>
        <div class="test"></div>
        <div class="test"></div>
        <div class="test"></div>

        <span>文字文字1</span>
        <span>文字文字2</span>
        <span>文字文字3</span>
    </body>
</html>

浮动
定位
- postion属性的意义
  - position属性决定了元素将如何定位
  - 通过top、right、bott

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

zf429_0

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
CSS之position属性

1. HTML中的三种布局方式标准流顺序布局<!DOCTYPE html><html lang="en"> <head> <meta charset="utf-8"> <title>标准流</title> <style type="text/css"> .test { width: 100px;
复制链接

扫一扫