在微信小程序wxml页面上,设计成距离页面上面150px,左边34px,字号为24号,黑体加粗。<text>上车地点:{{boardingPoint}}</text> <text>下车地点:{{dropoffPoint}}</text>
时间: 2024-03-26 13:34:19 浏览: 45
以下是实现的 wxml 代码:
```html
<view style="margin-top: 150rpx; margin-left: 34rpx;">
<text style="font-size: 24rpx; font-weight: bold; font-family: '黑体';">
上车地点:{{boardingPoint}}
</text>
<text style="font-size: 24rpx; font-weight: bold; font-family: '黑体'; margin-top: 20rpx;">
下车地点:{{dropoffPoint}}
</text>
</view>
```
解释一下:
- `margin-top: 150rpx;` 表示距离页面顶部的距离为 150 像素(注意:在 wxml 中使用的单位为 rpx,而不是 px,1rpx 约等于 0.5px)。
- `margin-left: 34rpx;` 表示距离页面左边的距离为 34 像素。
- `font-size: 24rpx;` 表示字号大小为 24 像素。
- `font-weight: bold;` 表示字体加粗。
- `font-family: '黑体';` 表示字体为黑体。
- `margin-top: 20rpx;` 表示下一个 `<text>` 标签距离上一个标签的距离为 20 像素。
在实际使用时,需要将 `{{boardingPoint}}` 和 `{{dropoffPoint}}` 替换成实际需要显示的内容。
阅读全文