css 等高布局
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>测试box-sizing</title>
<style>
html, body, div {
margin: 0;
padding: 0;
} #main {
width: 100%;
overflow: hidden;
}
#left {
float: left;
width: 10%;
margin-bottom: -1000px;
padding-bottom: 1000px;
background: red;
}
#right {
float: left;
margin-bottom: -1000px;
padding-bottom: 1000px;
background: yellow;
} </style>
</head>
<body>
<div id="main">
<div id="left">
dddddddddddddddddds</br>
ssssssssssssss</br>
ssssssssssssssss
</div>
<div id="right">ddddddddddsssssssssssssddddddddddsssssssssssssddddddddddsssssssssssssddddddddddsssssssssssss</div>
</div>
</body>
</html>
css 等高布局的更多相关文章
- CSS等高布局的6种方式
× 目录 [1]边框模拟 [2]负margin [3]table[4]absolute[5]flex[6]js 前面的话 等高布局是指子元素在父元素中高度相等的布局方式.等高布局的实现包括伪等高和真等 ...
- CSS等高布局的7种方式
前面的话 等高布局是指子元素在父元素中高度相等的布局方式.等高布局的实现包括伪等高和真等高,伪等高只是看上去等高而已,真等高是实实在在的等高.本文将介绍边框模拟.负margin这两种伪等高以及tabl ...
- CSS等高布局
做一些后台项目,和一下带侧边栏项目的时候登高布局很常用,总结了下有几种 1.margin-bottom方法 这里直接介绍我认为的最佳的侧边栏/分栏高度自动相等方法.核心的CSS代码如下(数值不固定): ...
- [css]等高列的简单实现
又碰到css等高布局的问题,发现以前没有总结,这里再把基本原理写一下吧. 1.负边距控制法. <div id="content"> <div class=&quo ...
- CSS display:table属性用法- 轻松实现了三栏等高布局
display:table:此元素会作为块级表格来显示(类似 <table>); display:table-cell属性指让标签元素以表格单元格的形式呈现,类似于td标签.目前IE8+以 ...
- css设置多列等高布局
初始时,多个列内容大小不同,高度不同.现在需要设置不同的背景来显示,而且各个列的高度需要保持一致.那么这就需要利用到多列等高布局. 最终需要的效果: 1. 真实等高布局 flex 技术点:弹性盒子布局 ...
- 如何用css实现"等高布局"。
有时候为了让网页实现美观,在不知道高度的情况下,我们要用css实现等高布局效果,传统的方法, 我们可以用javascript实现,但是由于需求决定或者其他的情况下,我们只能用css实现,其方法主要是采 ...
- css实现等高布局 两栏自适应布局 三栏自适应布局
等高布局: HTML结构如下: <div class="wrapper"> <div class="box"> <h1>.. ...
- 关于css解决俩边等高的问题(等高布局)
等高布局 前段时间公司需哦一个后台管理系统,左侧是导航栏,右侧是content区域.然厚刚开始用的是js 去控制的,但是当页面的椰蓉过长的时候,有与js单线程,加载比较慢,就会有那么一个过程,查找了很 ...
随机推荐
- Spring概念
1.控制反转IOC:即生成对象,相当于new的功能,用IOC有利于维护. 2.依赖注入DI:即给属性赋值,相当于JavaBean的setter方法. 3.面向切面方程AOP:使得各个切面和目标类完全松 ...
- vim显示行号、语法高亮、自动缩进的设置
转载自:http://blog.csdn.net/chuanj1985/article/details/6873830 在UBUNTU中vim的配置文件存放在/etc/vim目录中,配置文件名为v ...
- AWS多个EIP的解决方案
前言 前段时间,公司部署在AWS上的一台EC2突然访问不了了,后来经过检测发现是被GWF给墙了,可能是我们经常拿这台服务器来FQ导致的,幸好这台服务器的客户都是在香港的,被墙了对客户没有什么影响,但是 ...
- 调用WCF Client客户端测试
之后
- Python安装mysql-python错误提示python setup.py egg_info
做python项目,需要用到mysql,一般用python-mysql,安装时遇到错误提示如下: Command "python setup.py egg_info" failed ...
- XidianOJ 1063 Chemistry Problem
[提交][状态][讨论版] 题目描述 lw最近正在学习立体化学.立体化学中常用Fischer投影式表示分子的立体构型,例如,对于酒石酸HOOC(CHOH)2COOH,如果用一根横线表示羟基,略去氢原子 ...
- 文法 LL1
<程序>-><声明列表>|<程序><函数> <声明列表>-><声明>|<声明><声明列表> ...
- TestLink安装及整合Jira
TestLink安装及整合Jira 1.Testlink 安装部署 Testlink是一个开源的测试管理工具,主要用于管理测试用例,从测试需求.测试计划.测试用例管理和用例执行,到最后的结果分析,一套 ...
- [小哥Allegro72讲速成视频]
http://v.qq.com/vplus/df932a993679cf80a0b6c87bb849e22c 第01讲 Allegro常用组件介绍 视频链接:http://v.qq.com/boke/ ...
- 因为此版本的应用程序不支持其项目类型(.csproj)”之解
有的时候vs无缘无故的出现如下错误:"因为此版本的应用程序不支持其项目类型(.csproj),若要打开它,请使用支持此类型项目的版本" 解决办法:如果是这个提示,可能是由于你安装m ...