Sass中&符号包含对当前选择器以及任何父项的引用。Sass变量如果在选择器外部声明，则该变量在声明后对文档中的每个选择器都可用。
建议使用:root的主要原因是因为CSS不仅用于设置HTML文档的样式。它还用于XML和SVG文件。对于XML和SVG文件，:root不是选择html元素，而是选择它们的根（例如svg文件中的SVG标记）。因此，全局范围的自定义属性的最佳实践是:root。
CSS属性scroll-behavior为一个滚动框指定滚动行为，其他任何的滚动，例如那些由于用户行为而产生的滚动，不受这个属性的影响。在html根元素中指定这个属性时，将适用于整个视窗口。在某个元素上指定这个属性时不会传播到视口之外。有的用户代理可能会忽略这个属性。
有时您可能需要进行自定义HTML5视频控件开发，那么您就需要先隐藏原生HTML5视频控件。
chrome浏览器如何开启显示shadow DOM的功能
在Web开发的时候，有些交互特效比较复杂，需要使用视频实现，但是视频的背景色做不到是透明的，导致设计师在制作视频的时候必须跟背景融合在一起。
CSS mix-blend-mode混合模式中有一种混合模式名为滤色，单词是screen，其有一个很有意思的特性表现，那就是黑色和其它元素进行混合的时候表现为透明。视频背景色设置为黑色，同时设置如下CSS即可： mix-blend-mode: screen;
HTML中的元素用于显示表格数据。table表格无非就是tr行和td|th列组成。元素表示“表格标题”，元素表示“表格数据”。
音频audio和视频video无法自动播放这个在IOS上面一直是个惯例。桌面版的Safari在2017年的11版本也宣布禁掉带有声音的多媒体自动播放功能，紧接着在2018年4月份发布的Chrome 66开始也正式关掉了声音自动播放，也就是说在Safari、Chrome、opera浏览器中音频audio和视频video自动播放功能都将失效。
上一篇介绍了Flex容器属性，本文将介绍Flex项目属性order、flex-grow、flex-shrink、flex-basis、flex、align-self。
select option有浏览器默认样式，且对自己的样式有一定的保护（基于css规则）。然而当设置 appearance: none 的时候，就相当于让select元素脱离浏览器内置select样式了。此时它相当于一个div，开发者就可以灵活设置样式了。而option还是略有不同，css规则暂时还未暴露更多的权限给开发者。
