CSS样式表高效使用的技巧.pptVIP

CSS样式表高效使用的技巧 1、在一个网页中同时调用CSS的多种引入方式 在HTML中引入CSS的方式很多，例如直接插入式，使用链接外部样式表，使用CSS@import导入样式表以及在内部元素中使用STYLE标记来定义样式表等。浏览器在处理网页中的样式表是按照一定的顺序来处理的，首先检查页面中是否有直接插入式CSS，如果存在就先执行它，针对本句的其它CSS就不去管它了；接着检查网页源代码中的STYLE标记，有就执行了；接下来再依次检查执行@import导入的内部样式表和链接的外部样式表。因此，我们完全可以在一个网页中同时调用CSS的多种引入方式。 2、快速创建CSS外连式文件 对于一个初接触CSS的网页设计人员来讲，要用写字板之类的编辑器，去创建一个CSS外连式文件是相当困难的。由于Dreamweaver对CSS支持的很好，用它来帮助就轻松多了。具体可以这样操作：首先在纸上写好在网站的网页中可能要用到的格名称，然后在Dreamweaver的编辑窗中调出CSS面板，一个一个地定义，并在一个空白页上适当地写一点相关内容，边定义边试用，效果不满意，立即修改；全部定义好后，再用记事本创建一个空的CSS外连式文件，把在〈head〉与〈/head〉之间的那段定义好的CSS复制到CSS文件中去，就大功告成了。 3、让背景图案静止不动 当网页不能在一屏全部显示时，往往借助于水平滚动条和竖直滚动条来浏览屏幕以外的内容，移动滚动条时一般图象和文字是一起移动的，利用CSS就可以实现使背景图象不随文字一起“滚动”目的。 　　 用DreamWeaver来设计网页的用户知道，在DreamWeaver中输入空格不是那么的方便，可以利用css来设计“首行缩进”功能来弥补这个缺憾。打开DreamWeaver的设计界面，在该界面中找到CSS的属性定义对话框（StyleDefinitionfor.style1)，在该对话框的“Block”标签下的“text-indent”属性定义设置项中来设置“首行缩进”功能，在这里要注意的是，所谓“首行”是指每段内容的第一行，也就是直接按回车键就形成了一个新的段落。缩进最好以“em”（字符）为单位 4、巧用css来设定文字的背景 在DreamWeaver中，如果需要给文字加上不同的背景颜色时，操作上很简单，只要用鼠标单击属性面板上的文字颜色按钮，从弹出的颜色设置栏中选择需要的颜色就可以了。但如果要给部分文字加不同的背景色，可以巧妙利用css来实现这样的目的。具体操作过程是，首先可以先做一个定义背景色的CSS，例如给这个css命名为bjstyle，接着在网页中选中需要设置颜色的文字，然后在工具栏中单击一下“bjstyle”就行了。 * * * * * 谢谢观赏 WPS Office Make Presentation much more fun @WPS官方微博 @kingsoftwps * * *