<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>padding和margin的用法</title>

    <style>

        .box{

            width:200px;

            height:200px;

            background:tan;

            /*1个参数：4边*/

            padding:30px;

            /*2个参数：上下 左右*/

            padding:10px 20px;

            /*3个参数：上 左右 下*/

            padding:10px 20px 30px;

            /*4个参数：上 右 下 左*/

            padding:10px 20px 30px 40px;

            /*padding-top:10px;

            padding-right:20px;*/

            /*margin:0 100px;*/

            /*margin-left:auto;

            margin-right:auto;*/

            /*让块级元素水平居中*/

            margin:0 auto;

        }

        b{

            background:orange;

            /*margin:0 auto;*/

            /*给行级标签的父元素加text-align:center就可以让行级元素居中*/

            text-align:center;

        }

    </style>

</head>

<body>

    <div style="text-align:center"><b>行级标签</b></div>

    <div class="box">你们峰哥跟我说：他一直就很喜欢小林子！那不直的时候呢？</div>

</body>

</html>

<!--

padding 内边距

    padding 统一设置内边距

        padding:4边

        padding:上下 左右

        padding:上 左右 下

        padding:上 右 下 左

    padding-top

    padding-right

    padding-bottom

    padding-left

margin 外边距

    margin 统一设置外边距

        margin:4边

        margin:上下 左右

        margin:上 左右 下

        margin:上 右 下 左

    margin-top

    margin-right

    margin-bottom

    margin-left

    小提示：margin:0 auto 可以让块级元素水平居中

-->

css 外边距，内边距的使用的更多相关文章

  1. CSS权威指南 - 内边距 边框 和 外边距

    九十年代的完全用表格布局,简单的段落边框都需要用表格.CSS让布局更方便. 基本元素框 basic element boxes 如同第七章基本视觉格式化那一章讲到,每个文档元素会生成一个元素框,这个框 ...

  2. CSS——【元素内边距padding、元素外边距margin、元素边框border-width、元素大小width/height】与【元素显示大小】的关系

    一.基本知识 padding:元素内边距,指的是元素内边框到元素中内容的距离. 用法: padding:长度|百分比 padding-top:长度|百分比 padding-bottom:长度|百分比 ...

  3. CSS.03 -- 浏览器行高、字体；盒子模型--边框、内边距、外边距

    如果此时你也在自学中,请使用 FireWorks CS6 进行切图测距等,百度一下吧~ Fireworks的基本使用 新建文件   ctrl+n 打开文件  ctrl+o 调出和隐藏标尺 ctrl+r ...

  4. css 尺寸、边框、内边距、背景以及css Sprite

    上节课回顾: HTML标签: 格式排版 p 段落 双br 换行 单hr 分隔线 单h1~h6 标题 双pre 原样格式化输出 双div 标签,无任何特殊意义 HTML标签 :文本 <em> ...

  5. CSS 框模型——规定了元素框处理元素内容、内边距、边框和外边距的方式

    转自:http://www.w3school.com.cn/css/css_boxmodel.asp 要知道在父元素:float, rel, abs位置情况下,box模型的变换情况,请见:http:/ ...

  6. css内边距与外边距的区别

    你真的了解margin吗?你知道margin有什么特性吗?你知道什么是垂直外边距合并?margin在块元素.内联元素中的区别?什么时候该用 padding而不是margin?你知道负margin吗?你 ...

  7. CSS框模型（框模型概述、内边距、边框、外边距、外边距合并）

    CSS 框模型概述 CSS 框模型 (Box Model) 规定了元素框处理元素内容.内边距.边框 和 外边距 的方式. 元素框的最内部分是实际的内容,直接包围内容的是内边距.内边距呈现了元素的背景. ...

  8. (转)css内边距与外边距的区别，精辟啊

    css内边距与外边距的区别 (2012-05-02 13:54:54) 转载▼ 标签: 杂谈 分类: css 本文也是网上看了后收藏的,忘了原地址(以后收藏文章得注意) 你真的了解margin吗?你知 ...

  9. CSS 内边距 外边距

    CSS 内边距 外边距 <html> <!-- style="margin: 0 auto" 将网页上方空白边距填满--> <body style=& ...

  10. css总结9：内边距（padding）和外边距（margin）

    1 css总结9:内边距和外边距 通过css总结8:盒子模型可知:内边距(padding),外边距(margin).可以影响盒子在浏览器的位置. 1.1 padding使用:{padding:上 右 ...

随机推荐

  1. 用到UdpClient的一点经验

    Thread.Abort对UdpClient.Receive阻塞的线程无效 http://computer-programming-forum.com/4-csharp/184f9d4ee63704f ...

  2. VedioCapture

    国内的技术的浮躁可见一般,在一个用了七八年的项目里面使用的类,居然拼写都是错的,在网上一搜,转载的也大有人在,最低级的错误,你可以不懂编程,但是只要上过高中,Video这个单词总该学过吧,居然转载的时 ...

  3. 斯坦福大学3D模型库-The Stanford 3D Scanning Repository

    这里总是让人感觉有差距的地方!!! http://graphics.stanford.edu/data/3Dscanrep/

  4. alert、confirm、prompt的区别

    我们在开发一些后台管理系统的时候,经常会用到一些弹出框,今天我们一起看一下吧: alert:仅仅是一个提示的作用,通知用户,会阻线程,alert后面的代码,在用户点击确认后仍然会照常执行. confi ...

  5. Java常见加密技术的密钥与加密串长度

    Java常见的Java方式 1.Base64编码 2.十六进制(Hex)编码 3.MD消息摘要 4.DES加密 5.3DES加密 6.AES加密 6.RSA加密

  6. [MYSQL笔记0]MYSQL的安装

    mysql是一种关系型数据库管理系统.以mysql5.7版本为例,安装过程如下: 首先百度出mysql的官网,进入:(以下是自己安装失败的过程,直接下拉最后看大佬的安装过程吧,就是那个红红的网址) 找 ...

  7. intellij中导入java包

  8. C#基础-委托与事件

    委托 delegate是申明委托的关键字 返回类型都是相同的,并且参数类型个数都相同 委托声明 delegate double DelOperater(double num1, double num2 ...

  9. nuxt generate静态化后回退问题

    之前线上的项目是nuxt build后的项目发布在服务器上,pm2来管理node的进程,nuxt还是运行在node的环境里. 这个方案用了半年左右,访问速度什么的确实很快,pm2管理下的node在wi ...

  10. 用python写一个类似于linux中的tree

    import os filePath = 'g:/File' j = 0 # 查找的深度计数 def tree(filePath,j): dir_now = os.listdir(filePath) ...