发表于： 2018-12-02 21:03:14
1 857
今天完成的事情：
（1）用纯CSS编写轮播图
参考：https://www.jianshu.com/p/1635f04a1779?from=singlemessage
流程图解释：
1，把input[type="radio"]的一组按钮用设置相同name属性的方向进行关联，使得这组input可以切换。
2，用label标签可单向绑定input，点击label即可使相应的input被：checked。
3，多个label标签可绑定同一个input，分别为左右切换按钮和底部指示器设置一组label。
4，当input被：checked后，通过选择器可控制图片或label标签的样式。
5，input：nth-of-type（n）是选择input的父元素的第n个input子元素。
6，input ~选择input之后的兄弟元素。
（2）学习JS基础：
JavaScript 显示数据：
使用 window.alert() 弹出警告框。
使用 document.write() 方法将内容写到 HTML 文档中。
使用 innerHTML 写入到 HTML 元素。
使用 console.log() 写入到浏览器的控制台。
JavaScript 数据类型：
值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol（独一无二的值）。
引用数据类型：对象(Object)、数组(Array)、函数(Function)。
JavaScript 拥有动态类型：这意味着相同的变量可用作不同的类型。
明天计划的事情：
继续学习JS
遇到的问题：
css自动轮播可用@keyframes动画实现定时循环切换，但是css不能实现同时按钮切换和自动轮播。
收获：
了解了input：checked的用法，在用css编写下拉导航时也使用过。请师兄再看看任务还有哪些需要修改的。
返回列表
评论