Jquery中文网 www.jquerycn.cn
Jquery中文网 >  CSS教程  >  经典实例  >  正文 超简单换皮肤代码

超简单换皮肤代码

发布时间:2020-05-22   编辑:www.jquerycn.cn
jquery中文网为您提供超简单换皮肤代码等资源,欢迎您收藏本站,我们将为您提供最新的超简单换皮肤代码资源
 代码如下 复制代码

超简单换皮肤代码
<!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>
<script>
function changeStyle(name){
css=document.getElementById("cssfile");
css.href=name ".css";
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<link href="css1.css" rel="stylesheet" type="text/css" id="cssfile" />
</head>
<body>
<div id="header">
<h1>css2.0的优势</h1>
</div>
<div id="nav">
<input type="button" value="经典蓝" onclick="changeStyle('css1');"/>
<input name="button" type="button" onclick="changeStyle('css2');" value="宝石红"/>
</div>
<div id="content">
网站的换肤工能是册 过却本来实现的脚本能免地网页中的个对进行疚互日用品我们先冷讨论会下面的页面网站的换肤工能是册 过却本来实现的脚本能免地网页中的个对进行疚互日用品我们先冷讨论会下面的页面网站的换肤工能是册 过却本来实现的脚本能免地网页中的个对进行疚互日用品我们先冷讨论会下面的页面网站的换肤工能是册 过却本来实现的脚本能免地网页中的个对进行疚互日用品我们先冷讨论会下面的页面
</div>
</body>
</html>
把下面代码保存成css1.css
<style>
body { margin: 0px; padding: 0px;}
#header{ padding:10px; background-color:#0d3460; color:#fff; font-family:Arial;}
h1{font-size:20px; width:760px; margin:0px auto;}
#content{width:760px; margin:0px auto; font-size:12px; color:#444; padding:10px; line-height:180%;}
#nav{text-align:center; margin:0px auto; padding:10px 0px; background-color:#eee;}
input{font-size:12px;}
</style>
把这下面的问题保存成css2.css
body { margin: 0px; padding: 0px;}
#header{padding:10px; background-color:#ce0b0b; color:#fff; font-family:Arial; float:left; height:500px;}
h1{font-size:20px;}
#content{font-size:12px; color:#444; padding:20px; line-height:180%;}
#nav{ text-align:center; padding:10px; background-color:#eee; float:left; height:500px; width:100px;}
input{font-size:12px; margin-top:20px;}

 

您可能感兴趣的文章:
超简单换皮肤代码
photoshop智能美肤后期修图教程
实时切换网页的CSS样式实现
photoshop简单人像皮肤和整体修饰后期处理教程
Photoshop人像后期精修时常用的修图教程详解
Photoshop调出粉嫩的透明皮肤美白教程
Jquery easyui入门教程(1)
photoshop鼠绘好莱坞动画Dory实例制作教程
jquery cookie实现的简单换肤功能适合小网站
photoshop快速用中性灰磨皮教程分享

[关闭]