1：定位+margin负值实现元素水平垂直居中

　

div{

    position: absolute;

    z-index: 1;

    left: 50%;

    margin-left: -50px;

    width: 100px;

    height: 100px;

}

2: margin-top: -1px解决border多一像素的问题

3，圣杯布局（两边固定，中间自适应）

　

margin负值的几种妙用的更多相关文章

  1. margin负值5种应用

    最近做的项目中经常会用到margin的负值,这里就总结一下关于margin负值的5种使用及相关bug的解决. 1. 在流动性布局中的应用 如WordPress的两栏式不固定布局就是使用margin负值 ...

  2. 初探Margin负值(转)

    相对而言,margin 负值的使用机率在布局中似乎很少,但是我相信一旦你开始掌握就会着迷,接下来我们看看关于margin负值的一些资料: 它是一个有效的属性,至少w3c中明确描述如下:”Negativ ...

  3. 几个常见的布局的多种实现方式及margin负值总结

    第一部分:几个常见的布局实现方式 一.左右两边固定, center中间自适应未知 html代码中 center 部分首先要放在box的最前部分.然后是left,right 圣杯布局: <div ...

  4. margin负值 – 一个秘密武器

    CSS盒模型中,margin是我们老熟悉的一个属性了, 它的负值你用过吗? 你知道 margin负值的秘密武器吗?我们一起看看吧! 1.带竖线分隔的横向列表(例如:网站底部栏目) 传统的分隔符是使用 ...

  5. 深入理解CSS中的margin负值

    前面的话 margin属性在实际中非常常用,也是平时踩坑较多的地方.margin折叠部分相信不少人都因为这样那样的原因中过招.margin负值也是很常用的功能,很多特殊的布局方法都依赖于它.它看似简单 ...

  6. 微吧里的各种margin负值

    直在做各种项目接各种需求,但你的代码能力得到提高了吗?不停的项目经历虽然能够增加你的代码行数,但不一定能提升你的代码质量,所以除了构建阶段的代码细扣,项目之后的代码总结是至关重要的. 微吧中除了模块化 ...

  7. margin负值的使用

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

  8. 理解margin负值

    效果 上和左方的margin负值使元素向上和左方向移动,如果该元素position不是absolute或fixed,这还会导致之后的元素也向上,左移 下和右方的margin负值会缩小下和右方的空间,使 ...

  9. margin负值的相关应用

    1.页面上实现css sprite背景定位效果   其实margin:-40px 0 0 -160px;与background-position:-160px -40px;实现的原理是一致的,而差别就 ...

随机推荐

  1. Uart、SPI和I2C的区别

    串口通信:UART.SPI.I2C区别[引用]   1.UART就是两线,一根发送一根接收,可以全双工通信,线数也比较少.数据是异步传输的,对双方的时序要求比较严格,通信速度也不是很快.在多机通信上面 ...

  2. centos7 jexus在vmware下能访问，主机访问不了解决方案

    能PING通,访问不了web,先在CMD测试telnet ip 80看看是否是防火墙的问题. 修改防火墙,打开指定端口 1 安装iptables [root@centos ~]# yum instal ...

  3. tpch-kudu

    1.在impala里建立好文本表: create external table customer (C_CUSTKEY INT, C_NAME STRING, C_ADDRESS STRING, C_ ...

  4. aspnet Global文件概况

    <%@ Application Language="C#" %> <script runat="server">        void ...

  5. Shell脚本8种字符串截取方法总结

    Linux 的字符串截取很有用.有八种方法. 假设有变量 var=http://www.aaa.com/123.htm. 1. # 号截取,删除左边字符,保留右边字符. 代码如下: echo ${va ...

  6. 事件问题 Event

    Event事件可以理解为在异步过程中实现同步的操作.但是要注意不要过分的使用Event,否则异步就失去了意义. 直接通过代码来说明: #include

  7. 测试数学公式latex

    \( J_\alpha(x) = \sum\limits_{m=0}^\infty \frac{(-1)^m}{m! + 1)}{\left({\frac{x}{2}}\right)}^{2 m + ...

  8. VMware下利用ubuntu13.04建立嵌入式开发环境之一

    1.软件准备: (1) VMware网上很多,需要根据自己的需要选择,这里选用的VMware Workstation 9. (2)ubuntu  操作系统,同样根据自己的需要下载系统安装包.这里我选择 ...

  9. git基本技巧及进阶

    基本技巧 1. 安装后的第一步 在安装好git后,你第一件该做的事是设置你的名字和电子邮箱,因为每次提交都要用到这些信息: $ git config --global user.name " ...

  10. ubuntu 安装MTK 移动终端usb驱动

    lsusbBus 001 Device 002: ID 8087:8000 Intel Corp. Bus 001 Device 001: ID 1d6b:0002 Linux Foundation ...