javascript动态改变css

最新推荐文章于 2023-11-09 15:10:34 发布

iteye_14928

最新推荐文章于 2023-11-09 15:10:34 发布

阅读量145

点赞数

分类专栏： javascript 文章标签： CSS JavaScript XHTML HTML ViewUI

本文链接：https://blog.csdn.net/iteye_14928/article/details/81653241

版权

javascript 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title> new document </title>
  <meta name="generator" content="editplus" />
  <meta name="author" content="text/html; charset=utf-8" />
  <meta name="keywords" content="" />
  <meta name="description" content="" />
  <link rel="stylesheet" href="left.css" type="text/css" title="left"/>
  <link rel="alternate stylesheet" href="right.css" type="text/css" title="right"/>
  <script type="text/javascript">
	function alterStylesheet(title) {
		if(!title)return;
		var _links = document.getElementsByTagName("link");
		for(var i = 0, len = _links.length; i < len; i++) {
			var a = _links[i];
			a.disabled = a.title == title ? false : true;
		}
	}
  </script>
 </head>

 <body>
	<select οnchange="alterStylesheet(this.value)">
		<option value="left">left</option>
		<option value="right">right</option>
	</select>
	<img alt="图片" id="img1"/>
	<p id="content">
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
		我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字我是文字
	</p>
 </body>
</html>

left.css

body img#img1 {
		display: block;
		width: 200px;
		height: 150px;
		background-color: #E0E0E0;
		border: solid 1px #3377cc;
		float: left;
		margin-right: 12px;
		margin-bottom: 2px;
	}
	body p#content {
		font-size: 14px;
	}

right.css

body img#img1 {
        display: block;
        width: 200px;
        height: 150px;
        background-color: #E0E0E0;
        border: solid 1px #3377cc;
        float: right;
        margin-left: 12px;
        margin-bottom: 2px;
    }
    body p#content {
        font-size: 14px;
    }

iteye_14928

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript动态改变css

&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;
复制链接

扫一扫

专栏目录