使一个div始终显示在页面中间

假设我们有一个div层:

首先,我们用css来控制它在水平上始终居中,那么我们的css代码应该是这样:

*{margin:0;padding:0;}

#myDiv{width:400px;height:200px;margin:0 auto;}

这里的400px是你需要居中设置的div的宽度,200px是它的高,margin:0 auto;是控制水平居中的代码

jquery代码应该是这样:

$(function{

//获得当前浏览器的内部高(即:不包含外边框和地址栏,工具栏的高)

var height = window.innerHeight;

//设置内容显示在中间

//这里的200是你要居中显示的div层的高,注意这里没有px

if(height> 200){

//设置要居中显示的div层的外边距

//myDiv是它的id

$("#myDiv").css("margin-top",(height-200)/2);

}

//设置当浏览器的大小改变时触发的事件

$(window).resize(function(){

//获得当前浏览器的高

varheight = window.innerHeight;

//设置内容显示在中间

if(height> 200){

$("#myDiv").css("margin-top",(height-200)/2);

}

});

});

让一个div始终固定在页面的某一固定位置的方法

方法一:直接用position:fixed 方法二:写一个滚动条滚动事件,让这个div设置 position:absolute 该top的距离等于滚动的距离scrollTop() 写法如下:$(win ...

如何使一个div能够铺满整个页面? && 模态框的制作 && outerHTML

说明: 使用 ele.outerHTML = '' 这样的方法可以很容易的清除一个元素. 当然也可以使用parent.removeChild() ,但是相较而言,还是使用 outerHTML = '' ...

jquery怎么实现点击一个按钮控制一个div的显示和隐藏

示例html 1 2

VC使一个对话框不显示

//add  this void CbkDlg::OnNcPaint() {     ShowWindow(SW_HIDE);     CDialog::OnNcPaint(); }     初始化时 ...

使一个div元素上下左右居中

第一种方法 浮动流自我调节 .box{ widht:200px; height:200px; position:relative; } .box .son{ width:100px; height:1 ...

jQuery 移入显示div,移出当前div,移入到另一个div还是显示。

jQuery 移入移出 操作div 1

div中显示页面

在css中显示页面,在页面布局中很多时候都要在一个div 里显示某些页面.在这里写下我用到的一种方式.

JQuery 弹出层,始终显示在屏幕正中间

1.让层始终显示在屏幕正中间: 样式代码: .model{ position: absolute; z-index: 1003; width:320px; height:320px; text-ali ...

jquery判断div是否显示或者隐藏

jquery判断div是否显示或者隐藏 很多时候会要判断一个div是不是显示着,没显示要怎么处理,显示的如何处理: 方法很简单,选择到你要判断的div,再用is(':hidden')判断是否隐藏:或者 ...

随机推荐

iOS修改button的点击范围

一般来说,按钮的点击范围是跟按钮的大小一样的.若按钮很小时,想增大点击区域,网上通用的方法有①设置btn图片setImage,然后将btn的size设置的比图片大②在btn上添加一个比较大的透明btn ...

PHP面向对象——静态属性和静态方法

静态属性 所谓静态属性,也就是这个属性对于这个类来说是唯一的,不管有多少个对象,只要它引用了一个静态对象,那么这些对象引用出来的值肯定是同一个. 静态变量不能使用->这种箭头符号,而是使用::这 ...

C/C++时间函数的使用

来源:http://blog.csdn.net/apull/article/details/5379819 一.获取日历时间time_t是定义在time.h中的一个类型,表示一个日历时间,也就是从19 ...

iOS开发—— UIImagePickerController获取相册和拍照

一.简单的拍照显示,或是从相册中直接选取照片 #import "ViewController.h" @interface ViewController ()

MySQL连接问题【如何解决MySQL连接超时关闭】

--MySQL连接问题[如何解决MySQL连接超时关闭] ------------------------------------------------转载 最近做网站有一个站要用到WEB网页采集器 ...

JAVA基础2——类初始化相关执行顺序

类初始化相关执行顺序 几个概念说明 代码块的含义与作用 static静态代码块: 一般用于初始化类中的静态变量.比如:给静态的数组或者list变量赋初值.使用static静态代码块进行初始化与直接在定 ...

Java sax、dom、pull解析xml

-------------------------------------SAX解析xml---------------------------------- >Sax定义 SAX是一个解析速度 ...

IFE第二天

HTML是超文本标记语言,HTML5是下一代的HTML标准. HTML元素是组成HTML文档的部分,HTML属性为HTML元素提供附加信息. 文档类型声明帮助浏览器正确 ...

matplotlib 生成 eps 插入到 tex

matplotlib 生成 eps 插入到 tex matplotlib 生成 eps,就可以插入到 tex 中,而且是矢量图,放大不失真. 而且因为图中的元素都是嵌入到 pdf 中,所以图中的文字也 ...

Python函数部分(1)

之前,我们编代码时程序遵循的原则是:根据逻辑从上至下实现功能,其往往用一大段代码来实现指定功能,开发过程中最常见的操作就是粘贴复制,也就是将之前实现的代码块复制到现需功能处.这种方式虽然可以应付一般性 ...

html div显示页面中间,使一个div始终显示在页面中间相关推荐

  1. 使一个div居中显示的三种方法

    使一个div居中显示的三种方法 1. <!DOCTYPE html> <html lang="en"> <head><meta chars ...

  2. 【简单实现html页面指定某一个div局部刷新】

    [简单实现html页面指定某一个div局部刷新] 运用情景 代码实现 运用情景 根据页面功能需要实现具体的某一个div的数据实现实时刷新,显示实时数据流 代码实现 刷新脚本: # 代码直接放在.htm ...

  3. 将div垂直居中放置在另一个div中[重复]

    本文翻译自:Vertically centering a div inside another div [duplicate] This question already has answers he ...

  4. 如何使 一个 div 居中显示

    在 chrome 或 FireFox里,使用 body{ margin:0px; padding:0px; } div{ magin:0 auto; } 即可让一个 div 居中显示,但在 IE 里不 ...

  5. html这一段div居中显示,使一个div居中显示的三种方法

    使一个我自址哈这工边识框处己按后大都加控不架的div居中显示比抖朋要插支一圈不者地器享说几的三种方法 1. div居中 /*第一种方法*/ div{ width: 200px; height: 200 ...

  6. html动态显示隐藏div,div隐藏与显示属性 怎么让一个div显示一个div隐藏

    怎么让一个div显示一个div隐藏 总是显示 js控制div显示与隐藏,js利用"hover"属性 1.首先样式要设定好,在每个li区域只能显示a或者b. 2.引入js库代码(jq ...

  7. html是div环绕文字,文字环绕一个div在HTML

    看到,因为我不能用"浮动",在我的标题"绝对",文字环绕一个div在HTML 我有几个div的嵌套我DIV,其中有些是浮动的范围内,并绝对定位的图像占位符.浮动 ...

  8. div设置float后下一个div要换行的解决办法

    div设置float之后,如果没有清除,则下一个被设置float的div会根据上一个float的div的布局进行排版:而下一个没设置float属性的div则是根据它的前一个元素进行排版. 要清除flo ...

  9. 使一个div垂直+水平居中的几种方法

    前几天去一家互联网公司面试,面试官问到了这个应该算是比较简单的问题,在我自认为回答正确时,才知道这道题的答案有很多种,下面就让我们一起来探讨一下这个问题: 思路1:绝对定位居中(原始版) 这个是我回答 ...

最新文章

  1. dcut matlab,cut 命令详解
  2. delphi保存为html文件,如何在程序中将powerpoint生成html页面。就是和在powerpoint另存为html格式的一样(120分)...
  3. 借助Sniffer分析网络流量
  4. sql语句练习(三):LeetCode
  5. 关于Xcode上的Other linker flags
  6. Tensorflow 迁移学习 识别中国军网、中国军视网Logo水印
  7. 一.因子图优化学习---董靖博士在深蓝学院的公开课学习(1)
  8. java加互斥锁关键字_Java中用于给对象加“互斥锁”标记的关键字是。( )
  9. WSUS离线导入更新包
  10. html 样式优先级,CSS样式优先级
  11. HDU-4417-Super Mario(线段树+离线处理)
  12. Eigen3卸载与安装
  13. 教孩子学编程 python 下载_教孩子学编程 python语言版
  14. 41、财务总账科目余额表,三栏式总账,三栏式明细账 查询条件科目增加多选查询
  15. 分层采样(stratified sampling)
  16. Maven在线仓库地址
  17. 一份还热乎的蚂蚁金服面经(已拿Offer)!附答案!!
  18. 丈人/丈母娘,岳父/岳母、妈/母亲/娘 的解释
  19. 龙芯+银河麒麟QT环境配置+fpm打包
  20. webapi2学习笔记

热门文章

  1. 22.5.4-简历修改
  2. Python 读取 支付宝账单并存储到 Access 中
  3. 因果推断(三)——结构因果模型、干预、辛普森悖论
  4. 关于辛普森悖论和逆概率加权的解决方案的记录
  5. excel中千分号‰和万分号‱的使用
  6. Feng终于编译通过!效果挺不错的!
  7. 【网络安全】考试试卷十三
  8. 软件测试培训:不可不知的十大软件测试工具
  9. CCACCN丨第二届社会美育国际艺术节 “2020·表情”优秀作品评选征稿通知
  10. 学会锻炼感悟爱与幸福的能力