uniapp对uni-row设置margin-top和padding-top在小程序上失效

结论

uniapp中uni-row属于行内元素，view属于块级元素

---

项目中使用uni-row配合uni-col实现了一个包含picker的搜索框，同时对uni-row设置了margin-top。如图

在hbuilder上渲染后界面达到了预想的结果，但是后来移植到微信小程序后顶上的间距就消失了。

查到这篇文章说是由于“当两个容器嵌套时,如果外层容器和内层容器之间没有别的元素，编辑器会把内层元素的margin-top作用与父元素”，同时提及了使用padding-top代替margin-top的方式，在尝试后仍然没有解决问题。

最终查到了这篇文章：给行内元素设置padding和margin是否有效

文章提及，对于行内元素来说，margin-left、margin-right、padding-left、padding-right有效，但margin-top、margin-bottom、padding-top、padding-bottom都无效，于是猜测uni-row属于行内元素。而对于块级元素，top、bottom、left、right设置都有效。

于是给uni-row内部的view元素设置margin-top、padding-top属性，成功解决问题，说明view属于块级元素，而uni-row属于行内元素。

---

刚开始写博客，表达可能不清楚，继续学习进步！