HTML学习笔记 w3sCss盒子模型应用案例（div布局） 第十一节 （原创） 参考使用表
* {
margin: 0px;
padding: 0px;
}
.top {
width: 100%;
height: 50px;
background-color: antiquewhite;
}
.top_content {
width: 75%;
height: 50px;
margin: 0px auto;
/*上下为0，左右自适应*/
background-color: aqua;
}
.body {
margin: 20px auto;
width: 75%;
height: 1500px;
background-color: aquamarine;
}
.body_img {
width: 100%;
height: 400px;
background-color: beige;
background-image: url(http://images.cnblogs.com/cnblogs_com/ttzzyy/1076163/t_8L7BYYH7PD%606Z@3F4X]2V8H.png);
}
.body_content {
width: 100%;
height: 1100px;
background-color: chartreuse;
}
.body_no {
width: 100%;
height: 50px;
background-color: coral;
}
.footing {
width: 75%;
height: 400px;
background-color: darkblue;
margin: 0px auto;
}
.footing_content{
width: 100%;
height: 350px;
background-color: forestgreen;
}
.footing_subnav{
width: 100%;
height: 50px;
background-color: mediumturquoise;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="tzy.css" type="text/css">
</head>
<body>
<div class="top">
<div class="top_content">
</div>
<div class="body">
<div class="body_img"></div>
<div class="body_content">
<div class="body_no"></div>
</div>
</div>
<div class="footing">
<div class="footing_content"></div>
<div class="footing_subnav"></div>
</div>
</div>
</body>
</html>
HTML学习笔记 w3sCss盒子模型应用案例（div布局） 第十一节 （原创） 参考使用表的更多相关文章
- HTML学习笔记 w3sCss盒子模型（阴影）（div的一些使用）案例 第十节 （原创） 参考使用表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- [CSS3] 学习笔记--CSS盒子模型
1.CSS盒子模型概述 盒子模型的内容范围包括:margin(外边距).border(边框).padding(内边距).content(内容)部分组成. 2.内边距 内边距在content外,bord ...
- CSS学习笔记07 盒子模型
1.盒子模型 所谓盒子模型就是把HTML页面中的元素看作是一个矩形的盒子,也就是一个盛装内容的容器.每个矩形都由元素的内容.内边距(padding).边框(border)和外边距(margin)组成. ...
- CSS学习笔记：盒子模型
盒子模型(CSS basic box model):When laying out a document, the browser's rendering engine represents each ...
- ArcGIS模型构建器案例学习笔记-字段处理模型集
ArcGIS模型构建器案例学习笔记-字段处理模型集 联系方式:谢老师,135-4855-4328,xiexiaokui@qq.com 由四个子模型组成 子模型1:判断字段是否存在 方法:python工 ...
- 操作系统学习笔记----进程/线程模型----Coursera课程笔记
操作系统学习笔记----进程/线程模型----Coursera课程笔记 进程/线程模型 0. 概述 0.1 进程模型 多道程序设计 进程的概念.进程控制块 进程状态及转换.进程队列 进程控制----进 ...
- V-rep学习笔记：机器人模型创建3—搭建动力学模型
接着之前写的V-rep学习笔记:机器人模型创建2—添加关节继续机器人创建流程.如果已经添加好关节,那么就可以进入流程的最后一步:搭建层次结构模型和模型定义(build the model hierar ...
- V-rep学习笔记：机器人模型创建2—添加关节
下面接着之前经过简化并调整好视觉效果的模型继续工作流,为了使模型能受控制运动起来必须在合适的位置上添加相应的运动副/关节.一般情况下我们可以查阅手册或根据设计图纸获得这些关节的准确位置和姿态,知道这些 ...
- 汇编入门学习笔记 （七）—— dp，div，dup
疯狂的暑假学习之 汇编入门学习笔记 (七)-- dp.div.dup 參考: <汇编语言> 王爽 第8章 1. bx.si.di.和 bp 8086CPU仅仅有4个寄存器能够用 &qu ...
随机推荐
- Hive基础（4）---Hive的内置服务
版权声明:<—— 本文为作者呕心沥血打造,若要转载,请注明出处@http://blog.csdn.net/gamer_gyt <—— 目录(?)[+] 一:Hive的几种内置服务 ...
- PHP 生成毫秒时间戳
PHP的time()函数生成当前时间的秒数,但是在一些情况下我们需要获取当前服务器时间和GMT(格林威治时间)1970年1月0时0分0秒的毫秒数,与Java中的currentTimeMilis()函数 ...
- Musical Theme poj1743(后缀数组）
Musical Theme Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 16757 Accepted: 5739 De ...
- poj2891非互质同余方程
Strange Way to Express Integers Time Limit: 1000MS Memory Limit: 131072K Total Submissions: 8176 ...
- Ionic3学习笔记（五）动画之使用 animate.css
本文为原创文章,转载请标明出处 目录 前言 animate.css 的使用 animate.scss 的使用 1. 前言 animate.css 是一款强大的.跨浏览器的预设CSS3动画库,内置了很多 ...
- JavaWeb（四）EL表达式
前言 前面详细的说明了什么是JSP和它的一些元素,这篇给大家介绍一下的是EL表达式. 用EL表达式,能更好的使用JSP中的各种内置对象和作用域. 楼主作为大四狗马上要出去面试了,内心很紧张!!! 一. ...
- python之路第四篇（基础篇）
一.冒泡算法实现: 方法一: li = [13,33,12,80,66,1] print li for m in range(4): num1 = li[m] num2 = li[m+1] if nu ...
- myeclipse的快捷键
------------------------------------MyEclipse 快捷键1(CTRL)-------------------------------------Ctrl+1 ...
- File FileStream StreamWriter StreamReader文件读写操作方法
string path = "D:\\AccountChecking\\Test.txt"; string content = "abcdefg\r\nhigklmn\r ...
- PBOC圈存时用到3DES加密解密以及MAC计算方法
最近在做PBOC圈存时用到了3DES的加密解密以及MAC计算问题,在网上了解一些知识,复制了一些demo学习,我这里没有深入研究,只是把我用到的和了解的做个总结,便于以后使用和学习. 3DES分双倍长 ...