您正在学习的是试看内容,报名后可学习全部内容 报名课程
人气值 6.7k

写 CSS 也要开脑洞:万能的 `:checked + label`

你可能不知道,网上那些看起来高大上的表单控件,实现的机制都是 :checked + label。这一对 CSS3 新增的选择器帮助我们将纯 CSS 组件的版图拓展出去一大块。再复合其它的元素和选择器,比如动画、~ 、flexbox,我们可以开发出更多又好看又好用兼容性又好的表单控件。

本次分享将包含以下重点:

  1. 使用 <label> 替换常规 radiocheckbox
  2. 开关控件的编写
  3. 多选控件的编写
  4. 星星打分控件的编写
  5. 结合 Vue 开发标签输入组件

通过学习本次分享,您将学会:

  1. CSS 预处理工具 Stylus 的使用
  2. 了解到 CSS3 若干新增元素
  3. CSS 动画基础

分享长度:约1小时,以现场写+调试代码为主

面向观众:

  1. 写过 CSS,具备 CSS 基础。
  2. 平时布局写的比较多,希望学习了解其它 CSS 技巧。
  3. 对组件比较感兴趣的同学。