【CSS3】-webkit-margin-before与margin-top

p{
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
}

before、after、start、end是用在对文本的。比如说，中文和英文是从左到右，从上到下阅读的，那么，before = top， start = left，end = right，after = bottom。这叫做“writing-mode”，简单来说就是书写方式。
但是，日文的书写方式就不一样了，他们是从上至下，从右到左书写的。那么在这种write-mode下，before = right， start = top，end = bottom，after = left。
所以上述代码相当于：

p {
 margin-top: 1em;
 margin-bottom: 1em;
 margin-right: 0px;
 margin-left: 0px;
}

margin-before的用意就是，不论是哪种writing-mode，我们都可以设定“开始那边的边距”这样的内容，而不需要为了适应不同的writing-mode写几种margin。

总之来说，使用-webkit-margin-before或者是margin-top，都是为了更好的兼容

转载于:https://www.cnblogs.com/Horsonce/p/7753644.html