wxss margin-left有效 margin-top无效
发布于 5 年前 作者 umeng 9635 次浏览 来自 问答
  • 当前 Bug 的表现(可附上截图)

index.wxss代码如下

.title-icon{

width: 12rpx;

height: 68rpx;

background-color: green;

}

.mid-title{

margin-top: -25rpx;

margin-left: 24rpx;

font-size: 13pt;

background-color: pink;

}

app.wxss

.container {

height: 100%;

display: flex;

flex-direction: column;

align-items: center;

justify-content: space-between;

padding: 200rpx 0;

box-sizing: border-box;

}

index.wxml

<view class=“container”>

<view class=“mid-title-positon”><image class=“title-icon” src=“url” mode=""/><text class=“mid-title”>预约列表</text></view>

</view>

  • 预期表现

希望预约列表的字可以与左边的图片水平

  • 其他

不知道是不是自己css没学好 导致样式失效了 或者是app.wxss和子wxss冲突(有点不懂,平时用得很肤浅

此外还想问一下 为什么图片默认会比text文本高出一点呢

希望得到解答

2 回复

text是行内元素,margin-top肯定没有效果啊,可以加个display:inline-block或display:block或者换成view标签

你给的css还少了mid-title-positon这个样式没给出

另外:图片不是默认比text文本高,是你自己定义的高度 height: 68rpx;

回到顶部