百度前端技术学院是一个为大学生创办的免费的前端技术实践、分享、交流平台。由百度校园招聘组、百度校园品牌部、百度前端技术部以及多个百度的前端团队联合创办。学院组织了一批百度在职工程师,精心编写了数十个实践编码任务,将技术知识点系统有机地串联在各个充满趣味与挑战的任务中,同学们通过实际地编码练习来掌握知识,再辅以互相评价、学习笔记等方式,加深对于学习内容的理解。在过去的三年中,百度前端技术学院累积吸引了上万名同学参加,并且有数十名同学在学习后,顺利加入了百度,成为了百度的前端工程师。

使用CSS实现折叠面板

进阶

人数215人在学习该课程,有156人已经完成该课程

时间平均用时1.0

课程概述

作业提交截止时间:04-24

任务目的

  1. 深入理解html中radio的特性
  2. 深入理解CSS选择器以及伪元素的使用

任务描述

  1. 使用input的radio单选框特性结合CSS中的伪元素实现bootstrap中折叠面板(点击查看样例),要求样式一致。

任务注意事项

  1. 当其中一个面对折叠时,其他面板需要隐藏
  2. 只能使用HTML,CSS,不允许使用JavaScript
  3. 注意测试不同情况,尤其是极端情况下的效果
  4. 有能力的同学在面板折叠或者展开时添加动画效果

参考资料

  1. MDN label: 了解html中label的基本知识
  2. MDN Adjacent sibling selectors: 了解CSS中的兄弟相邻选择器
学员提交的作业 (-)
学员名称提交时间提交的代码预览效果评价数平均得分操作
课程优秀学习笔记

暂无优秀学习笔记~