zoukankan      html  css  js  c++  java
  • 完美解决fixed 水平居中问题

    群里的朋友问的,发现自己没写过;就写了下,原理和网上的fixed上下左右四个角的原理一样!

    1、防止页面振动:

    body{
        _background-image: url(about:blank);
        _background-attachment: fixed;
    }

    2、水平垂直居中:

    div{
        100px;
        height:100px;
        background:#999;
        position:fixed;
        top:50%;
        left:50%;
        margin-left:-50px;
        margin-top:-50px;
        position: absolute;
        _left:expression(eval(document.documentElement.clientWidth/2 + document.documentElement.scrollLeft - this.offsetWidth/2 - parseInt(this.currentStyle.marginLeft,10) - parseInt(this.currentStyle.marginRight,10))) ; 
        _top:expression(eval(document.documentElement.clientHeight/2 + document.documentElement.scrollTop  - this.offsetHeight/2 - parseInt(this.currentStyle.marginTop,10) - parseInt(this.currentStyle.marginBottom,10)));
    }

    处理了有margin,border的情况下 

    很简单的例子,复习了下js里面的盒子模型

  • 相关阅读:
    this指向
    作用域链
    入门
    一、servlet之初见
    jdbc之mysql
    第六章、树和二叉树
    第七章、暴力求解法
    机试
    第十三章、字符串
    栈和队列
  • 原文地址:https://www.cnblogs.com/w3cjiangtao/p/3187475.html
Copyright © 2011-2022 走看看