什么是样式？样式有哪些作用？样式的书写？

      CSS（Cascading Style Sheets）层叠样式表，主要作用：装饰页面、排版布局。

      1、装饰：对于元素进行装饰，例如背景颜色、边框线、字体....

      2、布局排版：对元素的排版控制，例如元素与元素之间的距离、位置、元素的高度....

【 案例展示 】

学习任务

重点、难点

突破方法

1. CSS3的高级应用。

1. HTML5中新增加的CSS3样式。

2. 教学难点：CSS3高级应用。

采用翻转课堂、项目导入的教学模式，采用分组讨论、案例教学、演示动画等教学方法，运用在线教学平台。

知识目标

能力目标

素质目标

1.掌握CSS3中边框、背景的设置。

2.掌握CSS3中渐变、倒影等的设置。

3.进行CSS3的灵活应用。

1.能够进行样式的简单使用。

2.能进行复杂样式的使用。

1. 养成积极主动学习意识；

2. 养成勤于动手的习惯；

3. 培养团队合作能力。

课程思政——审美与历史传承

【 视频讲解】

知识储备及案例实现

1、图片边框属性1

2、图片边框属性2

3、图片边框属性3

4、圆角边框1

5、圆角边框2

6、盒子阴影属性1

7、盒子阴影属性2

8、盒子倒影

9、不透明度设置

10、背景图像大小的设置

11、背景图像定位与裁切

12、多重背景效果

13、线性渐变1

14、线性渐变2

15、径向渐变

16、重复渐变1

17、重复渐变2

【 资料下载 】

单元设计

CSS3的高级应用

课程教案

CSS3的高级应用

演示文稿

CSS3的高级应用

任务工单

CSS3的高级应用

案例源码下载

       背景设置

       背景定位

       背景大小

       边框效果

       倒影设置

       图片边框

       圆角边框    

      images.rar

课内同步项目

      多背景

课外扩展项目

     盒子阴影

练习题

 1、练习1

疑难问题解答

1、CSS的高级应用。