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. AutoIt: send 命令 VS ControlClick的使用

    2008年的时候第一次接触AutoIt,当时觉得局限性太多了,就不想学,觉得把Watir,Ruby搞好就行了. 最近一段时间比较闲,发现自己对GUI的自动化操完全是短板,就把AutoIt重新拾起来了. ...

  2. Top的VIRT是什么

    Top命令监控某个进程的资源占有情况  下面是各种内存: VIRT:virtual memory usage 1.进程“需要的”虚拟内存大小,包括进程使用的库.代码.数据等     2.假如进程申请1 ...

  3. Linux Shell高级技巧(目录)

    为了方便我们每个人的学习,这里将给出Linux Shell高级技巧五篇系列博客的目录以供大家在需要时参阅和查找. Linux Shell高级技巧(一) http://www.cnblogs.com/s ...

  4. 实现列表两端完全对其text-aligh:justify 和display:inline-block

    dispaly:inline-block 对于块级元素,在IE8-下是不兼容的,所以一般不要用在这些元素上,可以用在inline元素上:span text-align:justify实现子元素完全对齐 ...

  5. (水题)洛谷 - P1093 - 奖学金

    https://www.luogu.org/problemnew/show/P1093 #include<bits/stdc++.h> using namespace std; #defi ...

  6. hdoj1116【欧拉回路】

    题意: 应该是求一个路径让所有的单词能够首尾连起来,不需要头和尾的单词也连起来...应该很容易懂吧...我这里讲的好烂.. 思路: 从欧拉回路的定义引申过来. 1. 连通. 2. 入度和出度问题. 问 ...

  7. bzoj 1385: [Baltic2000]Division expression【脑洞】

    加括号再去括号就是除变加,显然尽可能多的除变加是最优的,然后发现唯一不能变成乘数的是第二个数,所以把其他数乘起来mod第二个数,如果是0就是YES,否则说明最后不能除尽,就是NO #include&l ...

  8. Luogu P1373 小a和uim之大逃离【dp】By cellur925

    题目传送门 $50pts$:容易设计出状态$f[i][j][l][r][st]$表示当前的这个人在($i$,$j$),小a和uim魔瓶中的含量分别为$l$,$r$,当$st=0$表明现在是小a在吃,当 ...

  9. spring cloud feign 调用接口报错"No message available

    There was an unexpected error (type=Internal Server Error, status=500). status 404 reading HelloServ ...

  10. Seek the Name, Seek the Fame POJ - 2752

    Seek the Name, Seek the Fame POJ - 2752 http://972169909-qq-com.iteye.com/blog/1071548 (kmp的next的简单应 ...