padding-top:10px;是指容器内的内容距离容器的顶部有10个像素,是包含在容器内的;

margin-top:10px;是指容器本身的顶部距离其他容器有10个像素,不包含在容器内;

top:10px;是指容器本身的顶部距离页面的顶端有10个像素。

padding-top、margin-top和top的区别的更多相关文章

  1. 当padding,margin,top为百分比值,具体数值如何计算

    padding以及margin的四个方向设置值为百分数的时候,是以父元素的宽度为基数来进行计算. (为了保持横向和纵向方向上的margin/padding一致,但是其实也不是一定以父元素的宽度为参照物 ...

  2. CSS——简写属性(在padding和margin这样的简写属性中,值赋值的顺序是top、right、bottom、left)

    /* 在padding和margin这样的简写属性中,值赋值的顺序是top.right.bottom.left. 它们还有其他简写方式,例如给padding两个值,则第一个值表示top/bottom, ...

  3. 定位(left 、right 、top 、 bottom)、padding、margin 值设为百分比值时

    定位(left .right .top . bottom): top 为例 right 为例 padding.margin : 当padding.margin 值设为百分比值时,其百分比会相对于父元素 ...

  4. jquery的offset().top和js的offsetTop的区别,以及jquery的offset().top的实现方法

    jquery的offset().top和js的offsetTop的区别,以及jquery的offset().top的实现方法 offset().top是JQ的方法,需要引入JQ才能使用,它获取的是你绑 ...

  5. SELECT TOP 1 比不加TOP 1 慢的原因分析以及SELECT TOP 1语句执行计划预估原理

    本文出处:http://www.cnblogs.com/wy123/p/6082338.html 现实中遇到过到这么一种情况: 在某些特殊场景下:进行查询的时候,加了TOP 1比不加TOP 1要慢(而 ...

  6. Oracle no TOP, how to get top from order

    On ROWNUM and Limiting Results Our technologist explains how ROWNUM works and how to make it work fo ...

  7. 关于padding与margin的区别

    代码一:全为padding. <!doctype html><html><head>    <meta charset="UTF-8"&g ...

  8. Android中的padding和margin的区别

    在Android的布局中,常常有人将padding和margin搞混,他们其实不一样的,padding是该控件的内部距离. magin是该控件与其他控件之间的距离.例如 <LinearLayou ...

  9. {03--CSS布局设置} 盒模型 二 padding bode margin 标准文档流 块级元素和行内元素 浮动 margin的用法 文本属性和字体属性 超链接导航栏 background 定位 z-index

    03--CSS布局设置 本节目录 一 盒模型 二 padding(内边距) 三 boder(边框) 四 简单认识一下margin(外边距) 五 标准文档流 六 块级元素和行内元素 七 浮动 八 mar ...

  10. CSS 盒子模型(Box model)中的 padding 与 margin

    本文将讲述 HTML 和 CSS 的关键—盒子模型 (Box model) .理解 Box model 的关键便是 margin 和 padding 属性,而正确理解这两个属性也是学习用 CSS 布局 ...

随机推荐

  1. Javascript 拖拽的一些简单的应用——逐行分析代码,让你轻松了解拖拽的原理

    今天我们来看看如何让拖拽的物体不能拖出某个div之外和拖拽的吸附功能 上次讲到我们的拖拽是不可拖出可视区范围的,在这基础上我们加个父级的div,不让他拖出父级.原理和之前的一样,简单吧. <di ...

  2. smarty之缓存笔记

    smarty缓存技术 在smarty中,缓存分为:普通缓存,单模版都缓存,局部缓存. 缓存:1:首选打开缓存配置项:$smarty->caching=true; 2:缓存生命周期的配置选项:$s ...

  3. html中的圆角边框

    border-radius:20px; radius:以某某为半径画圆. 如何制作一个圆形: div{height:150px;//像素的一半,再加上边框的像素 width:150px; border ...

  4. PHP面试题之设计模式

    设计模式是技术面试的时候难免会被问到的一个问题,特别会让你举例说明各种设计模式的使用场景. 使用设计模式可以减轻我们的工作量,优化我们的代码. 设计模式非常的多,这里介绍单例模式,工厂模式,组合模式, ...

  5. 论山寨手机与Android联姻 【3】手机是怎样生产出来的

    要说清楚MTK在商业模式上有什么优势,以及Android对于MTK未来的手机开发会有什么影响,首先得了解手机从设计,开发到生产的整个过程.让我们先来看看手机的生产过程.在生产制造环节,山寨手机和正牌手 ...

  6. iOS 倒计时

    // // RootViewController.m // MyTimerDemo // // Created by huluo on 1/21/14. // Copyright (c) 2014 b ...

  7. python循环,判断及函数

    python中的for循环 #for循环格式(类似Java中的foreach):for 标识符 in 列表名称 : >>> movies = ["movie1", ...

  8. Aix字符集

    aix 安装中文字符集 1.看到系统安装过的字符集 locale -a 2.安装 smitty-->System Environments-->Manage Language Enviro ...

  9. c++中自增(++)和自减(--)操作符

    自增(++)和自减(--)操作符为对象加1 或减1 操作提供了方便简短的实现方式.它们有前置和后置两种使用形式.到目前为止,我们已经使用过前自增操作,该操作使其操作数加1,操作结果是修改后的值.同理, ...

  10. 2014.12.06 ASP.NET 三级联动,添加员工,修改员工

    (一)三级联动 要实现的效果: 代码: MyDBDataContext context = new MyDBDataContext(); protected void Page_Load(object ...