其他杂项

others
其他系统相关杂项问题

转载的CSS两列布局,三列布局方法

6个月前 (10-09)其他杂项1088

下面方法主要用的display:inline-block属性,设置同行DIV宽度,另一个DIV用margin限制宽度。

转载的CSS两列布局,三列布局方法

按照文档流默认显示方法

CSS两列布局,右侧固定,左侧自适应宽度 

<div style="width:90%; margin:0 auto; overflow:auto; _display:inline-block;"> 

    <div style="width:200px; float:right; background:#090">这是右侧的内容</div> 

    <div style=" margin-right:210px; background:#F33">这是左侧的内容,自适应宽度</div> 

</div> 

  

  

CSS两列布局,左侧固定,右侧自适应宽度 

<div style="width:90%; margin:0 auto; overflow:auto; _display:inline-block;"> 

    <div style="width:150px; float:left; background:#6F0">这是左侧的内容 固定宽度</div> 

    <div style=" margin-left:160px; background:#FC0">中间内容,自适应宽度</div> 

</div> 

  

CSS三列布局,左右宽度固定,中间自适应宽度 

<div style="width:90%; margin:0 auto; overflow:auto; _display:inline-block;"> 

    <div style="width:200px; float:right; background:#393"> 这是右侧的内容 固定宽度</div> 

    <div style="width:150px; float:left; background:#F60 ">这是左侧的内容 固定宽度</div> 

    <div style=" margin-left:160px;margin-right:210px; background:#6C3;">中间内容,自适应宽度</div> 

</div>div+css 常用两栏/三种自动适应宽度分栏 兼容ie6\7\8\9 火狐 谷歌等浏览器



版权声明:本文由贝联科技发布,如需转载请注明出处,如需分享可点击上方生成海报按钮。

分享给朋友:

相关文章

苹果手机屏蔽iOS18系统更新方法+描述文件免费下载

苹果手机屏蔽iOS18系统更新方法+描述文件免费下载

屏蔽IOS18系统更新说明苹果手机有很不错的用户体验,但苹果IOS系统总是提示自动更新,对一些有特殊版本需求的朋友来说,这点就很讨厌了。贝联科技在此分享苹果IOS系统屏蔽自动更新18系统的最新办法和描述文件,希望对您有所帮助。特别说明,本方...

如何给网站文章页前面自动加个目录导航

如何给网站文章页前面自动加个目录导航

一些网站文章正文前有个目录导航,这是根据本文的h标签自动添加上去的,一些朋友可能需要这样的功能,其实本站文章页面也是如此显示,但此种写法只适用Zblog系统,下面给出个通用方案。要实现的效果类似下图修改简要文字说明本文分享具体代码,主要涉及...

宝塔Nginx环境下让404打不开页面自动跳转到首页

宝塔Nginx环境下让404打不开页面自动跳转到首页

因为前段时间更改了西京同城导航网站的程序,导致以前许多页面打不开,看在眼里急在心里,如何解决呢?第一步:登录宝塔后台网站设置的伪静态规则页面,一律删除以前程序用到的伪静态规则第二步:利用万能的百度后知道在配置文件中需要添加以下代码serve...

PbootCMS后台去版权显示教程

PbootCMS后台去版权显示教程

PbootCMS是一个很不错的PHP建站系统,但后台一些明显的PbootCMS字样看着不舒服,本人在此分享下自己和其他网友总结出来的经验。特别说明,本人只是修改一些明显的碍眼字样,请大家一起尊重PbootCMS 知识产权。(一)后台登录界面...

如何屏蔽PetalBot蜘蛛等垃圾蜘蛛办法分享

如何屏蔽PetalBot蜘蛛等垃圾蜘蛛办法分享

本人有一个 小网站,后台可以查看蜘蛛数据,经常发现有许多国外蜘蛛爬取。作为一个面向国内特定地域用户的网站,着实用不着那些蜘蛛来消耗资源,网上找到一段Nginx配置代码,加上后很灵敏,那些国外蜘蛛第二天就不来了。 if (...

百度UEditor编辑器自定义标题样式修改教程

百度UEditor编辑器自定义标题样式修改教程

因为自己运营的某个网站后台编辑器使用的是百度UEditor,用这个编辑器自带功能给文章可以加四个自带标题样式,但这个标题样式令人难以满意,故决定自己动手修改。从网上搜索教程,发现可能涉及到两个文件的修改,一个是该编辑器目录下editor/u...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。
现在,非常期待与您的又一次邂逅

我们努力让每一次邂逅总能超越期待

智能客服
欢迎咨询智能客服,我可以回答些简单问题