1、单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,主要内容,(P107),CSS,简介,创建,应用,编辑,调用外部样式表,第十二讲,CSS,样式,*,CSS,简介,CSS,:Cascading Style Sheets,层叠样式表,/,级联样式表,作用,:,定义网页元素的样式,.,可以定义文本的字体、字号、对齐等样,式,还可定位一些特殊的,HTML,的属性,如滤镜、特效等。,创建,1.,打开,CSS,样式面板,(Shift+F11),2.,单击,”,新建,”,按钮,(1).,自定义样式,:,作用,:,定义某个特定对象的样式,如一段文本的大小,首行缩进,行距
2、光标样式,滤镜效果等,.,步骤,:,在名字输入框中输入,.name,在弹出的样式表属性定义对话框中设置,.,设置完成后在样式面板上会出现此样式名称,.,应用,:,选中要应用样式的对象,单击面板上的样式名即可,.,掌握,:,文字常用,9pt,大小,20px,间距,(,类型,/,大小、行高,),精确首行缩进,(,区块,/,文字缩进,),注意,:,只能在一个具体空间内部,(,如在一个单元格或层内,),的全体文本上,或者是一段文本,(,),才能应用,.,光标,/,滤镜,(,扩展,/,光标、过滤器,),(,2,)重定义,HTML,标签:,作用,:,对,HTML,标签的重新定义。,步骤,:,在标签列表中
3、选择要重新定义的标签,在弹出的样式表属性定义对话框中设置,.,设置完成后自动应用。名称不会出现在样式面板上。,掌握,:,背景图像平铺问题(重定义,标签),表单元素样式(),表格,(),、,图像,等。,(,3,)使用,CSS,选择器,作用,:,实现超级链接的样式重新定义,超级链接的四个状态,:,a:link-,没,访问的超级链接的状态,a:hover-,鼠标经过超级链接时的状态,a:active-,正在单击,超级链接时的状态,a:visited-,访问过的,超级链接的状态,步骤:,在名字输入框中选择状态,在弹出的样式表属性定义对话框中设置,.,设置完成后自动应用。名称不会出现在样式面板上,.,元
4、素,说明,BODY,网页文档的主体元素,所有的可见范围都在元素内,BUTTON,表单域的按钮,可以有“发送,(submit)”,、“重置,(reset)”,等形式,DIV,定义了网页上的一个区域,这个区域的高度、宽度或者绝对位置都是以知的,IMG,图片元素,通过指定“,src,属性来指定图片的来源,INPUT,输入表单域,MARQUEE,移动字幕效果,SPAN,定义了网页上的一个区域,这个区域的高度、宽度或者绝对位置都是以知的,TABLE,表格,TD,表格数据单元格,TEXTAREA,文本区域,TFOOT,多行输入文本框,TH,表格标题单元格,THEAD,表格标题,TR,表格行,IE4.0,以
5、上支持的滤镜属,样式问题,编辑样式:,在,CSS,样式面板中,单击“编辑样式”按钮,显示样式编辑窗口,选择要编辑的样式双击即可。,样式冲突:(,P112,),当两种样式作用于同一个对象,且样式设置不同时,会产生冲突。,冲突时,显示最内部的样式,CSS,样式高于,HTML,样式。,注意问题,应用:,一篇网页文档可以先设置,标签样式,指定文字样式,(固定大小、颜色、行距等),其次可指定,(,),标签样式,进一步指定表格中,文字的样式。,如果某些网页元素有具体要求,可重定义其标签。,指定超级链接的样式,当有网页元素(如某段文本)有特殊要求时,(,如颜色,).,可直,接在属性检查器中修改,.,当有网页
6、元素(如某段文本)有特殊要求时,(,如大小,),,可,为其定义自定义样式,只对此处应用。,调用外部样式表,意义,调用在其它页面中已经建好的样式表,使整个网站风格统一(如每个页面都是一样的字体、链接效果等),设置,1.,先建立外部样式表,(,只有外部样式表才能被其他页面调用,),建立新的样式时,选择“新建样式表文件”,并在站点中保存此样式,.,将已建立的只在本文档中使用的样式导出成外部样式表,.,选中样式,右击,/,导出样式表,然后保存,.,2.,调用,打开,CSS,样式面板,单击“附加”样式表按钮,浏览选择外部样式表文件,.,调用的样式表使用方法与本页面样式相同,.,注意,:,建立样式表前先确定是否要共享,共享则将其定义为外部样式表文件,.,其他注意参看“注意问题”,.,第十二讲总结,样式表创建与应用,(,三种样式,),作业,:,为所做的个人网站设定,CSS,样式,