Text组件在style中使用padding,结果很诡异,请大侠解答

tennis
  • 656

用Text组件显示字符串时,希望能在上下都留些空间。
按道理,padding是干这事儿的。
于是我设了个padding:10,

然后一看效果,不管是英文还是中文,在字符串的下面,有空白,padding生效了,
但字符串的左、右、上方,都没有生效,都是齐着字符的。
把padding加到30也不管用。
显示就是图片中这样了(屏幕部分截图)
图片描述

我试着专门设了个paddingTop,也不管用。
我是在Windows环境下,Android机器上测的。
大家碰到过这个问题吗?
还是说iOS手机上没有这个问题。

回复
阅读 5k
2 个回答

你要把text当做inline元素来处理,不要加盒子模型的属性padding、margin等。把view组件当做block元素,盒子模型属性全都正常。

所以你这种情况要在text外面加一个view,在view上设置padding。

如果严格上述模式写页面结构,虽然会有一些标签的冗余,但是不会出各种各样奇怪的问题了

用flex不要用paddding,margin

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