定位:定位在中间,放大缩小时也不会跑偏。

  1. position:absolute;
  2. top: 50%;
  3. left: 50%;
  4. margin: -270px 0 0 -455px;

解释:定位后,设百分比的位置,再设置外边距。

浮动:span等行内元素不能设置宽高,但在浮动后可以设置宽高。

  1. <style>
  2. span {
  3. width: 200px;
  4. height: 200px;
  5. background: red;
  6. float: left;
  7. }
  8. </style>
  9. <span>qqq</span>

css定位浮动总结的更多相关文章

  1. CSS定位——浮动定位

    CSS定位机制Ⅱ——浮动定位 float属性:进行浮动定位   left,right clear属性:清除浮动   left,right,both  ㈠  float属性 1.概述 ⑴div实现横向多 ...

  2. css定位 浮动 伪类 margin

    一,margin .标准文档流,margin在竖直方向的不叠加,以较大的为准 .使用margin: auto;的盒子必须有明确的width,并且只有标准文档流的盒子 才能使用margin: auto; ...

  3. 3 CSS 定位&浮动&水平对齐&组合选择符&伪类&伪元素

    CSS Position(定位):元素的定位与文档流无关 static定位: HTML元素的默认值, 没有定位,元素出现在正常的流中 静态定位的元素不会受到top,bottom,left,right影 ...

  4. 深入理解CSS定位—浮动模型

    前面我们讲到了绝对定位,在这篇文章中,我们将讲到3种定位模型中的浮动模型.主要参考 张鑫旭在慕课网的 深入理解float 那些年我们一起清过的浮动---by 一丝丝凉 精通CSS 注意:第二小节基本参 ...

  5. HTML学习笔记 css定位浮动及瀑布流案例 第十三节 (原创) 参考使用表

    #fd { width: 100px; height: 150px; background-color: forestgreen; float: left; } #sd { width: 150px; ...

  6. css清除浮动定位造成的异常

    清除浮动是为了解决高度塌陷的问题:内层有好几个div有宽有高,并且选择了浮动定位,但是外层的div却并没有设置宽高.在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动( ...

  7. CSS:CSS定位和浮动

    CSS2.1规定了3种定位方案 1.Normal flow:普通流(相对定位 position relative.静态定位 position static) 普通流(normal flow,国内有人翻 ...

  8. CSS定位(CSS定位概述、相对定位、绝对定位、浮动)

    CSS 定位属性 CSS 定位属性允许你对元素进行定位. 属性 描述 position 把元素放置到一个静态的.相对的.绝对的.或固定的位置中. top 定义了一个定位元素的上外边距边界与其包含块上边 ...

  9. CSS.04 -- 浮动float、overflow、定位position、CSS初始化

    标准流:行内/行内块元素横向有序排列 : 块元素纵向有序排列. 浮动:Float 语法:float:left/right :  设置浮动的元素,脱离标准流 浮动的框可以向左或向右移动,直到它的外边缘碰 ...

随机推荐

  1. Eclipse 创建和读取yaml文件

    工具和用法: 1. eclipse插件包:org.dadacoalition.yedit_1.0.20.201509041456-RELEASE.jar 用法:将此jar包复制到eclipse-jee ...

  2. 安卓APP动态调试-IDA实用攻略

    0x00 前言 随着智能手机的普及,移动APP已经贯穿到人们生活的各个领域.越来越多的人甚至已经对这些APP应用产生了依赖,包括手机QQ.游戏.导航地图.微博.微信.手机支付等等,尤其2015年春节期 ...

  3. [原]git的使用(二)---工作区和暂存区

    接着上篇 git的使用(一) http://www.cnblogs.com/horizonli/p/5323363.html 6.工作区和暂存区(中转站) 工作区(Working Directory) ...

  4. Nginx学习之keepalive

    当然,在nginx中,对于http1.0与http1.1也是支持长连接的.什么是长连接呢?我们知道,http请求是基于TCP协议之上的,那么,当客户端在发起请求前,需要先与服务端建立TCP连接,而每一 ...

  5. Android中openmax实现框架

    OMX中 OMXNodeInstance 负责创建并维护不同的实例,这些实例是根据上面需求创建的,以node作为唯一标识.这样播放器中每个OMXCodec在OMX服务端都对应有了自己的OMXNodeI ...

  6. JavaAgent入门

    JavaAgent 是JDK 1.5 以后引入的,也可以叫做Java代理. JavaAgent 是运行在 main方法之前的拦截器,它内定的方法名叫 premain ,也就是说先执行 premain ...

  7. 【CF708E】Student's Camp 组合数+动态规划

    [CF708E]Student's Camp 题意:有一个n*m的网格,每一秒钟,所有左面没有格子的格子会有p的概率消失,右面没有格子的格子也会有p的概率消失,问你t秒钟后,整个网格的上边界和下边界仍 ...

  8. android极光杀掉程序收不到通知

    http://docs.jpush.io/guideline/faq/#android 第三方系统收不到推送的消息 由于第三方 ROM 的管理软件需要用户手动操作 小米[MIUI] 自启动管理:需要把 ...

  9. 开发工具-网络封包分析工具Charles

    extends:http://blog.devtang.com/blog/2013/12/11/network-tool-charles-intr/ 简介 本文为InfoQ中文站特供稿件,首发地址为: ...

  10. ztree学习---将默认勾选的展开

    这里只给出前台页面上的代码,数据可以从后台获取,注意,在封装数据的时候,注意:Id(节点的id,可以是数字也可以是字符串) , pid(父亲节点的id) , name(节点名称)不能少 . html页 ...