css在盒子中垂直居中和固定居中
顶部固定居中
<div class="w960 fixed">
我是固定的
</div> .w960{
width: 960px;
margin:0 auto;
}
.fixed{
position: absolute;
top:0;
left: 0;
right: 0;
height: 90px;
background: #ececec;
}
垂直居中
<div id="box">
<div class="son">ssss</div>
</div> #box {
width: 600px;
height: 500px;
position: relative;
border: 1px solid #f00;
}
.son {
width: 100px;
height: 100px;
border: 1px solid #ecc;
position: absolute;
left: 50%;
margin-left: -50px;
top: 50%;
margin-top: -50px;
}
css在盒子中垂直居中和固定居中的更多相关文章
- div垂直居中 css div盒子上下垂直居中
div垂直居中 css div盒子上下垂直居中,让DIV盒子在任何浏览器中任何分辨率的显示屏浏览器中处于水平居中和上下垂直居中. div垂直居中常用于单个盒子,如一个页面里只有一个登录布局,使用div ...
- CSS 实现盒子水平居中、垂直居中和水平垂直居中的方法
CSS 实现盒子模型水平居中 水平居中效果图如下: HTML: CSS 全局样式: 方法一:使用margin: 0 auto;(只适用于子盒子有宽的时候) 方法二:text-align + disp ...
- 【转】CSS中怎么让DIV居中
来源:http://www.cnblogs.com/DebugLZQ/archive/2011/08/09/2132381.html CSS 如何使DIV层水平居中 今天用CSS碰到个很棘手的 ...
- CSS中怎么让DIV居中(转载)
CSS 如何使DIV层水平居中 今天用CSS碰到个很棘手的问题,DIV本身没有定义自己居中的属性, 网上很多的方法都是介绍用上级的text-align: center然后嵌套一层DIV来解决问题. 可 ...
- CSS中怎么让DIV居中
CSS 如何使DIV层水平居中 今天用CSS碰到个很棘手的问题,DIV本身没有定义自己居中的属性, 网上很多的方法都是介绍用上级的text-align: center然后嵌套一层DIV来解决问题. 可 ...
- 通过CSS控制页面中的内容垂直居中的方法
方法一:通过行高(line-height)定位 line-height通常是用于调节一段文字的行与行之间的距离,或者说两行文字之间的距离,如果行高是500px,那么每一行中的文字距离本行的顶部就是25 ...
- 利用css来让一个div在页面中垂直居中的方法
一.如何让一个div在页面中垂直居中(请至少列出三种) 1.距离页面窗口左边框和上边框的距离设置为50%,这个50%就是指页面窗口的宽度和高度的50%,最后将该DIV分别左移和上移,左移和上移的大小就 ...
- CSS总结div中的内容垂直居中的五种方法
一.行高(line-height)法 如果要垂直居中的只有一行或几个文字,那它的制作最为简单,只要让文字的行高和容器的高度相同即可,比如: p { height:30px; line-height:3 ...
- CSS(九):设置盒子水平垂直居中
通过设置下面的样式可以使盒子水平垂直居中: <!DOCTYPE html> <html lang="en"> <head> <meta c ...
随机推荐
- 网卡bond技术
概览: 目前网卡绑定mode共有七种(0~6)bond0.bond1.bond2.bond3.bond4.bond5.bond6 常用的有三种: mode=0:平衡负载模式,有自动备援,但需要&quo ...
- Win10下通过IIS调试ASP程序遇到的问题和解决方案
最近维护了以前别人的写的一个ASP的系统,记录一下调试过程中的问题和解决方案. 环境篇 万维网发布服务(W3SVC)已经停止 问题: 万维网发布服务(W3SVC)已经停止.除非万维网发布服务(W3SV ...
- cmd中控制某个命令执行多少次
for /l %i in (1,1,5) do calc五次启动计算器程序for /l %i in (start ,step,end) do commandfor /l 表示从数字start开始,以s ...
- LINUX打开文件
body, table{font-family: 微软雅黑; font-size: 10pt} table{border-collapse: collapse; border: solid gray; ...
- Yii框架里用grid.CGridView调用pager扩展不显示最后一页按钮的解决
有如下一例,调用zii.widgets.grid.CGridView显示Blog信息,代码如下: $this->widget('zii.widgets.grid.CGridView', arra ...
- Go笔记-map
[概念] 1- map 是引用类型的 2- 声明方式 var map1 map[keytype]valuetype 例如:var map1 ma ...
- BZOJ 2653: middle [主席树 中位数]
传送门 题意: 一个长度为n的序列a,设其排过序之后为b,其中位数定义为b[n/2],其中a,b从0开始标号,除法取下整.给你一个 长度为n的序列s.回答Q个这样的询问:s的左端点在[a,b]之间,右 ...
- Hive metastore表结构设计分析
今天总结下,Hive metastore的结构设计.什么是metadata呢,对于它的描述,可以理解为数据的数据,主要是描述数据的属性的信息.它是用来支持如存储位置.历史数据.资源查找.文件记录等功能 ...
- IBM优质资源
springBoot介绍与Demo: https://www.ibm.com/developerworks/cn/java/j-spring-boot-basics-perry/index.html ...
- nginx的location优先级
在nginx配置文件中,location主要有这几种形式: 1. 正则匹配 location ~ /abc { } 2. 不区分大小写的正则匹配 location ~* /abc { } 3. 匹配路 ...