懂点HTML和CSS会让你的职业生涯发生巨大的改变。学习技术不仅仅是生产助理亦或是印刷设计师的事——无论你是小企业主、销售经理、事件协调员还是魔术师，都能让你受益于HTML和CSS知识。下面是三个CSS属性，大家跟着来学习一下吧。

类型: Margin

默认值: 看每个独立属性

取值: | | auto

适用于: 所有元素，除非 table | inline-table | table-caption 的表格类元素之外

取值

auto 水平(默认)书写模式下，margin-top/margin-bottom计算值为0，margin-left/margin-right取决于可用空间。详见：margin系列之keyword auto

：用长度值来定义外补白。可以为负值

：用百分比来定义外补白。水平(默认)书写模式下，参照其包含块 width 进行计算，其它情况参照 height ，可以为负值

margin折叠常规认知：

margin折叠只发生在块级元素上

浮动元素的margin不与任何margin发生折叠

设置了属性overflow且值不为visible的块级元素，将不与它的子元素发生margin折叠

绝对定位元素的margin不与任何margin发生折叠

根元素的margin不与其它任何margin发生折叠

demo

See the Pen mAbpam by yrq110 ( @yrq110 ) on CodePen .

margin-top

类型: Margin

默认值: 0

取值: | | auto

适用于: 所有元素，除非 table | inline-table | table-caption 的表格类元素之外

取值

auto 水平(默认)书写模式下，其计算值为0

：用长度值来定义外补白。可以为负值

：用百分比来定义外补白。水平(默认)书写模式下，参照其包含块 width 进行计算，其它情况参照 height ，可以为负值

demo

See the Pen kkNvqm by yrq110 ( @yrq110 ) on CodePen .

margin-right

类型: Margin

默认值: 0

取值: | | auto

适用于: 所有元素，除非 table | inline-table | table-caption 的表格类元素之外。

HTML和CSS是网页的基础。所以，它们也是你提升自我技术技能至新水平的基础。掌握这个基础之后能让你更为轻松地学习其他的编程语言(如JavaScript、Ruby和PHP)。而且你学会得越多，就业前景就业机会就越多。