19种常见Web2.0网站配色【截图+代码】

常用的web2.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>常见Web2.0网站配色</title>
  <meta name="generator" content="editplus" />
  <meta name="author" content="www.tianxuanit.com" />
  <meta name="keywords" content="web2.0" />
  <meta name="description" content="常见Web2.0网站配色" />
 </head>
<style type="text/css">
<!-- 
.Alldiv { 
    MARGIN: 5px;WIDTH: 550px; LINE-HEIGHT: 1.6em; BORDER: 1px solid #FFF; HEIGHT: 20px 
} 
.div1 { 
    BORDER-LEFT-COLOR: #ffcc00; BORDER-BOTTOM-COLOR: #ffcc00; BORDER-TOP-COLOR: #ffcc00; BACKGROUND-COLOR: #fffff7; BORDER-RIGHT-COLOR: #ffcc00 
} 
.div2 { 
    BORDER-LEFT-COLOR: #96c2f1; BORDER-BOTTOM-COLOR: #96c2f1; BORDER-TOP-COLOR: #96c2f1; BACKGROUND-COLOR: #eff7ff; BORDER-RIGHT-COLOR: #96c2f1 
} 
.div3 { 
    BORDER-LEFT-COLOR: #9bdf70; BORDER-BOTTOM-COLOR: #9bdf70; BORDER-TOP-COLOR: #9bdf70; BACKGROUND-COLOR: #f0fbeb; BORDER-RIGHT-COLOR: #9bdf70 
} 
.div4 { 
    BORDER-LEFT-COLOR: #abdc8d; BORDER-BOTTOM-COLOR: #abdc8d; BORDER-TOP-COLOR: #abdc8d; BACKGROUND-COLOR: #f8ffe7; BORDER-RIGHT-COLOR: #abdc8d 
} 
.div5 { 
    BORDER-LEFT-COLOR: #adcd3c; BORDER-BOTTOM-COLOR: #adcd3c; BORDER-TOP-COLOR: #adcd3c; BACKGROUND-COLOR: #f2fddb; BORDER-RIGHT-COLOR: #adcd3c 
} 
.div6 { 
    BORDER-LEFT-COLOR: #bbe1f1; BORDER-BOTTOM-COLOR: #bbe1f1; BORDER-TOP-COLOR: #bbe1f1; BACKGROUND-COLOR: #eefaff; BORDER-RIGHT-COLOR: #bbe1f1 
} 
.div7 { 
    BORDER-LEFT-COLOR: #d1f0f6; BORDER-BOTTOM-COLOR: #d1f0f6; BORDER-TOP-COLOR: #d1f0f6; BACKGROUND-COLOR: #fafcfd; BORDER-RIGHT-COLOR: #d1f0f6 
} 
.div8 { 
    BORDER-LEFT-COLOR: #a9c9e2; BORDER-BOTTOM-COLOR: #a9c9e2; BORDER-TOP-COLOR: #a9c9e2; BACKGROUND-COLOR: #e8f5fe; BORDER-RIGHT-COLOR: #a9c9e2 
} 
.div9 { 
    BORDER-LEFT-COLOR: #e3e197; BORDER-BOTTOM-COLOR: #e3e197; BORDER-TOP-COLOR: #e3e197; BACKGROUND-COLOR: #ffffeb; BORDER-RIGHT-COLOR: #e3e197 
} 
.div10 { 
    BORDER-LEFT-COLOR: #f8b3d0; BORDER-BOTTOM-COLOR: #f8b3d0; BORDER-TOP-COLOR: #f8b3d0; BACKGROUND-COLOR: #fff5fa; BORDER-RIGHT-COLOR: #f8b3d0 
} 
.div11 { 
    BORDER-LEFT-COLOR: #d3d3d3; BORDER-BOTTOM-COLOR: #d3d3d3; BORDER-TOP-COLOR: #d3d3d3; BACKGROUND-COLOR: #f7f7f7; BORDER-RIGHT-COLOR: #d3d3d3 
} 
.div12 { 
    BORDER-LEFT-COLOR: #bfd1eb; BORDER-BOTTOM-COLOR: #bfd1eb; BORDER-TOP-COLOR: #bfd1eb; BACKGROUND-COLOR: #f3faff; BORDER-RIGHT-COLOR: #bfd1eb 
} 
.div13 { 
    BORDER-LEFT-COLOR: #ffdd99; BORDER-BOTTOM-COLOR: #ffdd99; BORDER-TOP-COLOR: #ffdd99; BACKGROUND-COLOR: #fff9ed; BORDER-RIGHT-COLOR: #ffdd99 
} 
.div14 { 
    BORDER-LEFT-COLOR: #cacaff; BORDER-BOTTOM-COLOR: #cacaff; BORDER-TOP-COLOR: #cacaff; BACKGROUND-COLOR: #f7f7ff; BORDER-RIGHT-COLOR: #cacaff 
} 
.div15 { 
    BORDER-LEFT-COLOR: #a5b6c8; BORDER-BOTTOM-COLOR: #a5b6c8; BORDER-TOP-COLOR: #a5b6c8; BACKGROUND-COLOR: #eef3f7; BORDER-RIGHT-COLOR: #a5b6c8 
} 
.div16 { 
    BORDER-LEFT-COLOR: #cee3e9; BORDER-BOTTOM-COLOR: #cee3e9; BORDER-TOP-COLOR: #cee3e9; BACKGROUND-COLOR: #f1f7f9; BORDER-RIGHT-COLOR: #cee3e9 
} 
.div17 { 
    BORDER-LEFT-COLOR: #cae3ff; BORDER-BOTTOM-COLOR: #cae3ff; BORDER-TOP-COLOR: #cae3ff; BACKGROUND-COLOR: #f4f9ff; BORDER-RIGHT-COLOR: #cae3ff 
} 
.div18 { 
    BORDER-LEFT-COLOR: #5c9cc0; BORDER-BOTTOM-COLOR: #5c9cc0; BORDER-TOP-COLOR: #5c9cc0; BACKGROUND-COLOR: #f2faff; BORDER-RIGHT-COLOR: #5c9cc0 
} 
.div19 { 
    BORDER-LEFT-COLOR: #86b9d6; BORDER-BOTTOM-COLOR: #86b9d6; BORDER-TOP-COLOR: #86b9d6; BACKGROUND-COLOR: #f5fbff; BORDER-RIGHT-COLOR: #86b9d6 
} 
--></style>
 <body>
  <div class="Alldiv">
<div class="Alldiv div1"> </div>
<div class="Alldiv div2"> </div>
<div class="Alldiv div3"> </div>
<div class="Alldiv div4"> </div>
<div class="Alldiv div5"> </div>
<div class="Alldiv div6"> </div>
<div class="Alldiv div7"> </div>
<div class="Alldiv div8"> </div>
<div class="Alldiv div9"> </div>
<div class="Alldiv div10"> </div>
<div class="Alldiv div11"> </div>
<div class="Alldiv div12"> </div>
<div class="Alldiv div13"> </div>
<div class="Alldiv div14"> </div>
<div class="Alldiv div15"> </div>
<div class="Alldiv div16"> </div>
<div class="Alldiv div17"> </div>
<div class="Alldiv div18"> </div>
<div class="Alldiv div19"> </div>
</div>
 </body>
</html>

 

 

转载于:https://www.cnblogs.com/lxge/archive/2012/02/26/web2_peise.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值