大连网站建设DIV+CSS盒子模型的简单概述

之前,我们简单介绍了什么是DIV+CSS,现在大连网站建设提供商——威思网络将带您继续走进css课堂,简单为您介绍下DIV+CSS盒子模型吧。

CSS盒子:

根据字面我们可以理解,CSS盒子也是装东西的,比如我们要将文字内容、图片布局网页中,那就需要像盒子一样装着。这个时候我们对其对象设置高度(height)、宽度(width)、边框(border)、边距(margin)、填充(padding),即可实现像盒子一样的长方形、正方形平面盒子。

通常我们这样:

一组<div></div>、<span></span>等类似这种语法标签组叫1个盒子。因为我们对其设置了高度(height)、宽度(width)、边框(border)、边距(margin)、填充(padding)等属性后即可呈现出盒子一样的长方形或正方形。所以我们CSS盒子模型因此而得来。

日常使用CSS盒子:

我们说将什么内容放入一个盒子里,我们就要想到是放入<div></div>里,脑海里就要这个概念。
假如我们说设置一个宽度为100px盒子,我们就要知道如下一个概念:

Css样式代码:

.yangshi{width:100px;}

对应html代码:

<div class="yangshi">内容</div>

这个时候我们可以将<div class="yangshi">内容</div>看作为一个盒子。