逐浪CMS-调用风格

来自站长百科
Zhaoc讨论 | 贡献2010年6月1日 (二) 22:47的版本
跳转至: 导航、​ 搜索

导航:返回上一页

逐浪CMS-调用风格

CSS常见的调用方法有以下四种:


方法一

使用STYLE属性: 将STYLE属性直接加在个别的组件标签里。

<组件(标签) STYLE="性质(属性)1: 设定值1; 性质(属性)2: 设定值2; ...}

例如:

这种用法的优点是可灵巧应用于各标签中,但是缺点则是没有整篇文件的『统一性』。


方法二

使用STYLE标签: 将样式规则写在<STYLE>...</STYLE>标签之中。

<STYLE TYPE="text/css">

<!—

样式规则表

-->

</STYLE>

例如:

<STYLE TYPE="text/css">

<!—

BODY {

color: BLUE;

background: #FFFFCC;

font-size: 9pt}

TD, P { COLOR: GREEN;

font-size: 9pt}

-->

</STYLE>

通常是将整个的 <STYLE>...</STYLE>结构写在网页的<HEAD> </HEAD>部份之中。

这种用法的优点就是在于整篇文件的统一性,只要是有声明的的组件即会套用该样式规则。

缺点是在灵活度不足、代码维护不便。


方法三

使用 LINK标签: 将样式规则写在.css的样式档案中,再以<LINK>标签引入。

假设我们把样式规则存成一个example.css的档案,我们只要在网页中加入:

<LINK REL=STYLESHEET TYPE="text/css" HREF="example.css"> 即可套用该样式档案中所制定好的样式了。

通常是将LINK标签写在网页的<HEAD> </HEAD>部份之中。

这种用法的优点就是在于可以把要套用相同样式规则的数篇文件都指定到同一个样式档案即可。缺点是在个别文件或组件的灵活度不足。


方法四

使用@import引入:

跟LINK用法很像,但必 放在<STYLE>...</STYLE> 中。

<STYLE TYPE="text/css"> <!— @import url(引入的样式表的地址、路径与档名); --> </STYLE>

例如: <STYLE TYPE="text/css"> <!— @import url(http://yourweb/ example.css); --> </STYLE> 要注意的是,行末的分号是绝对不可少的!切记切记!

而四种应用方法各有其优缺点,您可以综合地使用,并不会相互抵触。

但是如果相同的性质属性遇上重复的声明的话,就要考虑套用优先权的问题了!

CSS调用优先权的顺序有以下的几点原则

网页设计者的样式设定 > 使用者的样式设定 > 浏览器的样式设定 STYLE属性的样式设定 > STYLE标签样式设定 > 链结进来的样式设定 后面声明的样式设定 > 前面的样式设定

所谓『链结进来的样式设定』指的就是用上面提到过的LINK标签与@import引入这两种应用方式所链结进来的样式设定,逐浪CMS模板调用模式一般采用第三种link方式链接,特殊情况下也可以使用第四种调用方式。

参考来源