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开发 来源:机智的新手 ...
随机推荐
- Java基于opencv实现图像数字识别(三)—灰度化和二值化
Java基于opencv实现图像数字识别(三)-灰度化和二值化 一.灰度化 灰度化:在RGB模型中,如果R=G=B时,则彩色表示灰度颜色,其中R=G=B的值叫灰度值:因此,灰度图像每个像素点只需一个字 ...
- 软件测试_MYSQL
# MYSQL## 基础知识点### 进入数据库:在偏好设置中打开 — 打开终端 /usr/local/mysql/bin/mysql -u root -p### 可以把完整的命令分成几行打,完后用分 ...
- Linux常用文件操作命令
一.进入文件夹 格式:cd [目录名称] 常用选项: cd / 进入当前目录 cd .. 返回上一级目录. cd ../.. 将当前目录向上移动两级. cd - 返回最近访问目录. 二.显示 ...
- windows下配置maven
首先下载好maven的压缩包,然后解压到某个目录下,我解压到了D盘 打开readme.txt 1.2步已经完成,第3步的意思是让我们把bin所在的路径添加到系统变量的path中去 第4步意思是确保的你 ...
- a链接中 JS弹出确认对话框方法
一种: <a href="javascript:if(confirm('确实要删除该内容吗?'))location='http://www.google.com'">弹 ...
- 渗透测试学习 二、Windows基础
系统目录 服务 端口 注册表 黑客常用DOS命令(在拿到shell时会用到) 一. 系统目录 Windows目录 系统的安装目录 System32àconfigàSAM文件 是用户密码的 ...
- Oracle创建用户角色
正在维护一个CS结构的应用,每次创建应用的用户时都需要创建对应的数据库schema,并且需要赋予其相应的对象权限和角色.操作很不方便,所以专门创建了一个角色,过程如下: 1.创建角色 SQL> ...
- Taro 代码及功能，需要注意的地方
Taro 代码不能使用的写法: 请注意无 AppID 关联下,调用 wx.operateWXData 是受限的, API 的返回是工具的模拟返回
- MongoDB解压报错gzip: stdin: not in gzip format的解决方法
MongoDB解压报错gzip: stdin: not in gzip format的解决方法 在安装MongoDB时出现如下报错: [root@vm172--- mongodb]# tar -zxv ...
- MySQL 索引的增删查
查看索引: > SHOW INDEX FROM table_name; > SHOW KEYS FROM table_name; 删除索引: > DROP INDEX index ...