⼩程相对图⽚路径_⼩程序中图⽚绝对定位（背景图
⽚）的⽅法
这篇⽂章主要介绍了⼩程序 图⽚绝对定位(背景图⽚)的相关资料，需要的朋友可以参考下
⼩程序 图⽚绝对定位
前⾔：
在⼩程序中，有时需要⽤到背景图⽚，但是如果使⽤background-image的话，就⽆法控制图⽚的⼤⼩，background-image⼀般⽤于将图⽚压缩为1像素的背景图⽚，然后⾃动填充铺满。使⽤背景图⽚的话，⼀般使⽤⼀些新的view层，如等，但是⼩程序与html类似，⼀个不同的 css或wxss会占据⼀个位置，然后接下来的css或wxss会⾃动往下排版，但是很多时候这并不是我们想要的，于是需要⽤的绝对定位。
使⽤绝对定位，最好使⽤⼀个新的wxss将所有⼦控件包含起来，然后在这个包含所有⼦控件的wxss中，定义⼀个属性 position: relative，在每个⼦控件中，定义 position: absolute，现在就可以通过绝对定位来修改位置，如top等，以下附上部分wxss代码：
.jx_card{
状态背景图更改
width: 100%;
height: 295rpx;
background-color:#e6e6e6;
position: relative
}
.jxlogo{
top: 47.5rpx;
margin-left: 50rpx;
width: 200rpx;
height: 200rpx;
float: left;
position: absolute;
}
然后附上wxml代码：
⼤概内容就是这样，主要是通过position先定义定位的类型，然后通过top去到图⽚上的位置，并定义上去。
以上就是本⽂的全部内容，希望对⼤家的学习有所帮助，更多相关内容请关注PHP中⽂⽹！
相关推荐：