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


    <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 {
             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 {
             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{
                            200px;
            line-height: 40px;
            color: white;
            background-color: #59B418;
            text-align: center;
            border-left: 1px solid #bbf;
            display: block;
                       } 
    .middle{
          800px;
     
      background-image:url(image/76.jpg);
      height:300px;
        }
    .middle_content{
                 padding-left:100px;

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




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

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


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

       }
             

     
        </style>
  • 相关阅读:
    代码整洁之道-格式
    代码整洁之道-函数
    redis常规命令记录
    周报2019.7.19
    docker mysql安装
    Python requirements.txt
    Javascript-关于null、undefined、空字符串的区分
    Javascript-string-Array
    取出两个二维数组中不重复的数组值方法
    让未知宽高的元素水平垂直居中
  • 原文地址:https://www.cnblogs.com/brilin/p/10872470.html
Copyright © 2020-2023  润新知