<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<style type="text/css">

.right,.left{height:300px;width:200px;}

.main{float:left;width:100%;background:#F60; height:300px;}

.left{float:left;background:#009933}

.right{ float:right;background:#000000;margin-left:-200px;}

</style>

</head>

<body>

<div class="main">

<div class="left">left</div>

 MAIN</div>

<div class="right">RIGHT</div>

</body>

</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. linux解压缩文件名乱码问题 亲测可用

    unar 这个工具会自动检测文件的编码,也可以通过-e来指定:unar file.zip 即可解压出中文文件.

  2. 初学mysql 那些记不住的命令

    修改密码: https://dev.mysql.com/doc/refman/5.7/en/resetting-permissions.html MySQL 5.7.6 之后: ALTER USER ...

  3. flask中注册验证码和分页

    注册验证码.核心思路,替换注册页面的img标签的src属性. 1.准备好文件夹:captcha2.导包 from utils.captcha.captcha import captcha3.验证码生成 ...

  4. 2018.5.8 python操纵sqlite数据库

    创建: create_Email = "CREATE TABLE if not exists emails (\n\ id INTEGER NOT NULL,\n\ user VARCHAR ...

  5. javaee设计模型简介

    (一)五种模式 1.单例模式 在某些情况下,有些对象只需要一个就可以了,即每个类只需要一个实例.例如,一台计算机上的可以连接多台打印机,但是该计算机上的打印程序只能有一个,这里就可以通过单例模式来避免 ...

  6. javascript DOM document属性

    DOM控制页面中的所有元素 每个载入浏览器的HTML文档都会成为Document对象,利用它可对HTML页面中的所有元素进行访问 常用属性: title:返回或设置当前文档的标题 常用方法 write ...

  7. CS萌新的汇编学习之路(其实是老师作业呵呵哒)Learning of Assembly Language

    第一节课学习汇编语言,做笔记,做笔记 1.概念 首先是汇编语言这门课程的定义以及对于学习高级语言.深入理解计算机系统的作用 软硬件接口机器语言 汇编语言 高级语言 关系 机器语言和汇编语言可移植性差 ...

  8. 迁移32位下的旧代码到64位sever遇到过的两个很诡异的问题

    一个是GetHashCode,这个方法是返回一个int值,在32位系统里,都是正值,但在64位系统里会返回负值. 另一个问题是DataTable的Sort属性,在没有显示写明升序或降序的情况下,在32 ...

  9. PythonStudy——迭代器 iterator

    # 迭代器对象: 可以不用依赖索引取值的容器# 可迭代对象:可以通过某种方法得到迭代器对象 # 迭代器优点:可以不用依赖索引取值# 迭代器缺点:只能从前往后依次取值 可迭代对象 # 可迭代对象:有__ ...

  10. day05-数据类型与操作