zoukankan      html  css  js  c++  java
  • div 两列布局,左侧固定宽度px,右侧自适应宽度,满屏

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>左侧固定,右侧宽度100%自适应</title>
    <style type="text/css" media="screen">
    <!--
    body {margin:0;padding:0;}
    .right {margin-left:200px;}
    .left {width:200px;position:absolute;top:0;left:0;}
    
    p {border:solid #000 1px;padding:20px;}
    -->
    </style>
    </head>
    
    <body>
    <div class="left">
    <p>左侧宽度200px</p>
    </div>
    
    <div class="right">
    <p>右侧宽度100%</p>
    </div>
    </body>
    </html>

    看了N篇文章,找了N中答案,什么clear啊,float啊,原来正道才是这么简单,而且100%兼容。Good!

    对于右侧嵌入iframe, 则是<iframe width=" 100%"  height="100%" src="http://www.baidu.com"></iframe>  兼容ie6 ff等等

    但不能使用css指定iframe的width height,否则存在浏览器兼容问题

  • 相关阅读:
    遍历datatable的方法
    C# 存储过程使用方法
    C# 存储过程
    dev repositoryItem 手工定义
    无限极分类
    ThinkPHP
    ThinkPHP
    RBAC
    ThinkPHP
    正则表达式
  • 原文地址:https://www.cnblogs.com/beenupper/p/3465407.html
Copyright © 2011-2022 走看看