CSS框模型( Box Model)规定了元素框处理元素的内容 内边距 边框 和 外边距的方式


CSS框模型概述

可以用下面的模型图概述

aaarticlea/png;base64,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" alt="" />

元素框的最内部分是实际的内容 直接包围内容的是内边距 内边距呈现了元素的背景 内边距的边缘是边框。边框以外是外边距,外边距默认是透明的,因此 不会遮挡其后的任何元素。

提示:背景应用于由内容和内边距 边框组成的区域。

内边距 和 外边距都是可以选的 默认值是0 但是许多元素将由用户代理样式表设置外边距和内边距  可以通过将元素的margin 和 padding 设置为零来覆盖这些浏览器的样式 这可以分别进行 也可以使用通用选择器对所有的元素进行设置。

*{

    padding:0;
margin:0;
}

在CSS中 width 和 height 指的是内容区域的宽度和高度。增加内边距 边框 和 外边距 不会影响内容区域的尺寸。但是会增加元素框的总尺寸。

假设框的每个边上有10个像素的外边距和5个像素的内边距 如果希望这个元素框达到00个像素 就需要将内容的宽度设置为70像素。如下图所示。

#box {
width: 70px;
margin: 10px;
padding: 5px;
}

提示:内边距、边框和外边距可以应用于一个元素的所有边,也可以应用于单独的边。
提示:外边距可以是负值,而且在很多情况下都要使用负值的外边距。

CSS内边距

元素的内边距在边框和内容区之间。控制该区域最简单的属性就是padding属性

CSS padding属性定义元素边框与元素内容之间的空白区域。


CSS padding 属性

CSS padding 属性定义元素的内边距  padding属性接受长度值或者 百分比 但不允许出现负值

例如 你希望所有h1元素的各边都有10像素的内边距 只需要这样

h1 {padding: 10px;}

你还可以按照 上 右 下 左的顺序分别设置各边的内边距 各边均可以使用不同的单位或百分比值:

h1 {padding: 10px 0.25em 2ex 20%;}

单边内边距属性:

也可以通过使用下面四个单独的属性 分别设置上 右  下 左 内边距:

padding-top //上内边距

padding-right //右边的内边距

padding-bottom//下边的内边距

padding-left// 左边的内边距

内边距的百分比数值

百分比数值是相对于其父元素的width计算的 这一点与外边距一样 所以 如果父元素的width改变 他们也会跟着改变。

CSS内边距实例:

1:所有内边距属性在一个声明中

<html>
<head>
<meta charset="UTF-8">
<title>链接</title>
<style type="text/css">
table td.text1 {
padding: 1.5em;
}
table td.test2 {
padding: 0.5em 2.5em;
}
</style>
</head>
<body>
<table border="1">
<tr>
<td class="text1">这个表格单元的每个边拥有相等的内边距</td>
</tr>
</table> <table border="1">
<tr>
<td class="test2">这个单元格的上和下边距是0.5em 左右边距是2.5em</td>
</tr>
</table>
</body>
</html>

如果想要保持一个盒子的占有宽度不变,那么加width就要减padding 加padding就要减width

padding的区域有背景颜色 也就是说background-color 将填充所有board以内的区域

