没有合适的资源?快使用搜索试试~ 我知道了~
前言 有时候,我们需要如下图这样一个悬浮效果需求: 实现 在标准的正常的情况下,只能使用 绝对定位 来完成。 第一步:父容器定位设置为 relative(相对定位)。 第二步:子容器定位设置为 absolute(绝对定位)。 <div id=a> <div id=b>我要浮出去!</div> </div> #a{ width:400px; height:100px; background:rgb(0, 0, 0); position:relative;/*父元素>相对定位*/ } #b{ width: 150px; height:50px;
资源推荐
资源详情
资源评论
CSS让子容器超出父元素让子容器超出父元素(子容器悬浮在父容器效果子容器悬浮在父容器效果)
前言前言
有时候,我们需要如下图这样一个悬浮效果需求:
实现实现
在标准的正常的情况下,只能使用 绝对定位 来完成。
第一步:父容器定位设置为 relative(相对定位)。
第二步:子容器定位设置为 absolute(绝对定位)。
<div id="a">
<div id="b">我要浮出去!</div>
</div>
#a{
width:400px;
height:100px;
background:rgb(0, 0, 0);
position:relative;/*父元素>相对定位*/
}
#b{
width: 150px;
height:50px;
background:rgb(185, 155, 255);
position:absolute;/*子元素>绝对定位*/
top:-30px;/*控制浮出*/
/* left:XX; */
}
效果图:
资源评论
weixin_38517105
- 粉丝: 3
- 资源: 922
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- (源码)基于Java和MySQL的学生信息管理系统.zip
- (源码)基于ASP.NET Core的零售供应链管理系统.zip
- (源码)基于PythonSpleeter的戏曲音频处理系统.zip
- (源码)基于Spring Boot的监控与日志管理系统.zip
- (源码)基于C++的Unix V6++二级文件系统.zip
- (源码)基于Spring Boot和JPA的皮皮虾图片收集系统.zip
- (源码)基于Arduino和Python的实时歌曲信息液晶显示屏展示系统.zip
- (源码)基于C++和C混合模式的操作系统开发项目.zip
- (源码)基于Arduino的全球天气监控系统.zip
- OpenCVForUnity2.6.0.unitypackage
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功