更多课程 选择中心


Web培训

400-111-8989

Web培训

web开发中CSS 相对定位的教程


本篇文章讲述了web开发中CSS 相对定位的教程。希望对在web学习和开发的同学有所帮助!

CSS 定位概述

CSS 绝对定位

设置为相对定位的元素框会偏移某个距离。元素仍然保持其未定位前的形状,它原本所占的空间仍保留。

CSS 相对定位

相对定位是一个非常容易掌握的概念。如果对一个元素进行相对定位,它将出现在它所在的位置上。然后,可以通过设置垂直或水平位置,让这个元素“相对于”它的起点进行移动。

如果将 top 设置为 20px,那么框将在原位置顶部下面 20 像素的地方。如果 left 设置为 30 像素,那么会在元素左边创建 30 像素的空间,也就是将元素向右移动。

#box_relative {

position: relative;

left: 30px;

top: 20px;

}

如下图所示:

web开发中CSS 相对定位的教程

注意,在使用相对定位时,无论是否进行移动,元素仍然占据原来的空间。因此,移动元素会导致它覆盖其它框。

以上部分就是本篇文章的详细讲解教程!达内web培训官网提供web开发相关各类教程。同时web培训课堂火热招生中,欢迎垂询!

免责声明:内容和图片源自网络,版权归原作者所有,如有侵犯您的原创版权请告知,我们将尽快删除相关内容

预约申请免费试听课

填写下面表单即可预约申请免费试听! 怕学不会?助教全程陪读,随时解惑!担心就业?一地学习,可全国推荐就业!

上一篇:JavaScript 表单验证如何实现的?
下一篇:web开发中CSS 绝对定位的教程

Web前端开发培训学习

微信小游戏怎么开发?

Web前端工程师需要掌握哪些知识?

html怎么复制css样式

  • 扫码领取资料

    回复关键字:视频资料

    免费领取 达内课程视频学习资料

Copyright © 2023 Tedu.cn All Rights Reserved 京ICP备08000853号-56 京公网安备 11010802029508号 达内时代科技集团有限公司 版权所有

选择城市和中心
黑龙江省

吉林省

河北省

贵州省

云南省

广西省

海南省