复杂网络621 / css / CSS布局的一个网页源代码

0 0

   

CSS布局的一个网页源代码

2014-07-04  复杂网络6...


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<style type="text/css">
 body
 {
  background-image: url('images/BobyBg.jpg');
  padding: 0px;
  margin:0px;
 }
 #layout
 {
  margin:0px auto;
  width:1024px;
  background-color:rgb(34,137,214);
 }
/* #mid
 {
  width:1024px;
  background-color:rgb(34,137,214);
 }*/
 #head1
 {
  margin:0px;
  border:0px solid #eee;
  height:150px;
     width:100%;
  background-color:red;
  background-repeat:no-repeat;
 }
 #pic1
 {
  border:0px;
  margin:0px;
  width:40%;
  float:left;
 }
 #pic2
 {
  border:0px;
  margin:0px;
  width:60%;
  float:left;
 }
 #main
 {
  width:100%;
  height: 400px;
  background-color:#FFFFFF;
 }
 #mainleft
 {
  width:30%;
  border:0px;
  margin:0px;
  background-color:0xFFFFFF;
  float:left;
 }
 #mainleft img
 {
  width:100%;
 }
 #head1 div img
 {
  border:0px solid #333;
  margin:0px;
  width:100%;
  height:100%;
  float:left;
    }
 #right
 {
  width:10%;
  height:100%;
  float:left;
 }
 #nav
 {
  width: 1024px;
  height: 33px;
  background-image: url('images/MainNavbg.jpg');
  color:white;
 }
 ul{
  list-style: none;
  margin: 0px;
  padding: 0px;
 }
 #nav li
 {
  margin: 0px;
  padding: 0px;
  width: 97px;
  height: 33px;
  line-height: 33px;
  text-align: center;
  text-decoration:none;
  font-weight:bold;
  float:left; 
 }
 #nav a
 {
  color:white;

 }
 #nav li a:hover
 {
  color:red;
  text-decoration: none;
 }
 #hui
 {
  background-image:url(images/hui.jpg);
  background-repeat:repeat-x;
  height:9px;
  width:100%;
 }
 #mainleft{
  height:400px;
  width:300px;
  padding:0px;
  margin:0px;
  float: left;
 }
 #mainright{
  height: 400px;
  width: 700px;
  margin: 0px 0px 0px 20px;
  padding: 0px;
  float: left;
 }
 #mainright ul{
  margin:10px 0px 0px 0xp;
 }
 #mainright li{
  width: 700px;
  /*height: 12px;
  font-size:13px;
  line-height: 14px;*/
  height: 26px;
  font-size:23px;
  line-height: 26px;
  font-weight: 600;
  border-bottom:1px dotted #666;
 }
 .contenttitle{
  background-image: url(images/Aarow001.jpg);
  background-repeat: no-repeat;
  padding: 0px 0px 0px 8px;
  width: 600px;
  height: 14px;
  float: left;
  background-color: 0xE0B15B;
  /*color: 0xE0B15B;*/
 }
 .contentdate{
  height: 12px;
  width: 90px;
  float: left;
  color:red;
 }
 #foot
 {
  width: 1024px;
  height:30px;
  background-image:url(images/Footerbg.jpg);
  background-repeat:repeat-x;
  color:RGB(39,85,130);
  line-height: 15px;
  font-size:15px;
  margin:0px;
  padding: 30px 0px 30px 0px;
  text-align: center;
 }
 p
 {
  font-family:"Times New Roman",Georgia,Serif;
  font-weight:bold;
 }
/* .linestyle
 {
  size:1;
  dashed:#5151A2;
  color: 0xBABABA;
 }*/
 a:link{text-decoration:none ;color:blue; }
 a:visited {text-decoration:none ; color:blue;}
 a:hover {text-decoration:underline ; color:red;}
 a:active {text-decoration:none ; color:blue;}
</style>
</head>
<body>
<div id="layout">
 <!-- <div id="mid"> -->
  <div id="head1">
   <div id="pic1"><img src="images/Banner-logo2.jpg" /></div>
   <div id="pic2"><img src="images/BannerPic_Kjgl.jpg"/></div>  
  </div>
  <div id="nav">
   <ul>
    <li><a href="#">首页</a></li>
    <li><a href="#">走进财政</a></li>
    <li><a href="#">财政动态</a></li>
    <li><a href="#">财政公开</a></li>
    <li><a href="#">办事指南</a></li>
    <li><a href="#">政策法规</a></li>
    <li><a href="#">政府采购</a></li>
    <li><a href="#">契税征管</a></li>
    <li><a href="#">产权交易</a></li>
    <li><a href="#">企业之窗</a></li>
   </ul>
  </div>
  <div id="hui"></div>
  <div id="main">
   <div id="mainleft">
    <img src="images/LeftBg.jpg" height="400px" width="300px">    
   </div>
   <div id="mainright">
    <img src="images/Zi.png" width="700px" height="43px" alt='财政动态'/>
    <ul>
     <li><div class="contenttitle">省政府领导表扬山东农业气象决策服务</div><div class="contentdate">02-16</div>
     </li>
     <!-- <hr class="linestyle"> -->
     <li><div class="contenttitle">山东省召开全省气象局长会议</div><div class="contentdate">02-16</div>
     </li>
     <li><div class="contenttitle">陈家宝为南京市气象局正式揭牌</div><div class="contentdate">02-16</div>
     </li>
     <li><div class="contenttitle">全省市局长工作研讨会重点讨论部署体改工作</div><div class="contentdate">02-16</div>
     </li>
     <li><div class="contenttitle">省政府领导表扬山东农业气象决策服务</div><div class="contentdate">02-16</div>
     </li>
     <li><div class="contenttitle">山东召开全省气象局长会议山东召开全省气象局长会议</div><div class="contentdate">02-16</div>
     </li>
     <li><div class="contenttitle">全省市局长工作研讨会重点讨论部署体改工作</div><div class="contentdate">02-16</div>
     </li>
     <li><div class="contenttitle">省政府领导表扬山东农业气象决策服务</div><div class="contentdate">02-16</div>
     </li>
    </ul>
   </div>
  </div>
  <div id="foot">
   Copyright 2006 by www.czfb.gov.cn 常州市财政局版权所有<br>
                            电话:(0519)5681812联系信箱:czj@czfb.gov.cn
  </div>
 <!-- </div> -->
</div>
</body>
</html>

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。如发现有害或侵权内容,请点击这里 或 拨打24小时举报电话:4000070609 与我们联系。

    猜你喜欢

    0条评论

    发表

    请遵守用户 评论公约

    类似文章
    喜欢该文的人也喜欢 更多