left,right,top,bottom仅对于position:relative|absolute|fixed的元素有意义。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>inline-block</title>

 <style type="text/css">

 body{font-family:verdana;font-size:12px;}

 div{margin-bottom:20px;border:solid 1px blue;position:relative;height:80px;}

 b,u{display:inline-block;border:solid 1px #00a;padding:10px;}

 u{background:#eee;}

 </style>

 </head>

 <body>

 <p>margin-top:20px;margin-left:20px;</p>

 <div class="container">

     <b>蓝色</b><u style="margin-top:20px;margin-left:20px;">蓝色</u><b>蓝色</b>

 </div>

 <p>position:relative;top:20px;left:20px;</p>

 <div class="container">

     <b>蓝色</b><u style="position:relative;top:20px;left:20px;">蓝色</u><b>蓝色</b>

 </div>

 <p>position:absolute;top:20px;left:20px;</p>

 <div class="container">

     <b>蓝色</b><u style="position:absolute;top:20px;left:20px;">蓝色</u><b>蓝色</b>

 </div>

 <p>position:fixed;bottom:20px;left:20px;(IE6不支持fixed)</p>

 <div class="container">

     <b>蓝色</b><u style="position:fixed;bottom:20px;left:20px;">蓝色</u><b>蓝色</b>

 </div>

 </body>

 </html>

http://bbs.blueidea.com/thread-2919197-1-1.html

http://blog.csdn.net/tomatozq/article/details/7178144

left与margin-left区别的更多相关文章

  1. _margin和margin的区别

    _margin和margin的区别 _margin和margin的区别 Question: margin:15px 300px 0px 100px; height:72px; width:188px; ...

  2. android:padding和android:margin的区别 详解

    转载请说明博客地址:http://blog.csdn.net/qq_32059827/article/details/51487997 看了网上的类似博客,并没有给出确定的区别.现在具体分析一下pad ...

  3. padding和margin的区别

    简单来说,padding就是内边距,margin就是外边距如下图: margin和padding的区别用图表示为:

  4. android的padding和margin的区别

    android:padding和android:layout_margin的区别:padding是站在父view的角度描述问题,它规定它里面的内容必须与这个父view边界的距离. margin则是站在 ...

  5. HTML中padding和margin的区别和用法

     margin(外边距) 定义:margin是用来隔开元素与元素的间距,发生在元素本身的外部,margin用于布局分开元素使元素与元素互不相干. 提示:margin: top right bottom ...

  6. 盒模型中padding、border、margin的区别

    在CSS中,规定了一种基本设计模型——盒模型(也叫框模型),如图所示: 其中包含了四部分内容:element/元素(即图中文字).padding/内边框(图中两个红色边框之间白色部分).border/ ...

  7. padding与margin的区别

    padding    是控件的内容相对控件的边缘的边距． margin      是控件边缘相对父空间的边距． android:gravity 属性是对该view 内容的限定．比如一个button 上 ...

  8. 关于padding与margin的区别

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

  9. input元素的padding border margin的区别

    padding内(不包含padding)的部分才是可输入部分,也是width和height标明的区域.padding的部分加上width和height部分是background的部分.padding的 ...

  10. android:padding和android:margin的区别

    Android的Margin和Padding跟Html的是一样的.如下图所示:黄色部分为Padding,灰色部分为Margin. 通俗的理解: Padding 为内边框,指该控件内部内容,如文本/图片 ...

随机推荐

  1. 前端通过form表单构造带参数url

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  2. xunsearch如何按照ID排序

    你ini再建一个字段id_tmp 类型type=numeric 重建索引的时候 数据源 加一个主键id的别名 id, id as id_tmp 排序的时候按照id_tmp排序

  3. android 屏幕显示

    一.像素 android 常用单位 px.dp.sp dp和sp只与屏幕的物理尺寸有关 dp和sp的区别: sp会随着系统字体的大小而改变,通常用来设置字体大小.dp不会随系统设置的字体改变 dp和p ...

  4. HDU 1856 More is better (并查集)

    题意: 给你两个数代表这两个人是朋友,朋友的朋友还是朋友~~,问这些人组成的集合里面人最多的是多少... 思路: 属于并查集了,我用的是带路径压缩的,一个集合里面所有元素(除了根节点)的父节点都是根节 ...

  5. tarjan算法与无向图的连通性(割点，桥，双连通分量，缩点)

    基本概念 给定无向连通图G = (V, E)割点:对于x∈V,从图中删去节点x以及所有与x关联的边之后,G分裂为两个或两个以上不相连的子图,则称x为割点割边(桥)若对于e∈E,从图中删去边e之后,G分 ...

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

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

  7. 1、Django实战第1天：建立项目mxonline

    工具版本: python3.6.3 django1.9.8 安装工具 mkvirtualenv --python="C:\Python36\python.exe" mxonline ...

  8. POJ 1486 Sorting Slides（二分图匹配）

    [题目链接] http://poj.org/problem?id=1486 [题目大意] 给出每张幻灯片的上下左右坐标,每张幻灯片的页码一定标在这张幻灯片上, 现在问你有没有办法唯一鉴别出一些幻灯片 ...

  9. 【动态规划】【零一背包】CODEVS 1014 装箱问题 2001年NOIP全国联赛普及组

    #include<cstdio> #include<algorithm> using namespace std; ],f[]; int main() { scanf(&quo ...

  10. IntelliJ 常用设置

    一.智能代码提示忽略大小写 打开设置(CTRL+ALT+S)搜索editor,找到“Code Completion”->点击Case sensitive completion后面的选择框,选中N ...