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

position:absolute;
top: 50%;
left: 50%;
margin: -270px 0 0 -455px;

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

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

 <style>
span {
width: 200px;
height: 200px;
background: red;
float: left;
}
</style>
<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. SecureCRT无法使用root账户远程连接ubuntu

    ========1.问题============ SecureCRT无法使用root账户远程连接ubuntu 用其他账户连接,正常 用root账户连接,不能连接 =========2.原因====== ...

  2. Message Queue

    RabbitMQ 是使用Erlang编写的一个开源的消息队列,本身支持很多的协议:AMQP,XMPP, SMTP, STOMP,也正是如此,使的它变的非常重量级,更适合于企业级的开发.同时实现了一个经 ...

  3. C# 队列(Queue)解决简单并发

    日志例子: private static Queue<string> m_Message = new Queue<string>(); private static bool ...

  4. 在稳定性测试中,将测试结果持续填加进入html报告

    公司需要设计一个稳定性测试,就是一直持续的跑不同的用例,直到人为停止,用例基本完成,基本框架思路就是随机选择一个testcase,跑完后输出结果.但存在一个问题,现在的unittest或nose测试报 ...

  5. Windows Server 2008 R2之二从介质安装 AD DS

    可以使用 Ntdsutil.exe 为在域中创建的其他域控制器创建安装介质.通过从介质安装,可以最大程度地减少网络上目录数据的复制.有利于在远程站点中更高效地安装其他域控制器. 实验环境: 在Wind ...

  6. python获取windows所有com口

    import serial import serial.tools.list_ports port_list = list(serial.tools.list_ports.comports()) po ...

  7. python pandas 豆瓣电影 top250 数据分析

    豆瓣电影top250数据分析 数据来源(豆瓣电影top250) 爬虫代码比较简单 数据较为真实,可以进行初步的数据分析 可以将前面的几篇文章中的介绍的数据预处理的方法进行实践 最后用matplotli ...

  8. HDU 1789 - Doing Homework again - [贪心+优先队列]

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1789 Time Limit: 1000/1000 MS (Java/Others) Memory Li ...

  9. POJ 1066 - Treasure Hunt - [枚举+判断线段相交]

    题目链接:http://poj.org/problem?id=1066 Time Limit: 1000MS Memory Limit: 10000K Description Archeologist ...

  10. POJ 1269 - Intersecting Lines - [平面几何模板题]

    题目链接:http://poj.org/problem?id=1269 Time Limit: 1000MS Memory Limit: 10000K Description We all know ...