zoukankan      html  css  js  c++  java
  • 管理后台上左右式HTML框架搭建

      CSS:

      

    <style>
    .frame-header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 11;
    min- 960px;
    height: 38px;
    border-top: 1px solid #333;
    border-bottom: 1px solid #333;
    background: #3B3B3B;
    _position: absolute;
    _ 100%;
    }
    .frame-side {
    position: absolute;
    top: 40px;
    right: 0;
    bottom: 0;
    z-index: 2;
     200px;
    border-left: 1px solid #DBDBDB;
    background: #F9F9F9;
    box-shadow: inset 2px 0 3px rgba(0, 0, 0, 0.05);
    _height: 100%;
    }
    .frame-contents {
    position: absolute;
    top: 40px;
    right: 201px;
    bottom: 0;
    left: 0;
    min- 760px;
    }
    .frame-contents iframe {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
     100%;
    height: 100%;
    }
    </style>
    

      

      HTML:

    <div class="frame-header">I'm the header.</div>
    <div class="frame-side">I'm the right-side.</div>
    <div class="frame-contents">
    <iframe src="http://www.baidu.com" frameborder="0" ></iframe>
    </div>
    

      主体 frame-contents内容自适应高宽,超出部分滚动显示。

  • 相关阅读:
    [BZOJ] IOI2015 Boxes纪念品盒
    [BZOJ] 聚会
    [BZOJ] 地精部落
    [BZOJ] 最长距离
    正则
    cookie实例 记住用户名密码
    cookie封装
    碎片整合 例子
    闭包 tab切换 实例
    闭包
  • 原文地址:https://www.cnblogs.com/wangtuda/p/2891397.html
Copyright © 2011-2022 走看看