首们需要position:absolute;绝对定位，或者position:fixed。而层的定位点，使用外补丁margin负值的方法。负值的大小为层自身宽度高度除以二。
　　如：一个层宽度是400，高度是300。使用绝对定位距离上部与左部都设置成50%。而margin-top的值为－150。margin-left的值为－200。这样我们就实现了层垂直居中于浏览器的样式编写。

.site_nav{position:fixed; z-index: 2; padding:6px 10px; left:50%; top:50%; margin:-150px 0 0 -200px;}

让div垂直以及水平居中浏览器窗口的更多相关文章

  1. div浮动框居于浏览器窗口中间

    代码先贴这里,随后再改 <script language="JavaScript"> document.getElementById('divCenter').styl ...

  2. div在浏览器窗口中居中

    让div相对于浏览器窗口居中. 方案一:纯粹使用CSS实现 <!DOCTYPE html> <html> <head> <meta charset=" ...

  3. DIV垂直/水平居中2（DIV宽度和高度是动态的）

    <!doctype html><html><head><meta charset="utf-8"><title>块元素D ...

  4. 在浏览器窗口内移动的div

    ------------今天研究了一个最简单的屏保效果----------- 效果图如下:效果很神奇,就是这个div在浏览器窗口不断的灵活移动 代码却很简单 <!DOCTYPE html> ...

  5. scrollIntoView 前的元素滚动到浏览器窗口的可视区域内 不止垂直滚动，还有水平滚动

    Element.scrollIntoView() 方法让当前的元素滚动到浏览器窗口的可视区域内 element.scrollIntoView(); // 等同于element.scrollIntoVi ...

  6. css通用小笔记03——浏览器窗口变小 div错位的问题

    我最近写网页的时候,经常碰到一个普遍的问题,经过我的查阅和尝试,终于解决了这一问题,这里有两种方法提供给大家,如果博友还有更好的方法,欢迎补充. 一.使用min-width属性: 我们先看看下面这段代 ...

  7. 让div自适应浏览器窗口居中显示

    今天做 banner 时发现一个问题,就是浏览器窗口水平拉伸时 banner 图未能居中,所以网上找了些资料,自己写了个小 demo html代码: <div class="div1& ...

  8. 让div垂直居中于浏览器窗口

    <style type="text/css">  div  {   position:absolute;   top:50%;   left:50%;   margin ...

  9. 理解javascript中的浏览器窗口——窗口基本操作

    × 目录 [1]窗口位置 [2]窗口大小 [3]打开窗口[4]关闭窗口 前面的话 BOM全称是brower object model(浏览器对象模型),主要用于管理窗口及窗口间的通讯,其核心对象是wi ...

随机推荐

  1. TestNG参数化测试【转】

    原文:http://www.yiibai.com/testng/20130916303.html 在TestNG的另一个有趣的功能是参数测试.在大多数情况下,你会遇到这样一个场景,业务逻辑需要一个巨大 ...

  2. 在WPF的WebBrowser控件中屏蔽脚本错误的提示

    在WPF中使用WebBrowser控件显示网页时,经常会报脚本错误的提示,如何屏蔽掉这些错误提示呢.方法是定义如下方法: public void SuppressScriptErrors(WebBro ...

  3. .NET相关操作其他文件的小程序（系列文章）

    平时自诩为使用.NET做开发,但是实际上从一开始学习C#直到现在除了做个几个不登大雅之堂的小网站,做过几个winform程序和几个控制台应用程序,真的没有踏踏实实地用.NET开发过某些属于自己的东西. ...

  4. listView后面加控件，防止被挤

    <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=&quo ...

  5. ABP框架详解（二）AbpKernelModule

    AbpKernelModule类是Abp框架自己的Module,它也跟所有其他的Module一样继承自AbpModule,重写PreInitialize,Initialize,PostInitiali ...

  6. \(\S1 \) Gaussian Measure and Hermite Polynomials

    Define on \(\mathbb{R}^d\) the normalized Gaussian measure\[ d \gamma(x)=\frac{1}{(2\pi)^{\frac{d}{2 ...

  7. [leetcode 27]Implement strStr()

    1 题目: Implement strStr(). Returns the index of the first occurrence of needle in haystack, or -1 if ...

  8. jquery选择器如何获取父级元素、同级元素、子元素

    一.新建页面 <ul> <li>list item 1</li> <li>list item 2</li> <li class=&qu ...

  9. Emberjs之Observer

    Observer Person.reopen({ fullNameChanged: Ember.observer('fullName', function() { // deal with the c ...

  10. 微信自定义分享到朋友圈API

    <script src="http://s0.qhimg.com/!249ce048/WeixinApi.js" type="text/javascript&quo ...