css怎么绘制页面结构,css网页制作的5种技巧，一定要学！

原标题：css网页制作的5种技巧，一定要学！

作为万维网联盟于HTML4.0之外提出的技术，CSS的出现是为了让样式与内容分离，从而提升开发效率。

那么，在css网页制作当中，我们又有哪些实用的小技巧可用呢？

使用css重置

normalize.css这一工具在css网页制作中已经被使用多年了，它能够为你的网站布局设计提供一个比较清晰的标准，来确保跨平台之间的界面一致性。绝大多数的项目只需要一条简单的规则就可以应用于布局中的所有元素，删除如margin、padding这类的默认盒模型。

运用SVG icons

作为用于所有分辨类，并且主流浏览器都支持的SVG。其强大的通用性足以替代其他图片格式。而在FontAwsome5当中，也提供了SVG的图标字体供用户使用。

一致的垂直结构

一致的垂直结构为用户带来了视觉美学，能大幅提升内容的可读性。若owl选择器过于通用，可在元素内使用通用选择器(*)为布局的特定部分创建一致的垂直结构：

隐藏未静音的自动播放视频

在处理源代码无法轻松控制的内容时，对自定义用户样式表来说是一个很好的技巧。它可以避免在加载页面时自动播放视频中的声音干扰访问者，并提供了not()伪选择器：

CSS变量

css网页制作当中，最强大的CSS工具就是CSS变量，使用它，你就可以声明一组公共属性值，这些值可以通过样式表中任何位置的关键字重用。你可能有一套颜色在整个项目中使用，以保持一致性。在CSS中反复重复这些颜色值不仅是件烦人的事情，而且还容易出错。如果某个颜色在某个时刻需要改变，你就不得不去寻找和替换，这是不可靠或不快速的，当为最终用户构建产品时，变量使得定制变得容易得多。

责任编辑：