创建并引用样式类

在用CSS进行网站设计时，会遇到一种情况：相同的标志可能在不同的地方显示的效果不一样。怎么办呢，有一种办法即是采用上节所讲的直接插入式，逐个逐个地进行属性设置，如果该类标志比较少，这倒还可以；如果多了，可就有点令人厌烦了。
　　解决的办法就是采用样式类。
　　样式类，顾名思义是样式的分类，它可以根据不同的风格需要对某一类型的标志设置几种不同的CSS属性，也可以对整个风格分成几个类而不是只针对某一种类型的标志。
　　一、样式类的建立
　　样式类可在我们上节讲的外部文件与文档头方式中建立，而不能在直接插入式中建立。它的建立格式有以下两种：

　　在第一种方式中，我们可对某一类型的标志建立样式类，如：　

　　上边的例子中，所有段落标志的字体都为宋体，大小为10pt，颜色为红色，由于排版的需要又分成了三个样式类，分别具有不同的排版属性，从这个例子你可以看出层叠样式单之所以为层叠，其意义也在于此。
　　第二种方式的用处则在于它规定的样式类，没有特定于某一类标志，而是其它类型的标志都可以用。 如：

它规定了三个样式类，几乎所有的类型都可以引用它们。
　　　有一点要注意，样式类与我们上节所讲的统一风格形式并不相冲突，样式类更多地强调了风格的异，而统一的设置形式则强调了风格的同。两者常相互结合，实现样式风格的叠加，使网页风格在整体统一的基础上而各自又绚丽多彩。
　　二、样式类的引用
　　 样式类的引用很简单，只需在标志后面设置Class属性值为样式类名即可，引用格式如下：
　　　　<标志 Class="样式类名">
　　如我们上边用第一种方式建立的样式类在一个段落标志中引用，
　　　<P Class="isLeft">你好，欢迎你来到网页制作学习园地</p>。
　　要再次提醒一下，用第一种方式设置的样式类只能用于样式类所属的标志类型的标志中；而第二种则没有限制。
　　如果我们要动态改变某个引用了样式类的标志风格， 可通过脚本语言来修改标志对象的className属性，具体方式如下：
　　所要修改标志的标识号.style.className="样式类名"，如对一标志<p id="p1" class="isLeft">hello</p>修改为右排列的样式，在脚本语言中修改语句如下：
　　　p1.style.className="isRight"

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有