View中子元素的位置
如使用flex布局時(shí)
justify-content
失效原因:
1.子級(jí)中使用了margin:auto奶浦;
屬性會(huì)導(dǎo)致其失效。
2.如果使用在子view中使用margin-right: 20rpx;
也會(huì)導(dǎo)致justify-content
失效
.parents_layout {
height: 100rpx;
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
}
.child-view {
background-color: #c7cac5;
color: white;
height: 70rpx;
font-size: 26rpx;
margin: 0 20rpx;
}
<-- 如果使用在子view中使用 margin-right: 20rpx;也會(huì)導(dǎo)致justify-content失效!-->
view居中居下顯示
之前在寫(xiě)微信小程序的時(shí)候想讓view居右顯示,采用css的float,可是無(wú)效宣脉,后來(lái)發(fā)現(xiàn)只需簡(jiǎn)單的加上
position: fixed;就可以用left:;right:;top:;bottom:;來(lái)固定位置了,當(dāng)然它還有一個(gè)效果就是懸浮固定剔氏,如果固定了X軸Y軸的位置塑猖,就不會(huì)再跟隨界面移動(dòng)。
.recommend-bottom {
position: fixed;
bottom: 10rpx;
}