美文网首页
css脱离文档流的中间布局

css脱离文档流的中间布局

作者: 小白脸开红花 | 来源:发表于2017-07-25 10:15 被阅读0次

position:fixed;position:absolute;都适用

html内容:

<div>123</div>

div {

background:#777;

position: fixed;

margin:auto;

left: 50%;

top:50%;

transform:translateY(-50%) translateX(-50%);

}/*不设长宽在中间 ie9以上正常*/

/* div {

width: 100px;

height: 100px;

background:#777;

position: fixed;

margin:auto;

left: 50%;

top:50%;

transform:translateY(-50%) translateX(-50%);

} *//*ie9开始在中间*/

/* div {

width: 100px;

height: 100px;

background:#777;

position: fixed;

margin:auto;

left: 0;

right: 0;

top:0;

bottom: 0;

} *//*ie8开始在中间*/

相关文章

  • css脱离文档流的中间布局

    position:fixed;position:absolute;都适用 html内容: 123 div {bac...

  • 前端面试复习要点

    一、HTML和CSS 页面布局的方法 1、浮动布局(布局简单,兼容性好,但是浮动元素脱离文档流) 2、绝对定位布局...

  • Css中的float和BFC(Block Formatting

    css中的float(浮动): 在css中浮动的作用可让元素脱离文档流,从而达到某种布局效果 float:left...

  • CSS中脱离文档流是什么意思?

    CSS中脱离文档流,也就是将元素从普通的布局排版中拿走,其他盒子在定位的时候,会当做脱离文档流的元素不存在而进行定...

  • css 定位的几种方式

    文档流/脱离文档流 文档流,指的是元素在排版布局过程中,元素会从自上到下,从左到右的顺序依次排列; 脱离文档流,指...

  • 圣杯双飞翼布局

    说到圣杯双飞翼布局其实指的是实现左右定宽,中间自适应,同时需要中间部分先加载的一个布局。 float 脱离文档流之...

  • PHP从入门到精通,026第三章CSS之DIV+CSS标准化布局

    四、DIV+CSS标准化布局 (五)、浮动布局 说明:元素在网页中进行左或右的“漂浮”,脱离原来的文档流。 浮动的...

  • CSS布局

    CSS入门(3) CSS的常见布局 CSS常见布局使用display属性(文档流)+position属性(定位)+...

  • 前端基础知识

    一、页面布局 题目1:请写出三栏布局,左右各300px, 中间自适应 1. float 特点: 不会脱离文档流 浮...

  • 前端基础(问答7)

    keywords: 定位、浮动、布局、文档流、负margin。 文档流的概念指什么?有哪种方式可以让元素脱离文档流...

网友评论

      本文标题:css脱离文档流的中间布局

      本文链接:https://www.haomeiwen.com/subject/pqcwkxtx.html