Layout-3相关代码:3列布局代码演化[二]
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Layout Demo</title>
<style type="text/css">
#left {
background-color: #F00;
height: 300px;
width: 300px;
float: left;
}
#right {
background-color: #FF0;
height: 300px;
width: 300px;
top: 0;
right: 0;
position: absolute;
}
#main {
background-color: #999;
height: 300px;
}
#outbox {
width: 80%;
margin-left: auto;
margin-right: auto;
position: relative;
min-width:650px;
}
#outbox2{
padding-right: 300px;
float:left;
}
.photo {
background-color: #00F;
float: left;
height: 50px;
width: 50px;
}
</style>
</head>
<body>
<div id="outbox">
<div id="outbox2">
<div id="left"></div>
<div class="photo"></div>
<div class="photo"></div>
<div class="photo"></div>
<div class="photo"></div>
<div class="photo"></div>
</div>
<div id="right"></div>
<div id="main"> </div>
</div>
</body>
</html>
Layout-3相关代码:3列布局代码演化[二]的更多相关文章
- Layout-2相关代码:3列布局代码演化[一]
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- Layout-3相关代码:3列布局代码演化三]
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- CSS多列布局（实例）
前言 一列布局 二列布局 三列布局 1 一列布局 一列布局: HTML部分 <!DOCTYPE html> <html> <head> <meta chars ...
- 【Android】纯代码创建页面布局（含异步加载图片）
开发环境:macOS 10.12 + Android Studio 2.2,MinSDK Android 5.1 先看看总体效果 本示例是基于Fragment进行的,直接上代码: [界面结构] 在 F ...
- Android利用setLayoutParams在代码中调整布局(Margin和居中)
我们平常可以直接在xml里设置margin,如: <ImageView android:layout_margin="5dip" android:src="@dra ...
- Layout 不可思议（二）—— 两侧定宽的三列布局
三列布局作为网页设计中最常见的布局,其实现方法早已被诸位前端大神摸透 网上相关的文章很多,原本已无必要再做赘述 不过既然开了 Layout 系列,三列布局就是必修课 本文整理了一些常用的实现方法,然后 ...
- 代码: 两列图片瀑布流（一次后台取数据，图片懒加载。下拉后分批显示图片。图片高度未知，当图片onload后才显示容器）
代码: 两列图片瀑布流(一次后台取数据,无ajax,图片懒加载.下拉后分批显示图片.图片高度未知,当图片onload后才显示容器) [思路]: 图片瀑布流,网上代码有多种实现方式,也有各类插件.没找到 ...
- java文件夹相关操作 演示样例代码
java文件夹相关操作 演示样例代码 package org.rui.io; import java.io.File; import java.io.FilenameFilter; import ja ...
- 使用Auto Layout中的VFL(Visual format language)--代码实现自动布局
使用Auto Layout中的VFL(Visual format language)--代码实现自动布局 2014-12-09 10:56 编辑: zhiwupei 分类:iOS开发 来源:机智的新手 ...
随机推荐
- python基础分享
# 一.变量命名规范 # 1.数字 字母 下划线 组成 # 2.不能数组开头和纯数字 # 3.不能用python相关关键字 # 4.不要用中文 # 5.要有意义 # 6.不要太长 # 7.区分大小写 ...
- laravel 错误提示Fatal Error: Class 'Pheanstalk\Pheanstalk' not found
本地环境版本: composer -V Composer version -- ::10 php artisan -V Laravel Framework 5.6.39 错误提示: Fatal Err ...
- JPA Example 基本使用使用实例
一.相关接口方法 在继承JpaRepository接口后,自动拥有了按“实例”进行查询的诸多方法.这些方法主要在两个接口中定义,一是QueryByExampleExecutor,一个是JpaR ...
- HDU - 5755：Gambler Bo （开关问题，%3意义下的高斯消元）
pro:给定N*M的矩阵,每次操作一个位置,它会增加2,周围4个位置会增加1.给定初始状态,求一种方案,使得最后的数都为0:(%3意义下. sol:(N*M)^3的复杂度的居然过了. ...
- until和while 判断网段IP地址是否存在
1.使用until和while分别实现192.168.0.0/24网段内,地址是否能够ping通,若ping通则输出"success!",若ping不通则输出"fail! ...
- vue day5 分页控件
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- HDFS基本Shell命令
bin目录下: 1. hadoop fs 基本操作命令,类似linux shell 2. hadoop dfsadmin 管理命令 3. hadoop fsck (1. 检查hdfs中文件的健康 ...
- SSL Certificate Signed Using Weak Hashing Algorithm 和SSL Medium Strength Cipher Suites Supported的解决方案
这两天有个项目被扫描器报了几个中危,都是SSL证书的问题.记录一下解决方案吧. 第一个问题:SSL Certificate Signed Using Weak Hashing Algorithm 这里 ...
- MongoDB连接
1. import pymongo client = pymongo.MongoClient(host='localhost',port=27017) 2. client=MongoClient('m ...
- redux源码解读（二）
之前,已经写过一篇redux源码解读(一),主要分析了 redux 的核心思想,并用100多行代码实现一个简单的 redux .但是,那个实现还不具备合并 reducer 和添加 middleware ...