写了一些我自己也不是很了解的东西

<style type="text/css">
 
    /*为了使菜单居中*/
    body {
        padding-top:100px;
        text-align:center; 
    }
     
     
    /* -------------菜单css代码----------begin---------- */
    .menuDiv { 
        border: 2px solid #aac; 
        overflow: hidden; 
        display:inline-block;
    }
     
    /* 去掉a标签的下划线 */
    .menuDiv a {
        text-decoration: none;
    }
     
    /* 设置ul和li的样式 */
    .menuDiv ul , .menuDiv li {
        list-style: none;
        margin: 0;
        padding: 0;
        float: left;
    } 
     
    /* 设置二级菜单绝对定位,并隐藏 */
    .menuDiv > ul > li > ul {
        position: absolute;
        display: none;
    }
 
    /* 设置二级菜单的li的样式 */
    .menuDiv > ul > li > ul > li {
        float: none;
    }
   
    /* 鼠标放在一级菜单上,显示二级菜单 */
    .menuDiv > ul > li:hover ul {
        display: block;
    }
 
    /* 一级菜单 */
    .menuDiv > ul > li > a {
        width: 120px;
        line-height: 40px;
        color:white;
background-color:#59B418;
        text-align: center;
        border-left: 1px solid #bbf;
        display: block;
    }
     
    /* 在一级菜单中,第一个不设置左边框 */
    .menuDiv > ul > li:first-child > a {
        border-left: none;
    }
 
    /* 在一级菜单中,鼠标放上去的样式 */
    .menuDiv > ul > li > a:hover {
        color: #f0f;
        background-color: #bcf;
    }
 
    /* 二级菜单 */
    .menuDiv > ul > li > ul > li > a {
        width: 120px;
        line-height: 36px;
        color: #456;
        background-color: #eff;
        text-align: center;
        border: 1px solid #ccc;
        border-top: none;
        display: block;
    }
     
    /* 在二级菜单中,第一个设置顶边框 */
    .menuDiv > ul > li > ul > li:first-child > a {
        border-top: 1px solid #ccc;
    }
     
    /* 在二级菜单中,鼠标放上去的样式 */
    .menuDiv > ul > li > ul > li > a:hover {
        color: #a4f;
        background-color: #cdf;
    }
    /* -------------菜单css代码----------end---------- */
     .menuDiv > ul > li.a{
                       width: 200px;
        line-height: 40px;
        color: white;
        background-color: #59B418;
        text-align: center;
        border-left: 1px solid #bbf;
        display: block;
                   } 
.middle{
      width:800px;
 
  background-image:url(image/76.jpg);
  height:300px;
    }
.middle_content{
             padding-left:100px;

 padding-top:70px;
  }
.bottom{
       width:800px;
   float:left;
   border:1px solid block;
   color:green;
   background-color:#7CD041;
   
  
      }
.bottom_left image{ float:left;} 
 
.bottom_left {   
                width:266px;
height:350px;
float:left;
line-height:20px;
padding-top:10px;




   }
 .bottom_center {   
                width:266px;
height:350px;
float:left;
line-height:20px;
     padding-top:10px;
 margin-left:0px;
 top:400px;

   }
  .bottom_right {   
                width:266px;
height:350px;
float:left;
line-height:20px;


 margin-left:0px;
 margin:0px;

   }
         

 
    </style>
posted @ 2019-05-15 21:55  袁玉霖  阅读(113)  评论(1编辑  收藏  举报