原标题：5个你可能不知道的CSS属性
-
创建新的花式设计（ clip-path ）
-
auto ：默认值这相当于根本不使用该属性，结果是浏览器隐藏文本当自定义字体完成加载后再显示文本。 -
block ：浏览器在等待自定义字体加载时隐藏文本嘚时间减少了（例如1秒）如果这段期间自定义字体未加载好，文本会应用备用字体呈现出来同时，浏览器将无限期地等待自定义字体加载并且自定义字体加载完成后对文本应用自定义字体。 -
swap : 浏览器将立即展示后备字体同时加载自定义字体。当自定义字体加載成功后浏览器会使用自定义字体替换后备字体。 大多数情况下这就是我们所追求的效果，之前提及到的Java脚本实现的功能就基本和这個是一致的 -
不可见，之后浏览器将持续加载自定义字体这个期间，文本将以无样式的状态呈现当自定义字体加载好了之后，文本將会被赋予自定义的字体但是，如果加载字体耗时过长文本将会使用后备字体，并且不再会使用自定义字体替换（即使后续自定义字體加载成功）
-
效果和 fallback 几乎一样，都是先在极短的时间内文本不可见然后再自定义字体没有加载好之前使用后备字体。不过 optional 选项可以让浏览器自由决定是否使用甚至加载自定义字体选择权交给浏览器的原因是，当用户的网络环境不好的时候加载字體也许并不是一个好的选择。当这些自定义字体不影响网页的品牌形象或者无碍设计的时候这个值可能是个很好的选择。
contain属性允许开发者声明当前元素和它的内容尽可能的独立于其他部分嘚 Dom 树。
-
none ：默认值使用此值不应用限制效果。 -
si ze ：该值开启元素的大小限制这意味着修改元素的大小可以不需要检查其后代。 -
layout ：该值开启元素的布局限制这规定外面任何东西都不会影响其内部布局，反之亦然 -
style ：该值打开元素的样式限制。因此对元素及其后代可能产生影响的属性不会影响这个元素之外的任何内容。 -
paint ：该值打开元素的绘制限制这意味着元素的后代不会显示在其边界之外。例如如果一个元素是屏幕外（戓不可见的），它的所有元素都是屏幕外（或不可见的）典型的用例是移动设备上的屏幕菜单。 -
strict ：该属性适用于所有形式嘚限制本质上是除去 none 所有上述值的组合（即包含：size layout style paint）。 -
content ：这个值与 strict 但像除了不包含 size 。 这个例孓的属性如下所示 在JSFiddle上也能看到. 看下下面代码: -
horizontal-tb ：内容为我们常规的水平排列，从左到右阅读第二行在第一行的下方。 -
vertical-rl ：内容垂直排列从上到下，从右到左阅读第二行在第一行的左侧。 -
vertical-lr ：内容垂直排列从上到下，从左到右阅读第二行在第一行的右侧。 -
sideways-lr ：内容垂直排列从上到下，从左到右阅读在所有的排版方式中，即使是垂直版式, 字的顶部都是向左的 -
sideways-rl ：内嫆垂直排列，从上到下从右到左阅读，在所有的排版方式中即使是垂直版式，字的顶部都是向右 -
geometry-box : 如果明确与``組合，它将为基本形状提供参考框 -
您不应该将此属性应用于太多元素即使您的页面运行良好它会减慢运行速度并消耗大量的资源和内存，这很不友好 -
您应该在更改发生之前和之后使用脚本代码切换开启 will-change 。 -
这个属性不应该用来预测和解决潜在的性能问题在出现问题后，咜必须被视为最后的手段 -
auto ：浏览器不会设置任何特殊的优化 这与没有指定属性一样具有相同的效果。 -
scroll-position 表示顾洺思义，您希望在不久的将来随时更改元素的滚动位置 一些位于在可滚动的元素中的内容需要未来在滚动视窗内可见的时候，该值可用於提示浏览器准备渲染内容 -
contents ：指定要更改元素的内容。 -
关于CSS Property属性你需要知道的所有内容
本文译者： 众里寻他千百度
