对于这个布局方式我们可以是用绝对定位的方式来实现这个效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
body{ margin:0px; padding:0px;}
.left{ width:200px; height:500px; background:#666; position:absolute;left:0; top:0;}
.right{ width:300px; height:500px; background:#009; position:absolute; right:0; top:0;}
.crent{ height:500px; background:#069; margin:0 300px 0 200px;}
</style>
</head>

<body>
<div class="left"></div>
<div class="crent"></div>
<div class="right"></div>
</body>
</html>
如果想要使得中间有空隙的话就只要改一下right 和left的值就可以了margin:0 310px 0 210px;

HTML左边和右边是固定的宽度但是中间是自动的布局方式的更多相关文章

  1. 实现一个div,左边固定div宽度200px,右边div自适应

    实现一个div,左边固定div宽度200px,右边div自适应<div class= "container"> <div class="left&quo ...

  2. Winfrom固定Label宽度,根据文本动态改变Label的高度 z

    Label,要固定住宽度,然后根据文本的长度来动态改变高度,一开始去网上找解决方案,各种根据字体大小啊,字数啊来动态改变,但是效果却不怎么好.最后灵机一动,想起了偶尔用过一次的FlowLayoutPa ...

  3. 固定UILabel宽度分行显示

    固定UILabel宽度分行显示 这种小伎俩估计都被用烂了,笔者给大家提供一个category文件,供大家简单设置哦. 各种富文本效果哦(普通文本也是可以用的呢): 3行,固定宽度200 2行,固定宽度 ...

  4. DataTables固定表格宽度(设置横向滚动条)

    当表格的列比较多的时候,可能就需要固定表格的宽度了,默认的100%宽已经不适应了.默认的100%宽要实现改变窗口大小也100%的话,在table元素上添加width="100%", ...

  5. echarts固定柱子宽度(barWidth)

    series: [            {                name: '',                yAxisIndex: 0,                type: ' ...

  6. layui静态表格固定td宽度,table固定td宽度

    正在做一个项目,要求数据表的列是不固定的,有可能是有10列,有可能是20列,第一列宽度要固定,然后我怎么设置都没有用, 这个问题困扰了我三天,后来终于百度到了, 这个博客: https://www.c ...

  7. CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法

    CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法 平时我们布局时候,有的文字内容多了会超过溢出我们限制的高度,有的图片会撑破DIV,让网页错位变乱. 这样我们就需要解决如何使用CSS来超出设 ...

  8. Echarts图标宽度变成100px,让图表宽度随着父元素自动适应,Vue实时监听宽度的变化,这可能是史上最好的解决方案!

    最近工作中element后台管理使用Echarts图表,本后台项目分图表模式和列表模式,使用display控制显示隐藏,这样就引出了本文的问题. 问题1:Echarts图标宽度变成100px? 问题2 ...

  9. 实现左边div固定宽度,右边div自适应撑满剩下的宽度的布局方式:

    html: <div class="container"> <div class="left"> left固定宽度200px </ ...

随机推荐

  1. bzoj2281

    有思维难度的好题这种题我们一般可以先从部分分考虑30%的分数k=2也就是黑白各一个不难发现如果初始黑白棋子相邻那必然是先手必败态否则一定是先手必胜那么30分的部分分是很容易拿到的,组合数学如果有多个棋 ...

  2. C#中的几个线程同步对象方法

    在编写多线程程序时无可避免会遇到线程的同步问题.什么是线程的同步呢? 举个例子:如果在一个公司里面有一个变量记录某人T的工资count=100,有两个主管A和B(即工作线程)在早一些时候拿了这个变量的 ...

  3. memcached SASL验证状态安全绕过漏洞

    漏洞版本: memcached 1.x 漏洞描述: Memcached是一个高性能的分布式内存对象缓存系统,用于动态Web应用以减轻数据库负载. Memcached在处理链接的SASL验证状态时存在错 ...

  4. apache开源项目--JMeter

    JMeter是Apache组织的开放源代码项目,它是功能和性能测试的工具,100%的用java实现.

  5. c# 提取word文件中的图片问题

    最近遇到一个项目就是要从一份word中提取出所有的图片信息,功能看起来不是很难,只要使用office自带的Microsoft.Office.Interop.Word就可以解决问题.网上也有不少的文章来 ...

  6. Android 线程优先级

    对于Android平台上的线程优先级设置来说可以处理很多并发线程的阻塞问题,比如很多无关紧要的线程会占用大量的CPU时间,虽然通过了MultiThread来解决慢速I/O但是合理分配优先级对于并发编程 ...

  7. ArrayLLis 线程不安 实验

    这段代码演示了ArrayList的线程不安全,我让3个线程分别对list加入300个字符串,最后的arr的大小为800多,大家可以测试一下,我的一次是898,一次是897,同时还学了join的用法 i ...

  8. poj 2892 Tunnel Warfare(线段树)

    Tunnel Warfare Time Limit: 1000MS   Memory Limit: 131072K Total Submissions: 7499   Accepted: 3096 D ...

  9. 如何禁止掉SharePoint页面个性化(网站操作-编辑页面)

    使用SharePoint Designer打开,或者创建一个新的Master Page,找到SPWebPartManager控件,如下所示,修改它的属性“Personalization-Enabled ...

  10. hibernate4.0+版本和3.0+版本的区别总结

    自己总结下hibernate4.1版本中的新特性和hibernate3.3做区别 1.数据库方言设置 <property name=”dialect”>org.hibernate.dial ...