CSS样式课堂讲解实用实用教案

上传人:桔**** 文档编号:591341485 上传时间:2024-09-17 格式:PPT 页数:26 大小:1.29MB
返回 下载 相关 举报
CSS样式课堂讲解实用实用教案_第1页
第1页 / 共26页
CSS样式课堂讲解实用实用教案_第2页
第2页 / 共26页
CSS样式课堂讲解实用实用教案_第3页
第3页 / 共26页
CSS样式课堂讲解实用实用教案_第4页
第4页 / 共26页
CSS样式课堂讲解实用实用教案_第5页
第5页 / 共26页
点击查看更多>>
资源描述

《CSS样式课堂讲解实用实用教案》由会员分享,可在线阅读,更多相关《CSS样式课堂讲解实用实用教案(26页珍藏版)》请在金锄头文库上搜索。

1、CSS样式(yngsh)简介CSS(CascadingStyleSheets)样式又叫层叠样式,使用它可以(ky)对网页中的布局元素,如表格、字体、颜色、背景、链接效果和其他图文效果实现更加精确的控制。CSS样式不仅可以(ky)在一个页面中使用,而且可以(ky)用于其他多个页面。第1页/共25页第一页,共26页。创建(chungjin)CSS样式自定义CSS样式(yngsh)HTML标签样式(yngsh)CSS选择器样式(yngsh)第2页/共25页第二页,共26页。自定义CSS样式(yngsh)自定义CSS样式可以对任何文本(wnbn)块或文本(wnbn)区域进行且需要用户手动进行应用。第3

2、页/共25页第三页,共26页。HTML标签(bioqin)样式该样式是对现有(xinyu)的HTML标记进行重新定义,当创建或改变该样式时,所有应用了该样式的文本格式都会自动更新。第4页/共25页第四页,共26页。CSS选择器样式(yngsh)该样式是对某些特定的标记组合进行重新(chngxn)定义,如所有包含了特定ID属性的标记,设置完成此样式后Dreamweaver会自动应用该样式。第5页/共25页第五页,共26页。设置(shzh)CSS样式类型设置背景(bijng)设置区块设置方框设置边框设置列表设置定位设置扩展设置第6页/共25页第六页,共26页。类型(lixng)设置第7页/共25页

3、第七页,共26页。背景(bijng)设置“背景”设置包括设置背景颜色、选择(xunz)背景图像、设置背景图像是否重复及重复的方式、背景图像是否滚动、背景图像相对于应用样式元素的位置。第8页/共25页第八页,共26页。区块设置(shzh)“区块”指网页中文本、图像和层等替代元素,主要用于控制(kngzh)块中元素的间距和对齐方式等。第9页/共25页第九页,共26页。方框(fnkun)设置“方框(fnkun)”设置可以定义控制元素在页面上的放置方式和属性等。第10页/共25页第十页,共26页。边框(binkung)设置“边框”设置包括定义元素周围边框的样式(yngsh)、宽度及颜色等。第11页/共

4、25页第十一页,共26页。列表(libio)设置“列表”设置主要(zhyo)用于控制列表内各项元素的属性,如项目符号类型、项目符号图像和项目符号位置。第12页/共25页第十二页,共26页。定位(dngwi)设置“定位”设置主要用于控制网页元素(yuns),特别是层的位置。第13页/共25页第十三页,共26页。扩展(kuzhn)设置“扩展”设置(shzh)主要用于为打印的页面设置(shzh)分页和为网页元素设置(shzh)视觉效果。第14页/共25页第十四页,共26页。管理(gunl)CSS样式修改CSS样式删除CSS样式复制CSS样式重命名层叠样式应用(yngyng)CSS样式表自定义CSS样

5、式的应用(yngyng)链接外部CSS样式第15页/共25页第十五页,共26页。修改(xigi)CSS样式创建层叠样式(yngsh)后,可以修改样式(yngsh)中的某些参数。第16页/共25页第十六页,共26页。删除(shnch)CSS样式在“CSS样式”面板(minbn)中,选择要删除的样式名称。单击面板(minbn)底部的“删除”按钮即可将样式删除。第17页/共25页第十七页,共26页。复制(fzh)CSS样式复制一个已经创建完成的CSS样式,再对其参数进行修改,即可创建一个全新的CSS样式,这样可以(ky)提高工作效率。第18页/共25页第十八页,共26页。重命名层叠(cndi)样式第

6、19页/共25页第十九页,共26页。自定义CSS样式(yngsh)的应用在CSS样式(yngsh)中的HTML标签样式(yngsh)和CSS选择器样式(yngsh)是自动应用的,只有自定义层叠样式(yngsh)需要用户手动操作。第20页/共25页第二十页,共26页。链接外部(wib)CSS样式通过链接外部CSS样式可将其他(qt)网页中的样式应用到当前网页中。第21页/共25页第二十一页,共26页。应用(yngyng)CSS滤镜效果CSS滤镜是CSS的一个扩展,能把可视化的滤镜和转换效果(xiogu)添加到一个标准的HTML元素上,使应用样式的对象产生模糊、反转、发光等特殊效果(xiogu)。

7、在Dreamweaver8中,可直接在对话框中添加滤镜的参数,而不用编写复杂的代码。第22页/共25页第二十二页,共26页。扩展(kuzhn)的CSS支持在Dreamweaver8中,CSS面板设计成了统一的面板,我们在此面板中可以快速确认(qurn)样式、编辑样式、查看应用于页面元素的样式。第23页/共25页第二十三页,共26页。上机实战(shzhn)本课上机实战主要练习某公司站点的CSS样式定义。在练习中主要用到CSS样式的创建和添加外部CSS样式的链接等知识点,通过(tnggu)练习读者应充分掌握自定义样式、HTML标签样式等CSS样式的创建。在制作中主要分为创建标签样式、自定义文本样式

8、以及创建超级链接样式这3个部分。第24页/共25页第二十四页,共26页。感谢您的欣赏(xnshng)!第25页/共25页第二十五页,共26页。内容(nirng)总结CSS样式简介。CSS样式不仅可以在一个页面中使用,而且(r qi)可以用于其他多个页面。自定义CSS样式可以对任何文本块或文本区域进行且需要用户手动进行应用。“边框”设置包括定义元素周围边框的样式、宽度及颜色等。“列表”设置主要用于控制列表内各项元素的属性,如项目符号类型、项目符号图像和项目符号位置。创建层叠样式后,可以修改样式中的某些参数。在“CSS样式”面板中,选择要删除的样式名称。第24页/共25页。感谢您的欣赏第二十六页,共26页。

展开阅读全文
相关资源
正为您匹配相似的精品文档
相关搜索

最新文档


当前位置:首页 > 高等教育 > 研究生课件

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号