- text文字不分行
记个笔记,雅俗共享。
一开始只是单行,没截图,为了让大家看到不分行的样式,重新回滚的效果。
小程序样式,说实话相对于习惯了xml布局的我,还是有点不适应的;不废话了,先分析下为啥会出现上面的情况:
理论上。布局本身会对手机屏幕宽度做识别,自动换行,小程序中父布局或者自身布局宽度width: 100%;里面的布局里的view就有点傻傻分不清,还是会认为自己的宽度是屏幕的宽度,即使我布局里有个图片占据了一些位置。
解决办法(我是以自己的demo为例,自行斟酌):
.about_acesmart_content{ padding-top:10px; padding-right: 8rem; //设置同等右边图片的width padding-left: 0.5rem; font-size: 13px; color: #666666;line-height: 1.4; display: flex; //display设置为flex;flex-wrap设置为wrap flex-wrap: wrap; }小注:如果不设置右间距,仅仅只是设置上面的属性依旧不行。最后效果:
- text 文字空格、换行
换行简单,几乎通用的;
空格t效果可以忽略,其他方法稍微记下(亲测有效):
在text中添加这两个属性,切记:space=“ensp” decode="{{true}}"
- 空格根据字体设置
view text space="nbsp" decode="{{true}}" 类别 一/text/view- 空格是中文字符一半大小
view text space="ensp" decode="{{true}}" 类别   二/text/view- 空格是中文字符大小
view text space="emsp" decode="{{true}}" 类别   三/text/view- 行距
直接在css里设置或者直接在wxml中style=""
.text { color: #aaa; font-size: 16px; margin: 20px; line-height:1.5em; //行距}在此感谢:https://blog.csdn.net/qq_25252769/article/details/76049846
让我了解空格诠释













