css div相对屏幕永远居中
不管屏幕如何滑动,该div始终保持在屏幕正中央(支持IE7(包括IE7)以上版本)
<div class="loginBox"></div>
.loginBox {
background: #FA2;
width: 700px;
height: 400px;
position: fixed;
left: 50%;
top: 50%;
z-index:;
/*设定这个div的margin-top的负值为自身的高度的一半,margin-left的值也是自身的宽度的一半的负值.*/
/*宽为400,那么margin-top为-200px*/
/*高为200那么margin-left为-100px;*/
margin: -200px 0 0 -350px;
}
css div相对屏幕永远居中的更多相关文章
- HTML+CSS,让div在屏幕中居中(水平居中+垂直居中)方法总结
最近写网页经常需要将div在屏幕中居中显示,遂记录下几个常用的方法,都比较简单. 水平居中直接加上<center>标签即可,或者设置margin:auto;当然也可以用下面的方法 下面说两 ...
- css div中内容绝对居中(多行内容)
div中的内容绝对居中(不适合IE6哦,IE6我已经不考虑了),直接看代码吧. <!DOCTYPE HTML> <html> <head> <title> ...
- 让DIV在屏幕上下左右居中
转自:http://blog.sina.com.cn/s/blog_65d41dff0100v0iz.html 其实解决的思路是这样的:首们需要position:absolute;绝对定位.而层的定位 ...
- 使用jQuery在屏幕上居中一个DIV
文章目录 我如何去使用jQuery在屏幕的中心设置<div>? 我喜欢给jQuery添加函数,所以这个函数将有助于: jQuery.fn.center = function () { th ...
- css div上下左右居中
相信大家都会遇到这样的问题,要求一个块上下左右居中,在这里我总结了几个好用的方法 1.已知要居中的块width height 假设 content 要在f里上下左右居中 <div class= ...
- div css 伪类 不固定图片大小 居中, css div 实现三角形
div css 伪类 不固定图片大小 居中 <style> .pic_box{width:300px; height:300px; background-color:#beceeb; fo ...
- css div居中显示的4种写法
Demo:http://www.feman.cn/h5/center.html .absolute 绝对定位 这是我们最常用的一种居中定位写法 要求必须确定div的宽高度 目前市面上的浏览器基本上都支 ...
- 单个div充满屏幕的CSS方法
1.通过定位实现 <style> *{ margin: 0; padding: 0; } div{ width:100%; height: 100%; background: yellow ...
- css div图片上下左右居中
<style type="text/css"> div{border:1px solid #ccc;height:500pc;width:500px;text-alig ...
随机推荐
- 4.html基础标签:表单
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 【安全狗SRC】抗D设备哪家强?你来!大佬告诉你答案
上周,安全狗SRC联合SRC部落,携手推出了爆款话题:传统抗D设备 vs 新兴CDN抗D:抗D效果哪个好? 一经发布简直好评如潮,热评无数,四方雷动(?)原帖在此,错过的吃瓜表哥们可以再围观一下~ht ...
- MySQL 数据类型说明解释
在 MySQL 中,有三种主要的类型:Text(文本).Number(数字)和 Date/Time(日期/时间)类型. Text 类型: 数据类型 描述 CHAR(size) 保存固定长度的字符串(可 ...
- Maven - 实例-5-依赖冲突
避免依赖冲突的原则 如果项目中的pom.xml没有指定依赖的信息,而是通过继承来引用依赖,则很有可能发生继承同一个依赖的多个版本,从而产生依赖冲突. Maven通过如下两个原则来避免依赖冲突: 1- ...
- postgresql 唯一约束增强
http://blog.chinaunix.net/uid-15145533-id-2775821.html
- Google Optimization Tools实现加工车间任务规划【Python版】
上一篇介绍了<使用.NET Core与Google Optimization Tools实现加工车间任务规划>,这次将Google官方文档python实现的版本的完整源码献出来,以满足喜爱 ...
- CentOS 6.5 网络服务器功能的实现②:运用光盘(镜像)制作一个本地yum源
在用Linux安装软件时(rpm安装方式),有时会出现“包依赖”的现象.因此,我们可以用yum工具来实现一次性安装所有rpm工具包的功能. 实例:在此服务器上用yum的方式安装DHCP服务和TFTP服 ...
- solr单机部署tomcat
所需软件:solr4.8.1.Tomcat7 下载完相应软件后开始单机部署(windows下) 在F盘根目录创建solr文件夹,并解压solr4.8和tomcat7到该文件夹 在F盘根目录创建solr ...
- JDK源码分析之hashmap就这么简单理解
一.HashMap概述 HashMap是基于哈希表的Map接口实现,此实现提供所有可选的映射操作,并允许使用null值和null键.HashMap与HashTable的作用大致相同,但是它不是线程安全 ...
- Kafka实战解惑
目录 一. kafka简介二. Kafka架构方案三. Kafka安装四. Kafka Client API 4.1 Producers API 4.2 Consumers API 4.3 消息高可靠 ...