<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>Layout Demo</title>

<style>

#container {

	font-family: Arial;

	font-size: 13px;

	position: relative;

	width: 80%;

	margin: 0 auto;

}

#container #logo {

	background-color: #a2d9ff;

	text-align: center;

	padding: 10px;

	height: 80px;

	margin-bottom: 2px;

}

#container #maincontent .content {

	text-align: center;

	float: left;

	height: 500px;

	width: 100%;

	margin-right: -200px;

	background-color: #CCCCCC;

}

#container #maincontent .link {

	text-align: center;

	float: right;

	height: 500px;

	width: 200px;

	background-color: #FF0000;

}

#container #footer {

	text-align: center;

	height: 30px;

	background-color: #00FFFF;

	clear: both;

}

</style>

</head>

<body>

<div id="container">

  <div id="logo">logo</div>

  <div id="maincontent">

    <div class="content">content</div>

    <div class="link">link</div>

  </div>

  <div id="footer">footer</div>

</div>

</body>

</html>

Layout-1相关代码的更多相关文章

  1. [ARM] Cortex-M Startup.s启动文件相关代码解释

    1. 定义一个段名为CSTACK, 这里: NOROOT表示如何定义的段没有被关联,那么同意会被优化掉,如果不想被优化掉就使用ROOT. 后面的括号里数字表示如下: (1):这个段是2的1次方即2字节 ...

  2. Kafka Producer相关代码分析【转】

    来源:https://www.zybuluo.com/jewes/note/63925 @jewes 2015-01-17 20:36 字数 1967 阅读 1093 Kafka Producer相关 ...

  3. 命令行方式使用abator.jar生成ibatis相关代码和sql语句xml文件

    最近接手一个老项目,使用的是数据库是sql server 2008,框架是springmvc + spring + ibatis,老项目是使用abator插件生成的相关代码,现在需要增加新功能,要添加 ...

  4. myBatis自动生成相关代码文件配置（Maven）

    pom.xml文件添加配置 <build> <finalName>generator</finalName> <plugins> <!-- mav ...

  5. 临时2级页表的初始化过程 head_32.S 相关代码解释

    page_pde_offset = (__PAGE_OFFSET >> 20); /* __PAGE_OFFSET是0xc0000000,page_pde_offset = 3072 = ...

  6. 使用Mybatis Generator自动生成Mybatis相关代码

    本文将简要介绍怎样利用Mybatis Generator自动生成Mybatis的相关代码: 一.构建一个环境: 1. 首先创建一个表: CREATE TABLE pet (name VARCHAR(2 ...

  7. K：树、二叉树与森林之间的转换及其相关代码实现

    相关介绍:  二叉树是树的一种特殊形态,在二叉树中一个节点至多有左.右两个子节点,而在树中一个节点可以包含任意数目的子节点,对于森林,其是多棵树所组成的一个整体,树与树之间彼此相互独立,互不干扰,但其 ...

  8. js 横屏 竖屏 相关代码 与知识点

    <!DOCTYPE html> <html> <head> <title></title> </head> <body&g ...

  9. 转：关于Latent Dirichlet Allocation及Hierarchical LDA模型的必读文章和相关代码

    关于Latent Dirichlet Allocation及Hierarchical LDA模型的必读文章和相关代码 转: http://andyliuxs.iteye.com/blog/105174 ...

  10. 论vue项目api相关代码的组织方式

    论vue项目api相关代码的组织方式 看了下项目组同事的代码,发现不同项目有不同的组织版本 版本一: ├─apis │ a.api.js │ b.api.js │ b.api.js │ d.api.j ...

随机推荐

  1. Feign get接口传输对象引发一场追寻

    一个报错引发的追寻之路: Feign get接口传输对象,调用方接口代码: @FeignClient(name = "manage") public interface Acces ...

  2. Build up java environment（配置java环境）

    1,配置环境变量 我的电脑,右键计算机图标,点击“属性” 点击“高级系统设置” 点击“环境变量” “系统变量”一栏,点击“新建” 弹出输入“变量名”.“变量值”窗口 “变量名”输入“JAVA_HOME ...

  3. pytorch dataloader num_workers

    https://discuss.pytorch.org/t/guidelines-for-assigning-num-workers-to-dataloader/813/5 num_workers 影 ...

  4. 渗透测试学习 二、Windows基础

    系统目录  服务  端口  注册表  黑客常用DOS命令(在拿到shell时会用到) 一.  系统目录 Windows目录  系统的安装目录 System32àconfigàSAM文件  是用户密码的 ...

  5. display inline or block

    一.首先要了解什么是块级元素与行级元素 块级元素 会占领页面的一行,其后多个block元素自动换行. 可以设置width,height,设置了width后同样也占领一行.同样也可以设置   margi ...

  6. Web前端学习第一天

    1.SQL注入攻击的发生 select username, email ,descl from users where id=1; 可能会被伪造成 1 union select password,1, ...

  7. vue重温之mint-ui------------点击事件绑定

    第一次接触mint-ui,在使用它的tabbar时,为了达到点击切换页面的效果,采用了点击事件的方式,然后就碰到了这么个问题: 是的,点击事件是不起作用的. 然后刚好一个朋友也在做这块,而且有一段时间 ...

  8. [工作积累] UE4 并行渲染的同步 - Sync between FParallelCommandListSet & FRHICommandListImmediate calls

    UE4 的渲染分为两个模式1.编辑器是同步绘制的 2.游戏里是FParallelCommandListSet并行派发的. mesh渲染也分两类,static mesh 使用TStaticMeshDra ...

  9. hnsdfz -- 6.20 -- day5

    今天子贞的题...... 比前两天充实多了……肝了一个线段树,还玩了一个题答…… 虽然线段树不知道为什么50->25,题答题数据太水全场90+... 感觉也没想出来啥思路,无脑肝线段树,无脑玩题 ...

  10. VMware Workstation Pro 安装win7系统

    1.准备工作VMware Workstation Pro 虚拟机软件cn_windows_7_enterprise_x64_dvd_x15-70741.iso2.选择典型(推荐)(T) 单选按钮 3. ...