<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

</head>

<body>

<style>

#div2{

	float:left;

	margin-left:-100%;

}

#div3{

	float:left;

	width:100%;

}

</style>

<div id="div1">

    <div id="div3">

    	<div style="margin-left:240px">

            22222<br>f

            22222<br>f

            22222<br>f

            22222<br>f

            22222<br>f

            22222<br>f

            22222<br>f

            22222<br>f

        </div>

    </div>

	<div id="div2">

    	<div style="width:240px">

            11111<br>F

            11111<br>F

            11111<br>F

            11111<br>F

            11111<br>F

            11111<br>F

            11111<br>F

            11111<br>F

            11111<br>F

            11111<br>F

            11111<br>F

        </div>

	</div>

</div>

<!---

这种布局也可以作为slide和content的布局，

1：内容的元素放在第一个结点（width:100%;float:left）;

2: slide是第二个结点（float:left;margin-left:-100%）

-->

</body>

</html>

　　

css左右侧自动填充宽度布局的更多相关文章

  1. css经典布局之左侧固定大小右侧自动适应

    最近学习了一种经典布局,固定左侧或右侧的宽度,另一侧自适应宽度,此种布局挺常用,尤其是像后台,大部分都是采用这种结构,还比如像订餐类的APP,进入商家的时候,会出现一堆饭的列表,左侧是饭的分类,右侧是 ...

  2. 老生长谈：css实现右侧固定宽度，左侧宽度自适应

    反过来也可以:左侧宽度固定,右侧自适应.不管是左是右,反正就是一边宽度固定,一边宽度自适应. 这种布局比较常见,博客园很多默认主题就是这种.一般情况下,这种布局中宽度固定的区域是侧边栏,而自适应的区域 ...

  3. 老生长谈，温故知新：css实现右侧固定宽度，左侧宽度自适应

    反过来也可以:左侧宽度固定,右侧自适应.不管是左是右,反正就是一边宽度固定,一边宽度自适应. 这种布局比较常见,博客园很多默认主题就是这种.一般情况下,这种布局中宽度固定的区域是侧边栏,而自适应的区域 ...

  4. css实现右侧固定宽度，左侧宽度自适应

    https://blog.csdn.net/qq_22889599/article/details/78414040 反过来也可以:左侧宽度固定,右侧自适应.不管是左是右,反正就是一边宽度固定,一边宽 ...

  5. CSS 实现左侧固定，右侧自适应两栏布局的方法

    "左边固定,右边自适应的两栏布局",其中有老生常谈的float方法,BFC方法,也有CSS3的flex布局与grid布局.并非所有的布局都会在开发中使用,但是其中也会涉及一些知识点 ...

  6. 七种CSS左侧固定,右侧自适应两栏布局

    一 两栏布局基本HTML和CSS 首先创建基本的HTML布局和最基本的样式. 基本的样式是,两个盒子相距20px, 左侧盒子宽120px,右侧盒子宽度自适应 <div class="w ...

  7. css判断不同分辨率显示不同宽度布局实现自适应宽度

    一.CSS DIV网页布局中当分辨率小于等于1024px(像素)时,DIV布局对象显示1000px宽度,当分辨率大于1024px时候显示1200px宽度等需求.使用CSS实现改变浏览器显示宽度从而实现 ...

  8. CSS判断不同分辨率显示不同宽度布局CSS3技术支持IE6到IE8

    CSS判断不同分辨率浏览器(显示屏幕)显示不同宽度布局CSS3技术支持IE6到IE8.将用到css3 @media样式进行判断,但IE9以下版本不支持CSS3技术,这里DIVCSS5给大家介绍通过JS ...

  9. CSS设置表格TD宽度布局

    使用表格布局时,对单元格的宽度控制很伤脑筋,所以查阅资料整理如下: 一.表格布局table-layout 语法: table-layout : auto | fixed 取值: auto  : 大多数 ...

随机推荐

  1. poj2387 Til the Cows Come Home 最短路径dijkstra算法

    Description Bessie is out in the field and wants to get back to the barn to get as much sleep as pos ...

  2. Javascript 中的闭包和引用

    Javascript 中一个最重要的特性就是闭包的使用.因为闭包的使用,当前作用域总可以访问外部的作用域.因为Javascript 没有块级作用域,只有函数作用域,所以闭包的使用与函数是紧密相关的. ...

  3. ssm中使用hibernate-validator验证BO

    目前比较流行的验证做法:前端jquery-form-validate + 后端hibernate-validate 在pom中添加相关jar: <!-- use hibernate-valida ...

  4. C#代码创建3D模型

    Demo 1:创建三角形 示例代码 构建一个只包含单个三角形及纹理坐标的网格 using UnityEngine; using System.Collections; public class Mes ...

  5. 6月27日 OGDF不同的布局算法

    检查不同布局算法 备注 CircularLayout 可以非连通 FastMultipoleMultilevelEmbedder    FMMMLayout   可以非连通 StressMajoriz ...

  6. 通过imeMode禁用键盘只能输入数字

    var obj = document.getElementById('y'); var arr = [48,49,50,51,52,53,54,55,56,57];//数字对应的键码 obj.onke ...

  7. JS的Document属性和方法

    Attributes 存储节点的属性列表(只读)childNodes 存储节点的子节点列表(只读)dataType 返回此节点的数据类型Definition 以DTD或XML模式给出的节点的定义(只读 ...

  8. 12Mybatis_用mapper代理的方式去开发以及总结mapper开发的一些问题

    上一篇文章总结了一些Dao开发的问题,所以我们这里开始讲一种mapper代理的方式去开发. 我先给出mapper代理开发的思路(mapper代理开发的规范): 我们用mapper代理开发时要写2个: ...

  9. Android 判断现在系统存储器是“手机存储”还是“SD存储”

    import android.os.storage.StorageManager; String fileDir = null;            StorageManager storageMa ...

  10. 在 WinForm 中使用 Direct2D

    在 C# 的 WinForm 应用中,界面的绘制使用的是 GDI+.不过在一些特别的应用中,可能需要用硬件加速来提高绘制的效率.下面就来介绍两种在 WinForm 应用中嵌入 Direct2D 的方法 ...