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. 一个简单的P2P传输程序

    写了一个简单的P2P传输程序,在P2P的圈子中传输文件,不过为了简便,这个程序没有真正的传输文件,只是简单的判断一下文件的位置在哪里.这个程序可以处理当有一个peer闪退的情况,在这种情况下,剩下的p ...

  2. Nand Flash,Nor Flash,CFI Flash,SPI Flash 之间的关系

    前言:    在嵌入式开发中,如uboot的移植,kernel的移植都需要对Flash 有基本的了解.下面细说一下标题中的中Flash中的关系 一,Flash的内存存储结构    flash按照内部存 ...

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

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

  4. windows8.1下常用编辑器安装配置(emacs/vim/sublime text3)

    一.下载:在emacs:http://mirrors.ustc.edu.cn/gnu/emacs/windows/里下载emacs-24.3-bin-i386.zip.解压到自定目录,双击bin文件夹 ...

  5. Android TelephonyManager电话管理器

    今天介绍一下Android的电话管理器--TelephonyManager,TelephonyManager管理手机通话状态.电话网络信息的服务类,获取TelephonyManager: Teleph ...

  6. CFD计算

    47 求解器为flunet5/6在设置边界条件时,specify boundary types下的types中有三项关于interior,interface,internal设置,在什么情况下设置相应 ...

  7. 【转】Linux下如何清除系统日志

    使用过Windows的人都知道,在使用windows系统的过程中系统会变得越来越慢.而对于Windows下饱受诟病的各种垃圾文件都需要自己想办法删除,不然系统将会变得越来越大,越来越迟钝!window ...

  8. IOS调用系统声音(键盘声音)

    #import <AudioToolbox/AudioToolbox.h> AudioServicesPlaySystemSound(1106); 注:括号中为系统声音的id,详见 htt ...

  9. 重置了下系统好多关于mysql密码的文章都很渣拷分好的备用

    方法1: 用SET PASSWORD命令 mysql -u root mysql> SET PASSWORD FOR 'root'@'localhost' = PASSWORD('newpass ...

  10. 利用calc计算宽度

    width:calc(100% - 40px)可用 + - * / 进行计算(ie9+) 注:计算符号前后必须跟上空格.