从这周开始,我将会把每周看到有关于CSS有意思的技巧整合成一篇文章。将会在每周的星期天整理发布,每篇文章中将会以CSS的技巧为主线进行介绍,但每个技巧不会深入的阐述。主要目的给对CSS感兴趣的同学增强CSS的眼界,扩大知识面和使用场景。同时也希望能帮助大家将一些CSS技巧运用到实际项目中,另外提高自己在这方面的技术。如果感兴趣的话,可以持续关注,或者有你相关的技巧也可以和我们一起共享。
今天介绍了一些小技巧,主要涉及到响应式图片的处理、纵横比属性aspect-ratio
、嵌套选择器、自定义属性配合计数器动态生成内容、借助HTML5的<details>
和<summary>
元素来做一个可点击的下拉菜单,滚动特性以及JS-in-CSS。其中aspect-ratio
、 嵌套选择器和Js-in-CSS是较新的特性,特别是后两者,应该是最有为意思的部分。