32、为 CSS4 未来做好准备：PostCSS 插件实战指南

为 CSS4 未来做好准备：PostCSS 插件实战指南

1. 电子邮件地址验证与 postcss-selector-matches 插件使用

在网站开发中，我们常常无法确定用户提交的电子邮件地址是否有效。为了处理这个问题，我们可以使用 :invalid 和 :valid 属性来为 <input> 字段设置样式。同时，我们可以通过 CSS4 Selectors 网站（http://css4-selectors.com/）测试浏览器对 CSS4 选择器的支持。

下面是使用 postcss-selector-matches 插件为输入字段设置样式的步骤：
1. 打开 Node.js 命令提示符，将工作目录切换到项目区域。
2. 在命令提示符中输入以下命令并按回车键：

npm install postcss-selector-matches --save-dev

3. 从代码下载中提取 T69 - matches 伪选择器 文件夹，并将其保存到项目区域的根目录。
4. 将 T69 - matches 伪选择器 文件夹中 css—completed 版本 文件夹内的 matches – pre-compile.css 文件复制到项目区域根目录的 src