SwiftUI的布局修饰符可能会让你有点困惑，如果你来自HTML和CSS。
CSS有大量的属性可供选择，而SwiftUI则试图让事情变得更简单。为了做到这一点，它利用了将修饰符“链接”在一起的能力。
例如，如果有一个矩形需要8像素的内部填充、1像素宽度的边框和10像素的外部边距，则可以使用CSS将其表示为：

.my-rectangle {
  padding: 8px;
  margin: 10px;
  border: 1px solid red;
}

在CSS中，这些属性在双括号中的顺序并不重要;每一个都有特定的意义，而且套用方式相同，即使border属性是在结尾或开头。
不过在SwiftUI中，样式是通过对View应用一个修改器来完成的，给你一个应用了修改的新视图。然后你可以对这个视图应用另一个修改器，然后再应用另一个，依此类推。因为每个修改器都在适应之前发生的事情，所以顺序非常重要。
因此，如果我们有一个视图，我们需要添加与上例相同的间距，我们可以将其结构如下：

MyView()
  .padding(8) // <-- internal padding
  .border(Color.red, width: 1) <<-- apply the border
  .padding(10) // <-- apply more padding outside the border

像这样逐步构建视图，可以让SwiftUI将大多数视图所需的修改器数量保持在合理的小范围内。
当你开始构建更复杂的视图时，你会遇到堆栈和网格，它们在子级之间也有spacing的概念。根据你的设计，考虑使用间距而不是外部填充可能更有用，特别是当你开始将你的设计分解成可重用的组件时。
但是，考虑按顺序应用更改，而不是像CSS那样一次应用所有更改，是构建伟大的SwiftUI视图的关键。