<!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <meta name="viewport" content="width=device-width, initial-scale=1.0">

     <meta http-equiv="X-UA-Compatible" content="ie=edge">

     <title>Document</title>

     <style>

         body{

             background-color: #666;

         }

         h1{

             background-color: #fff;

             display: inline-block;

             height: 80px;

             width: 80px;

             /* 内边距 */

             padding: 2%;

             /* 外边距 */

             margin: 2%;

             /* 上、右、下、左 ->2% */

             margin: 2% 2% 2% 2%;

             /* 上下、左右 */

             margin: 2% 0;

             /* 上、左右、下 */

             margin: 2% 4% 2%;

         }

         /* 听说过负margin吗.... */

     </style>

 </head>

 <body>

     <h1></h1>

 </body>

 </html>

css - margin-padding的更多相关文章

  1. css margin padding 四个方向

    margin 和padding虽然有四个单独的方向属性,如margin-left,padding-bottom等等. 但是可以用margin:2px 3px 4px 5px     四个参数的含义:上 ...

  2. 【转】图解CSS的padding,margin,border属性(详细介绍及举例说明)

    W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层.盒模型主要定义四个区域:内容(content).边框距(p ...

  3. HTML CSS——margin与padding的初学

    下文引自HTML CSS——margin和padding的学习,作者fengyv,不过加入了一些个人的看法. 你在学习margin和padding的时候是不是懵了,——什么他娘的内边距,什么他娘的外边 ...

  4. CSS中padding和margin以及用法

    CSS中padding与margin 1.padding:内边距,表示控件内容相对于边缘的距离. 2.margin:外边距,表示控件边缘相对于父空间的边缘. 参考:http://www.studyof ...

  5. [转]图解CSS的padding,margin,border属性(详细介绍及举例说明)

    图解CSS的padding,margin,border属性 W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层 ...

  6. DIV+CSS布局重新学习之float/margin/padding

    之前对div的css布局一直有点半知半解,只其然却不知其所以然,到网上下载了“十天学会DIV+CSS(WEB标准)”的chm电子版,然后跟着练习了一下,特在此记录,备忘. <!DOCTYPE h ...

  7. 图解CSS的padding,margin,border属性(详细介绍及举例说明)

    图解CSS的padding,margin,border属性 W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层 ...

  8. css 行内元素 块元素 替换元素 非替换元素 以及这些元素的width height margin padding 特性

    一.各种元素的width height margin padding 特性(具体css元素的分来参看二) 1.块级元素 width. height. margin的四个方向. padding的四个方向 ...

  9. css之margin && padding讲解

    margin && padding盒子模型: margin是模块与模块的空隙,padding是内容与边框的空隙 注: 1.margin:边缘.空白 2.padding:填充 margi ...

  10. 巧用margin/padding的百分比值实现高度自适应（多用于占位，避免闪烁）

    本文依赖于一个基础却又容易混淆的css知识点:当margin/padding取形式为百分比的值时,无论是left/right,还是top/bottom,都是以父元素的width为参照物的!也许你会说, ...

随机推荐

  1. docker从零开始（五）堆栈初体验，stacks

    先决条件 安装Docker 1.13或更高版本. 获取Docker Compose,请参考第三节 按照第四节中的描述获取Docker Machine. 在第二节中了解如何创建容器. 确保您的图像作为已 ...

  2. hdu5967

    看到合肥赛区的题目都是泪啊,期末考完了来补几道 公正来说,这道题我考场确实写不出来,因为我的lct模板不够完美…… 我在学习lct的时候不知道为什么代码里加边.删边都是用了一个makeroot的操作 ...

  3. (2)SpringBoot 配置

     一.SpringBoot全局配置文件 SpringBoot两个全局配置文件,application.properties和application.yml 例如端口号配置 (1)application ...

  4. 数位dp模版（dp）

    #include <cstdio> #include <cstring> #include <iostream> #include <algorithm> ...

  5. 训练指南 UVALive - 4043（二分图匹配 + KM算法）

    layout: post title: 训练指南 UVALive - 4043(二分图匹配 + KM算法) author: "luowentaoaa" catalog: true ...

  6. 洛谷——P1327 数列排序

    P1327 数列排序 题目描述 给定一个数列{an},这个数列满足ai≠aj(i≠j),现在要求你把这个数列从小到大排序,每次允许你交换其中任意一对数,请问最少需要几次交换? 输入输出格式 输入格式: ...

  7. 51nod 多重背包问题（动态规划）

    多重背包问题 一个背包,承量有限为W,有n种物体,第i种物体,价值Vi,占用重量为 Wi,且有Ci件,选择物品若干放入背包,使得总重量不超过背包的承重.总价值最大? 输入 第1行,2个整数,N和W中间 ...

  8. 微信小程序开发教程（四）线程架构与开发步骤

    线程架构 从前面的章节我们可以知道,.js文件是页面逻辑处理层.我们可以按需在app.js和page.js中添加程序在生命周期的每个阶段相应的事件.如在页面的onLoad时进行数据的下载,onShow ...

  9. 【找规律】Gym - 100923L - Por Costel and the Semipalindromes

    semipal.in / semipal.out Por Costel the pig, our programmer in-training, has recently returned from ...

  10. python基础-匿名函数、内置函数、正则表达式、模块

    1. 匿名函数 1.1 有名函数 有名函数:定义了一个函数名,函数名指向内存地址:通过函数名进行访问.函数名加括号就可以运行有名函数,例如:func() def func(x, y, z = 1): ...