CSS——标准盒子模型
在写网页的时候一般都先用Div把网页的框架搭好(用不同的背景颜色来区分不同的Div块),然后填充每一个Div,最后把每个Div的背景颜色去掉
<html>
<head>
<title></title>
<style type="text/css">
.divIndex
{
width:1000px;height:800px;background-color:yellow;margin:0px auto;
}
.divLogo
{ width:1000px;height:100px;background-color:red;
}
.divContent
{
width:1000px;height:300px;background-color:Green;
}
.divPicture
{
height:300px;width:300px;background-color:Blue;float:left;
}
.divText
{
height:300px;width:700px;background-color:Purple;float:left;
}
</style>
</head>
<body>
<div class="divIndex">
<div class="divLogo">
<img src="data:image/000.jpg" height="100px" alt="姊妹"/>
</div>
<div class="divContent">
<div class="divPicture"></div>
<div class="divText"></div>
</div>
</div>
</body>
</html>
CSS——标准盒子模型的更多相关文章
- CSS样式----盒子模型(图文详解)
盒子模型 盒子中的区域 一个盒子中主要的属性就5个:width.height.padding.border.margin.如下: width:内容的宽度.CSS中 width 指的是内容的宽度,而不是 ...
- 深入理解CSS系列(一):理解CSS的盒子模型
接触前端也有好几个年头了,但是,讲实话,对于CSS的理解真的是不敢恭维,相信很多同行也有类似的感受吧!这是为什么呢?因为我们都认为CSS太简单了,没有必要深入学习,果真如此?其实,只不过是自己图样图森 ...
- 这些HTML、CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML、CSS、盒子模型、内容布局)
这些HTML.CSS知识点,面试和平时开发都需要 No1-No4 系列知识点汇总 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) ...
- #CSS的盒子模型、元素类型
CSS的盒子模型.元素类型 本文首先介绍了CSS元素的统一内部结构模型,盒子模型:然后介绍了CSS元素基于不同分类标准定义的元素类型,包括基于不同内容设置方式定义的replaced元素和non-r ...
- 深入了解CSS中盒子模型
CSS中盒子模型介绍 什么是盒子? 盒子是用来存储物品,我们可以将盒子理解为酒盒,酒盒有什么组成的呢? 有酒可以喝.有填充物保护酒防止酒被摔坏.纸盒子. 我们怎么理解CSS中的盒子呢,CSS中盒子有什 ...
- CSS3_标准盒子模型和怪异盒子模型
#box{ width: 200px; height: 200px; background-color: pink; } 标准盒子模型 box-sizing: content-box; padding ...
- 使用css弹性盒子模型
提示: 当期内容不充实, 修改后再来看吧 以下称:弹性子元素: 子元素, 弹性容器: 容器 弹性盒子的属性 1. css弹性盒子模型规定了弹性元素如何在弹性容器内展示 2. 弹性元素默认显示在弹性容器 ...
- CSS 弹性盒子模型
CSS 弹性盒子模型 https://www.w3.org/TR/2016/CR-css-flexbox-1-20160526/ CSS Flexible Box Layout Module Leve ...
- CSS之盒子模型
CSS核心内容 源文件目录: D:\Users\ylf\Workspaces\MyEclipse 10 标准流 盒子模型 浮动 定位 标准流/非标准流: 标准流:就是普通的 非标准流:实际工作中要打破 ...
随机推荐
- Delphi XE5 for Android (二)
按照Embarcadero的说法:Windows平台只能使用VCL,Windows.iOS和Android都可以使用FMX,并且VCL和FMX不能同时在一个程序中.FMX的用法与VCL有一定的差异,先 ...
- python函数作用域LEGB
我们的在学习Python函数的时候,经常会遇到很多定义域的问题,全部变量,内部变量,内部嵌入的函数,等等,Python是如何查找的呢?以及Python又是按照什么顺序来查找的呢?这里做一个顺序的说明 ...
- JavaScrpt简单介绍
什么是javaScrpt javascript因为兼容于ECMA标准,因此也称为ECMAScript.JavaScript作为一种脚本语言,已经被广泛地应用于Web页面当中,通过嵌入HTML来实现各种 ...
- Linux设备驱动中的IO模型---阻塞和非阻塞IO【转】
在前面学习网络编程时,曾经学过I/O模型 Linux 系统应用编程——网络编程(I/O模型),下面学习一下I/O模型在设备驱动中的应用. 回顾一下在Unix/Linux下共有五种I/O模型,分别是: ...
- 【附2】hystrix详述(2)- 配置
一.hystrix在生产中的建议 1.保持timeout的默认值(1000ms),除非需要修改(其实通常会修改) 2.保持threadpool的的线程数为10个,除非需要更多 3.依赖标准的报警和监控 ...
- nginx配置二级域名
我在我的服务器上面跑了两个node应用程序,分别一个端口2368跑的是ghost博客,一个端口8000跑的是我的demo程序.想要一级域名zhangruojun.com用来访问博客,二级域名demo. ...
- stm32 pwm 电调 电机
先上代码 python 树莓派版本,通俗表现原理.stm32 C语言版本在后面 import RPi.GPIO as GPIO import time mode=2 IN1=11 def setup( ...
- 01_Kafka概述
1.Kafka背景 * LinkedIn开发,2011年成为Apache的一个开源项目* 2012年,成为Apache的一个顶级项目* 基于java和Scala编写, 基于发布-订阅模型的消息系统(离 ...
- HDU 2242 考研路茫茫——空调教室(边双连通分量+树形dp+重边标号)
http://acm.hdu.edu.cn/showproblem.php?pid=2242 题意: 思路:首先求一下双连通分量,如果只有一个双连通分量,那么无论断哪根管子,图还是连通的. 最后只需要 ...
- LookupError: Couldn't find path to unrar library.
LookupError: Couldn't find path to unrar library. 意思是找不到 unrar library的路径,这里我们就需要去下载这个unrar library, ...