HTML 学习笔记 CSS样式(框模型)的更多相关文章

  1. Html和Css学习笔记-css进阶-盒模型

    我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! 此篇博客是我的复习笔记,html和css学的时间太久了,忘得差不多了,最近要使用一下,所以重新打开html的书略读,后记录了标签 ...

  2. HTML 学习笔记 CSS样式(定位)

    CSS定位(Positioning)属性 允许你对元素进行定位. CSS定位和浮动 CSS为定位和浮动提供了一些属性,利用这些属性 可以建立列式布局,将布局的一部分与另一部分重叠.还可以完成多年来通常 ...

  3. HTML 学习笔记 CSS样式(相对定位 绝对定位)

    CSS相对定位 设置为相对定位(relative)的元素会偏移某个距离.元素仍保持其未定位前的形状,他原本所占的空间仍然保留 CSS相对定位 相对定位是一个非常容易掌握的概念,如果对一个元素进行相对定 ...

  4. HTML 学习笔记 CSS样式(边框)

    元素的边框(border)是围绕元素内容和内边距的一条或多条线 CSS border 属性允许你规定边框的样式 宽度和颜色 CSS 边框 在 HTML 中,我们使用表格来创建文本周围的边框,但是通过使 ...

  5. HTML 学习笔记 CSS样式(链接)

    我们能够以不同的方法为链接设置样式. 设置链接的样式 能够设置链接样式的 CSS 属性有很多种(例如 color, font-family, background 等等).链接的特殊性在于能够根据它们 ...

  6. HTML 学习笔记 CSS样式(字体)

    css字体属性定义文本的字体系列 大小 加粗 风格 和 变形(如小型大写字母(类似于大写字母字体变小了)) css字体系列 在css中 有两种不同类型的字体系列名称 1.通用字体系列 - 拥有相似外观 ...

  7. HTML 学习笔记 CSS样式(文本)

    CSS文本属性可以定义文本的外观 通过文本属性 您可以改变文本的颜色 字符间距 文本对齐装饰文本 对文本进行缩进等等. 缩进文本 把web页面上的段落的第一行缩进,这是最常用的文本格式化效果. css ...

  8. HTML 学习笔记 CSS样式(简介和语法)

    CSS概述 CSS指层叠样式表(Cascading Style Sheets) 样式定义如何显示HTML元素 样式通常存储在样式表中 把样式添加到HTML4.0中 是为了解决内容与表现分离的问题 外部 ...

  9. HTML 学习笔记 CSS样式(外边框 外边框合并)

    CSS外边距 围绕在元素边框的空白区域就是外边距  设置外边距会在元素外创建额外的空白 设置外边距的最简单的方法就是使用 margin 属性,这个属性接受任何长度单位.百分数值甚至负值. CSS ma ...

随机推荐

  1. listview复用机制研究

    Listview在第一次的时候会先把屏幕上绘制的item都new出来,为了讲解方便我把new出来的item都用红色背景,复用的则用绿色背景. 可以看到这个list种有三种item.在第一次展示的时候, ...

  2. IntentService源码分析

    和HandlerThread一样,IntentService也是Android替我们封装的一个Helper类,用来简化开发流程的.接下来分析源码的时候 你就明白是怎么回事了.IntentService ...

  3. C#参考书的链接推荐

    Visual C#.NET入门与提高http://download.chinaitlab.com/soft/6330.htm 使用Visual C# 开发asp.NET入门http://downloa ...

  4. android Gui系统之WMS(2)----窗口的添加

    Android系统很多,但是最常用的就两类,一类是有系统进场管理的,系统窗口.还有一类就是由应用程序产生的,应用窗口. 1.系统窗口的添加流程 1.1 addStatusBarWindow Phone ...

  5. MvcPager 概述 MvcPager 分页示例 — 标准Ajax分页 对SEO进行优化的ajax分页 (支持asp.net mvc)

    该示例演示如何使用MvcPager最基本的Ajax分页模式. 使用AjaxHelper的Pager扩展方法来实现Ajax分页,使用Ajax分页模式时,必须至少指定MvcAjaxOptions的Upda ...

  6. 基于Tomcat + JNDI + ActiveMQ实现JMS的点对点消息传送

    前言 写了一个简单的JMS例子,之所以使用JNDI 是出于通用性考虑,该例子使用JMS规范提供的通用接口,没有使用具体JMS提供者的接口,这样可以保证我们编写的程序适用于任何一种JMS实现(Activ ...

  7. 预写式日志(Write-Ahead Logging (WAL))

    SQL Server中使用了WAL(Write-Ahead Logging)技术来保证事务日志的ACID特性.而且大大减少了IO操作. WAL的核心思想是:在数据写入到数据库之前,先写入到日志.再将日 ...

  8. 【转载】CentOS 6.3下rsync服务器的安装与配置

    一.rsync 简介 Rsync(remote synchronize)是一个远程数据同步工具,可通过LAN/WAN快速同步多台主机间的文件,也可以使用 Rsync 同步本地硬盘中的不同目录. Rsy ...

  9. mysql-4 数据检索(2)

    用通配符进行过滤 like操作符  %通配符   %可以匹配任意字符 SELECT prod_id , prod_name FROM products WHERE prod_name LIKE 'je ...

  10. 未能加载文件或程序集“Newtonsoft.Json, Version=4.5.0.0, Culture=neutral, PublicKeyToken=30ad4fe6b2a6aeed”或它的某一个依赖项 解决方法

    在webconfig中加入这段话就可以了 <runtime>    <assemblyBinding xmlns="urn:schemas-microsoft-com:as ...