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

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. 题目1198:a+b(高精度计算,好像有点问题)

    题目链接:http://ac.jobdu.com/problem.php?pid=1198 详解链接:https://github.com/zpfbuaa/JobduInCPlusPlus 参考代码: ...

  2. 题目1442:A sequence of numbers(数列计算以及二分求幂运用)

    题目链接:http://ac.jobdu.com/problem.php?pid=1442 详解链接:https://github.com/zpfbuaa/JobduInCPlusPlus 参考代码: ...

  3. mvn deploy命令上传包

    需求:有的时候需要单独上传release jar包,因为存在工程代码在A内网SVN,Nexus在B内网.这种情况下使用VPN也无法解决Jar包发布的问题. 这个时候采取的方式只能是: 打出jar包 - ...

  4. 移动端mobiscroll无法滑动、无法划动选值的问题

    mobiscroll配置 theme: 'ios',时.滑动取值无效: html的页面内容稍微长过手机屏幕,页面无法完全加载,允许稍微滑动,这时导致点击选择mobiscroll值时无法滑动取值.处理: ...

  5. STS没有找到Dynamic Web Project

    解决:安装JavaEE插件 help-> install new software-> 选择sts对应的eclipse版本站点,如eclipse版本4.09选择2018-09.4.10选择 ...

  6. R排序sort、order、rank、arrange

    Ø sort sort(x, decreasing = FALSE, ...) ## Default S3 method: sort(x, decreasing = FALSE, na.last = ...

  7. 纯CSS绘制的三角形箭头图案【原创】

    参考:http://www.webhek.com/css-triangles/ 使用上下左右的三角形箭头标志,直接用css即可完成,直接附上代码. css: div#up { width: 0px; ...

  8. Print or Cout an Unsigned Char Variable 打印无符号字符

    在C++中,unsigned char用来表示一个字节,也就是8位大小的值,那么我们如何来打印出其值呢,用cout直接打印会乱码,我们可以通过下面两种方法来打印: cout << stat ...

  9. TFS二次开发02——连接TFS

    在上一篇<TFS二次开发01——TeamProjectsPicher>介绍了  TeamProjectsPicher 对象,使用该对象可以很简单的实现连接TFS. 但是如果我们要实现自定义 ...

  10. 使用sift特征点进行knn最近邻匹配

    #include <opencv2/xfeatures2d/nonfree.hpp> #include <opencv2/features2d/features2d.hpp> ...