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. 几个实用的mysql函数

    在工作中,处理数据时候往往使用php要废很多脑筋和写很多东西,如果不考虑代码的阅读性试试几个mysql的函数可以解决许多常见需求: 1.截取字符串函数: left() 从左开始截取字符串  right ...

  2. mongodb 备份 还原 导出 导入

    张映 发表于 2013-12-03 分类目录: nosql 标签:mongodb, 备份, 导入, 导出, 还原 mongodb数据备份和还原主要分为二种,一种是针对于库的mongodump和mong ...

  3. .Net模拟提交表单

    2016-09-0210:49:20 以中邮速递API为服务接口,由于提交方式为表单提交,我要获取返回值来处理其他业务,所以一开始尝试采用Js后台获取返回值,但是涉及到跨域请求限制问题,那边服务端接口 ...

  4. MFC 对话框控件自动布局

    MFC 设计界面程序总是不够智能,没有这样,没有那样. 今天为了加强mfc功能,设计了一个自动布局的类,使用非常简单. 原理: 每个控件都有一个矩形区域,矩形区域就是控件在对话框中的显示位置和大小, ...

  5. 使用Mulesoft建立webservice, jax-ws方式, wsdl first

    先创建wsdl,然后生成class 1. 下载 HRData.xsd 和 HRDataService.wsdl http://yunpan.cn/Q4zBXC4fvC74xhttp://yunpan. ...

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

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

  7. 【python】属性

    在python中,一切皆是对象(object),对象拥有很多属性(arrtribute) 属性分2种 类属性(class attribute):类自身定义or继承 对象属性(object attrib ...

  8. GridView不能添加头布局，并且scrollView与GridView冲突导致一些页面无法融合

    此贴为标记贴 方便下次使用 在项目需求中原本是用ScrollView来进行整个页面的滑动,ScrollView里面包含的有图片轮播,文字轮播,与2列GridView的item 问题 使用原生的Grid ...

  9. ie11浏览器和chrome浏览器对于bgsound和background的一些区别

    今天在编写一个非常简单的网页的时候,按照书上写的,使用了一个jpg图片作为背景图片,用background属性放在<body>标签内,同时使用<bgsound>标签插入背景音乐 ...

  10. ACM 暴力搜索题 题目整理

    UVa 129 Krypton Factor 注意输出格式,比较坑爹. 每次要进行处理去掉容易的串,统计困难串的个数. #include<iostream> #include<vec ...