.main-text { padding: 12rpx; font-size: 15px; height: 70rpx; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; } 不显示省略号
时间: 2024-04-08 14:28:37 浏览: 14
要让省略号显示出来,你可以添加以下的 CSS 样式:
```css
.main-text {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
```
这样设置后,如果文本内容超出了容器的宽度,就会显示省略号。
相关问题
如何让这个组件靠右.calendar-footer { width: 170rpx; display: flex; justify-content: space-between; padding: 20rpx; } /* 确认和取消按钮样式 */ .footer-btn { font-size: 27rpx; background-color: lightblue; border-radius: 15rpx; padding: 10rpx; }
你可以在父元素上添加一个属性 `justify-content: flex-end;`,这样就可以将子元素靠右对齐了。修改后的代码如下:
```css
.calendar-footer {
width: 170rpx;
display: flex;
justify-content: flex-end; /* 将子元素靠右对齐 */
padding: 20rpx;
}
/* 确认和取消按钮样式 */
.footer-btn {
font-size: 27rpx;
background-color: lightblue;
border-radius: 15rpx;
padding: 10rpx;
}
```
flex-wrp{ margin-top: 60rpx; display:fex; flex-itemf width: 200rpx; height:300rpx; font-size:26rpx;
根据引用和引用中的代码,flex-wrp 是一个类名,而不是一个CSS属性。正确的写法应该是 .flex-wrp 而不是 flex-wrp。另外,display:fex 这个拼写错误应该是 display:flex。而 flex-itemf 应该是 flex-item。所以正确的代码应该是:
.flex-wrp {
margin-top: 60rpx;
display: flex;
}
.flex-item {
width: 200rpx;
height: 300rpx;
font-size: 26rpx;
}
所以你应该把原代码修改为:
<view class="flex-wrap">
<view class="flex-item" wx:for="{{data-list}}">{{item}}</view>
</view>
然后在你的样式表中添加以上的 CSS 代码。