建站知识:如何使用JS来自由切换css样式表

html-css08

建站知识:如何使用JS来自由切换css样式表,第1张

详细方法如下：第一步：在连接样式表的元素里定义一个id,例如<link href="1.css" rel="stylesheet" type="text/css" id="css">我定义的id是css。第二步：写一个js函数，代码如下：<script type="text/javascript">function change（a）{var css=document.getElementById（"css"）；if （a==1）css.setAttribute（"href","1.css"）；if （a==2）css.setAttribute（"href","2.css"）；}</script>这个函数的code可以放在页面的任何地方。第三步：为改变页面的样式表的连接添加一个函数的触发事件，代码如下：<a href="#" onClick="change（1）">1.css</a><a href="#" onClick="change（2）">2.css</a>该效果在IE和FF下均测试通过，相信大家看完后因该非常明了，利用这个方法我们可以让浏览者自己选择需要显示的样式表，好比年迈者可以选择一个字体较大的样式表。这里需要留意的两点是：另外假如是改变整个页面的样式，你需要在样式表文件里定义body的高度为100%

1。 body{

background-color:#FFFFFFCURSOR: url('http://webme.bokee.com/inc/mouse127.ani') }

a{CURSOR: url('http://webme.bokee.com/inc/mouse094.cur')

鼠标地址自己根据需要进行改动。

2。

#phx{FILTER: Alpha(Opacity=100, FinishOpacity=10, Style=2, StartX=20, StartY=40, FinishX=0, FinishY=0) interWIDTH: 220pxHEIGHT: 32px}

代码放在css的任意空白处都行，代码中的width是调整宽度的，height是调整高度的，自己根据需要调

3。filter:glow (color=#ff0000,strength=3)

把上面的代码加到需要做闪字的地方，颜色和闪光的快慢自己设置。例如：需要标题有闪光

#header div.tit{FILTER: glow(color=#E8FFE8,strength=4)－－－－}

4。空间名称和简介区域

#header 主体部分{height:89pxbackground:url(图片地址) repeat-x}

}－－－－－－整个标题背景图片，这里加了下面两项就别加了

#header div.lc 左背景图{background:url(图片地址) no-repeat}

#header div.rc 右背景图{background:url(图片地址) no-repeat top right}

5。两种：

（1）整个空间只需要一张图片（需要大图片），则在这里设置

body

{background-color:#FFFFFFbackground-image:url(图片地址) no-repeat }

然而#header{height:240pxbackground:url() repeat-x}

#header div.lc{background:url() no-repeat}

#header div.rc{background:url() no-repeat top right}

.stage{background:#DFFFB2background:url(图片地址)}

则别再加图片

（2）标题和下面内容区域用不同的图片

#header{height:240pxbackground:url(图片地址) repeat-x}

#header div.lc{background:url() no-repeat}

#header div.rc{background:url() no-repeat top right}

.stage{background:#DFFFB2background:url(图片地址)}

在这两项中加入图片，而

body

{background-color:#FFFFFFbackground-image:url(图片地址)

则别再加图片