开发者学堂课程【CSS 快速掌握:使用绝对定位来实现拉手网上的效果】学习笔记,与课程紧密联系,让用户快速学习知识。
课程地址:https://developer.aliyun.com/learning/course/611/detail/9203
使用绝对定位来实现拉手网上的效果
内容介绍
一、使用绝对定位来实现拉手网上的效果
一、使用绝对定位来实现拉手网上的效果
<title>使用绝对定位来实现拉手网上的效果
<style type= "text/css">
/*第一步
:
清除内填充与外边框样式
*/}
margin:0;padding:0;}.Box{width:封面图片宽度
px
;
Height:
封面图片高度
px
;
Border:
宽度
px solid #000;Morgin:100px auto;
父相:
/*
相对定位
*/Position:relative
;
}
.box span{/*绝对定位
*/
子绝:
Position:absolute;/*
绝对定位的坐标来实现
*/Left:px;top:px;}
<span><img src="./images/标签小图片
.png"></span>
<div><img src="./images/封面图片
.jpg"alt=""></div></div>