前端开发学习, CSS是基础的部分,比较易懂好学.今天给大家分享一些小技巧.
20个有用的CSS小技巧，来帮你把CSS技能提高到高级水平 [Github上有8000多个star]。包括Flexbox、REM、:not()选择器、负的nth-child等。
01、使用CSS复位
CSS复位可以在不同的浏览器上保持一致的样式风格。您可以使用CSS reset 库Normalize等，也可以使用一个更简化的复位方法：
02、继承box-sizing
03、为 body 元素添加行高
04、使用 :not() 选择器来决定表单是否显示边框
05、垂直居中任何元素
06、使用负的 nth-child 来选择元素
07、逗号分隔列表
08、使用 SVG 图标
09、使用 “形似猫头鹰” 的选择器
10、使用 max-height 来建立纯 CSS 的滑块
11、创造格子等宽的表格
12、利用 Flexbox 去除多余的外边距
13、给 “默认” 链接定义样式
14、一致垂直节奏
15、固定比例盒子
16、为破碎图象定义样式
17、用 rem 来调整全局大小；用 em 来调整局部大小
18、隐藏没有静音、自动播放的影片
19、使用选择器:root来控制字体弹性
20、为更好的移动体验，为表单元素设置字体大小
支持情况
这些技巧适用于最新版的 Chrome, Firefox, Safari, Opera, Edge, 以及 IE11
分享到:
閱讀更多 WEB前端交流 的文章
