css 两列 左侧列固定 width: 100px; float: left; 右侧列自适应 margin-left:100px; 注意要用在div上的style

.con1{

    width: 100px;

    float: left;

    background: #ff0;

}

.con2{

    margin-left:100px;

    background: #fe3;

}

css 两列 左侧列固定 width: 100px; float: left; 右侧列自适应 margin-left:100px; 注意要用在div上的style的更多相关文章

  1. 在页面布局中，CSS如何实现左侧宽度固定，右侧宽度自适应的布局？

    首先给出DOM结构 <divclass="box"> <divclass="box-left"></div> <div ...

  2. Oracle 行转列（不固定行数的行转列，动态）（转）

    http://bbs.csdn.net/topics/330039676 SQLSERVER :行列转换例子:  http://www.cnblogs.com/gaizai/p/3753296.htm ...

  3. css布局中左侧固定右侧自适应

    float 单一层浮动法左侧固定成100px; 则核心代码 左侧:width:100px;float:left; 右侧 width:auto;margin-left:100px;绝大浏览器是没有任何问 ...

  4. css实现div两列布局——左侧宽度固定，右侧宽度自适应（两种方法）

    原文:css实现div两列布局--左侧宽度固定,右侧宽度自适应(两种方法) 1.应用场景 左侧一个导航栏宽度固定,右侧内容根据用户浏览器窗口宽度进行自适应 2.思路 首先把这个问题分步解决,需要攻克以 ...

  5. CSS两列布局——左侧宽度固定，右侧宽度自适应的3种方法

    1.左侧绝对定位法 直接看代码: <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  6. CSS 两列布局 之 左侧适应，右侧固定 3种方式

    第一种:左侧用margin-right,右侧float:right CSS代码: html, body,ul,li #wrapper { width: 100%; height: 100%; padd ...

  7. CSS两列布局的N种实现

    一.什么是两列布局 两列布局分为两种,一种是左侧定宽.右侧自适应,另一种是两列都自适应(即左侧宽度由子元素决定,右侧补齐剩余空间).在CSS面试题里面属于常考题,也是一个前端开发工程师必须掌握的技能, ...

  8. CSS两列及三列自适应布局方法整理

    布局 自适应 两列 三列 在传统方法的基础上加入了Flex布局并阐述各方法的优缺点,希望对大家有所帮助.先上目录: 两列布局:左侧定宽,右侧自适应 方法一:利用float和负外边距 方法二:利用外边距 ...

  9. css两列布局，一边固定宽度，另一边自适应

    <!DOCTYPE HTML><HTML>    <head>                <meta charset="utf-8" ...

随机推荐

  1. redhat 关机注销命令详解

    一.注销,关机,重启 注销系统的logout命令 1,Logout 注销是登陆的相对操作,登陆系统后,若要离开系统,用户只要直接下达logout命令即可: [root@localhost root]# ...

  2. Servlet3.0之九：web模块化

    一.使用web-fragment.xml 在Servlet 3.0中,可以使用标注来设置Servlet的相关信息.实际上,Web容器并不仅读取/WEB-INF/classes中的Servlet标注信息 ...

  3. 【旧文章搬运】Windows句柄表分配算法分析(二)

    原文发表于百度空间,2009-03-30========================================================================== 四.句柄表 ...

  4. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 08. 输入Model和防止重复Post

    通过action的参数传入一个model 通过input的name属性和model属性对应上 通常是使用Http post去做 快速创建了这个Action 这个Action很简单我们只需要返回View ...

  5. 洛谷 P3711 仓鼠的数学题【伯努利数+多项式科技】

    有个东西叫伯努利数--一开始直接·用第一类斯特林推到自闭 式子来源:https://www.luogu.org/blog/ShadowassIIXVIIIIV/solution-p3711 https ...

  6. C#程序结构与基本语法

    C# 程序结构 Hello World 实例 一个 C# 程序主要包括以下部分: 命名空间声明(Namespace declaration) 一个 class Class 方法 Class 属性 一个 ...

  7. RobotFramework自动化测试框架（3）- RobotFramework扩展测试库、资源文件、变量文件

    扩展测试库 扩展测试库可使用python或java语言编写.后直接导入需要使用的测试用例文件即可. 具体的实现和操作,后续补充.请参考官网. 资源文件 在资源文件中定义用户关键字,它提供了共享机制,即 ...

  8. Python实现两已知排好序的列表合并成一个排好序的列表

    #方法0.5--- lst1 = [1, 3, 7, 9, 12] lst2 = [4, 8, 9, 13, 15, 19] def merge(a, b): c = [] h = j = 0 whi ...

  9. AtCoder Regular Contest 074 F - Lotus Leaves

    题目传送门:https://arc074.contest.atcoder.jp/tasks/arc074_d 题目大意: 给定一个\(H×W\)的网格图,o是可以踩踏的点,.是不可踩踏的点. 现有一人 ...

  10. Codeforces 1108F（克鲁斯卡尔的理解）

    最小生成树会多样的情况是:两个或多个边等长且连通同样的两个并查集块. 所以可以跑一遍克鲁斯卡尔,每次把当前等长的边数出来,注意不要边找边并查,因为有一部分边是正常跑生成树我们也不会要他的,这种直接跳了 ...