1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>无标题文档</title>
  6. <style type="text/css">
  7. .right,.left{height:300px;width:200px;}
  8. .main{float:left;width:100%;background:#F60; height:300px;}
  9. .left{float:left;background:#009933}
  10. .right{ float:right;background:#000000;margin-left:-200px;}
  11. </style>
  12. </head>
  13. <body>
  14. <div class="main">
  15. <div class="left">left</div>
  16. MAIN</div>
  17. <div class="right">RIGHT</div>
  18. </body>
  19. </html>

Layout-3相关代码:3列布局代码演化三]的更多相关文章

  1. Layout-2相关代码:3列布局代码演化[一]

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  2. Layout-3相关代码:3列布局代码演化[二]

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  3. 简单的CSS网页布局--三列布局

    三列布局其实不难,不过要用到position:absolute这个属性,因为这个属性是基于浏览器而言,左右部分各放在左右侧,空出中间一列来实现三列布局. (一)三列布局自适应 <!DOCTYPE ...

  4. CSS多列布局(实例)

    前言 一列布局 二列布局 三列布局 1 一列布局 一列布局: HTML部分 <!DOCTYPE html> <html> <head> <meta chars ...

  5. DIV+CSS 网页布局之:三列布局

    1.宽度自适应三列布局 三列布局的原理和两列布局的原理是一样的,只不过多了一列,只需给宽度自适应两列布局中间再加一列,然后重新计算三列的宽度,就实现了宽度自适应的三列布局. 同样的道理,更多列的布局, ...

  6. 【Android】纯代码创建页面布局(含异步加载图片)

    开发环境:macOS 10.12 + Android Studio 2.2,MinSDK Android 5.1 先看看总体效果 本示例是基于Fragment进行的,直接上代码: [界面结构] 在 F ...

  7. Android利用setLayoutParams在代码中调整布局(Margin和居中)

    我们平常可以直接在xml里设置margin,如: <ImageView android:layout_margin="5dip" android:src="@dra ...

  8. Layout 不可思议(二)—— 两侧定宽的三列布局

    三列布局作为网页设计中最常见的布局,其实现方法早已被诸位前端大神摸透 网上相关的文章很多,原本已无必要再做赘述 不过既然开了 Layout 系列,三列布局就是必修课 本文整理了一些常用的实现方法,然后 ...

  9. 代码: 两列图片瀑布流(一次后台取数据,图片懒加载。下拉后分批显示图片。图片高度未知,当图片onload后才显示容器)

    代码: 两列图片瀑布流(一次后台取数据,无ajax,图片懒加载.下拉后分批显示图片.图片高度未知,当图片onload后才显示容器) [思路]: 图片瀑布流,网上代码有多种实现方式,也有各类插件.没找到 ...

随机推荐

  1. 微信小程序登录(包括获取不到unionid的情况)

    我们一般都是先获取到微信的 unionid,然后再通过 unionid 去登录自己的网站,就可以关联到用户在自己网站上的 user_id,但是在小程序登录中,有时候可以获取到 unionid,有时候获 ...

  2. 学习flask需要用到的包

    Flask 需要下载的包 1.pip install flask 2.pip install flask-script 3.pip install flask-sqlalchemy 4.pip ins ...

  3. day10 参数args kwargs 作用域

    函数参数/作用域/args/kwargs 1.参数 1.1参数基本知识 任意个数 任意类型 func("1",True) 1.2位置传参(调用函数并传入参数) def func(a ...

  4. 引擎设计跟踪 地形LOD的改进

    虽然地形已经有LOD和形变(geomorphing, 这里简称morphing)来进行LOD的渐变,从而避免bump, 但是如果LOD级别过多,远处的高山就会严重丢失细节,比如变成尖尖的凸起,非常丑陋 ...

  5. EBS WEBADI无法创建文档

    有些小伙伴在使用WEBADI时,下载模板之后会发现模板创建文档一直没有成功(没有报错,只是单纯的没有创建出文档),可以参考: http://blog.csdn.net/cyco008/article/ ...

  6. Python3的List操作和方法

    列表函数: len(list):列表元素个数 max(list):返回list中最大的元素 min(list):返回list中最小的元素 list(seq):将元组转换为列表 列表方法: list.a ...

  7. C++字节对齐与位域

    环境: win7_x64旗舰版.VS2015企业版 一.字节对齐: 说明:为了提高 CPU 的存储速度,编译器会对 struct 和 union的存储进行优化,即进行字节对齐. 1. 指定对齐参数值: ...

  8. stolon cloud native postgresql 高可用方案

    stolon方案与patroni 类似,是一个新的pg ha 方案 包含的组件 keeper:它管理一个PostgreSQL实例,汇聚到由领导者sentinel计算的clusterview. sent ...

  9. 谷歌浏览器可以google了

    做为一个开发者好多疑问点或者难点大多数时间 都在进行百度,百度也能解决问题,但是呢如果让我能够google呢?我肯定会优先google的,这里面能够搜到一些国外技术人的文章可供参考. 下面是一个能够支 ...

  10. 结合数据结构来看看Java的String类

    数据结构中定义字符串是由零个或多个字符组成的有限序列,有限,指出字符串的长度是一个有限的数值:所谓的序列,说明串的相邻字符之间具有前驱和后继的关系.字符串一般记为s="a1a2...an&q ...