• 熟悉HTML 常见的标签
• 使用 Emmet 提高码字效率

🐱 练习实践

• HTML 中引入 CSS 的方式
• CSS 中 @import 的使用
• 了解 id 选择、类选择器
• 认识伪类、伪元素

🐱 熟悉CSS选择器

• 用 CSS 画画
• 边框border的使用
• 鼠标的hover状态
• 美化表格的样式
• 使用 inline-block 制作导航条
• 结合前面的知识制作简单页面

• iconfont 字体图标
• 制作精灵图

• 通知条
• 多层级导航栏

• 风景列表

• 两栏布局
• 三栏布局
• 大段文字在容器内水平居中
• 固定宽度的元素水平居中
• 并列三个按钮，在父容器内水平居中
• 图片在容器内水平垂直居中
• 固定宽高的块在浏览器窗口水平垂直居中
• 不定宽高的块在浏览器窗口水平垂直居
• 对话框在屏幕内水平垂直居中
• 使用transform来绘制一个消息框

🐱 页面预览地址

• 使用 JS 改变 DOM元素的样式

• 了解事件冒泡
• 阻止事件冒泡

实现3D翻转效果的登录框

使用 AJAX 向后台发送和请求数据

🎶 播放器链接

用 jQuery 实现 Tab 切换功能

懒加载和瀑布流布局的新闻页面

🎵 功能更丰富的音乐播放器

通过实践理解面向对象编程的思想
图片轮播组件

🐱 预览地址

🐱 预览地址