CSS 如何设置垂直居中

1、水平居中我们都知道,可以直接用:

margin:0 auto;


2、垂直居中,需要做一点小小的计算,关键代码如下:

height: 600px;

position: absolute;

top: 50%;

margin-top:-300px;


如需水平且垂直居中:

height: 600px;

width: 400px;

position: absolute;

top: 50%;

left: 50%;

margin:-300px 0 0 -200px; 


注:首先,position必须要绝对定位;然后,宽高必须设置值;最后,left/top为50%,margin-top为高度的一半,margin-left为宽度的一半



转载于:https://www.cnblogs.com/fifteen718/p/9533902.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/253082.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

被称为海淀妈妈四大神器之一的倾听者K3 硬件拆解

暑假期间发现很多博主都在推荐倾听者K3,被海淀妈妈们称为四大神器之一, 虽然暂没听说其他三大神器是什么,作为教育硬件爱好者还是决定先整个回来拆拆看。 在京东上搜到倾听者K3版本一共有三种颜色,分别是蓝色(悟空蓝&…

有名信号量sem_open和内存信号量sem_init创建信号量的区别

有名信号量sem_open和内存信号量sem_init创建信号量的区别 分类: C/C sem_t *sem sem_open(const char *name, int oflag, .../*mode_t mode,unsinged int value) ;int sem_init(sem_t *sem,int shared, unsigned int value);区别:1.创建有名信号量必须…

KVM虚拟机相关步骤

KVM是Kernel-based Virtual Machine的简称,是一个开源的虚拟化模块,该文档是基于CentOS 7.4环境操作的 一、操作系统安装 本文采用的是CentOS 7.4 1、查看系统版本 cat /etc/redhat-release 2、系统更新 Yum makecache &&yum update && …

dds设计信号发生器

高一 150206101 Dds数字信号发生器设计方案 DDS的工作原理框图如下 在微机内,若插入一块D/A转换卡,然后编制一段小程序,如连续进行加一运算到一定值,然后连续进行减一 运算回到原值,在反复运行该程序,则微机…

Maven--资源文件resource的问题

2019独角兽企业重金招聘Python工程师标准>>> Maven项目的目录有: src/java/main src/java/resource src/test/main src/test/resource 有的时候在resource目录下添加文件却不能加载出来,解决的办法是从把添加的资源文件添加到properties---&g…

pthread_create()创建线程最大个数

线程应用程序最常见导致创建线程失败的原因是线程栈大小的设置。创建一个新的线程,默认情况下系统为线程栈预留了2MB的寻址空间。线程栈起始于进程虚拟 内存的高端地址,并向虚拟内存底端地址方向扩展。取决于线程本身的大小以及其它线程内存分配的情况&a…

C++ Primer 5 CH4 表达式

4.1 基础 函数调用也是一种特殊的运算符,它对运算对象的数量没有限制。C 的表达式要么是左值,要么是右值。左值可以位于赋值语句的左边,右值则不可以。当一个对象被用作右值的时候,用的是对象的值;当对象被用作左值的时…

PHY以太网自动协商原理

自协商原理:自协商是通过一种叫做快速连接脉冲(Fast Link Pulse)的信号实现的,简称FLP。自协商的双方通过FLP来交换数据。 在具备自协商能力的端口没有Link的情况下,端口一直发送FLP,在FLP中包含着…

canvas--初级

摘要: canvas:默认宽高为300*150,需用canvas的API定义其宽高绘画路径以beginPath()开始,以closePath()结束常用方法fill()、stroke()、rect()、arc()、text()、lineTo()、moveTo()以下为代码: var cdocument.getElementById("mycanvas&q…

扑克牌翻牌问题(递归)

扑克牌翻牌问题 题目描述: 有52张牌,使它们全部正面朝上,从第2张开始,凡是2的倍数位置上的牌翻成正面朝下;接着从第3张牌开始,凡是3的倍数位置上的牌,正面朝上的翻成正面朝下,正面朝下的翻成正面…

以太网自动协商原理

自协商基本原理 自动协商模式是端口根据另一端设备的连接速度和双工模式,自动把它的速度调节到最高的公共水平,即线路两端能具有的最快速度和双工模式。 自协商功能允许一个网络设备能够将自己所支持的工作模式信息传达给网络上的对端,并接受…

Python学习-文件的调用-读取

1.文件的打开 open(filename[,mode[,buffering]]) #这个一定要记得关文件。close.() filename,要以路径的形式展示,比如在"c:\"中,则要这样写: rc:\filename 如果不用路径展示,那就用filename.其会在执行文件所在的文件夹进行搜索…

javascript . 05 json的组成、for...in 遍历对象、简单数据类型与复杂数据类型的传值与传址、内置对象...

对象字面量 JSON var obj { aaa :999};   var json{"aaa":999,“bbb”:888}; ”kay“:value 对象字面2⃣️定义方法和json很像,只有一点不同,json的key 必须加“”   ; 对象,数…

nohup命令

nohup命令 起因 ssh到机器上,然后执行某个程序,再登录发现程序早就不运行了。 原因 ssh过去之后,执行的大部分命令(守护进程不会断开),都是ssh进程的子进程,ssh断开,命令自然会中断 …

mac与phy如何实现网络自适应

这两天修改网卡驱动以实现10/100/1000M自适应,因此研究了下phy芯片和emac驱动如何兼容10/100/1000M网络环境,记录在此。 网络中设备端数据链路层由mac芯片和phy芯片组成,phy芯片根据外部网络环境完成自动协商以及配置,驱动中根据p…

asp.net(mvc) 框架

1、NFine mvcef 2、Grove orm架构 3、NHibernate orm 4、NBear 5、petshop 6、Membership 7、Brnshop 网上商城 8、cms快速开发:http://www.open-open.com/news/view/a90f1 9、c#开源框架:http://www.cnblogs.com/gaoyuchuanIT/articles/5612268.html 来…

LVM逻辑卷详解及创建

我们先来看一下这张图片:PV: 底层的一个硬盘设备,可以是一个分区,也可能是一个RAID。我们可以把这个块设备创建成一个物理卷格式,即一个PV。VG: 将一个或多个PV提供的存储空间在一个更低的单位上划分成一个个独立的存储单元&#…

python文件操作总结

python中对文件、文件夹(文件操作函数)的操作需要涉及到os模块和shutil模块。 得到当前工作目录,即当前Python脚本工作的目录路径: os.getcwd() 返回指定目录下的所有文件和目录名:os.listdir() 函数用来删除一个文件:os.remove() 删除多个目…

Fread 和fwrite的参数不同,返回值不同

函数fwrite 功能C语言函数,向文件写入一个数据块 。size_t fwrite(const void* buffer, size_t size, size_t count, FILE* stream);注意:这个函数以二进制形式对文件进行操作,不局限于文本文件返回值:返回实际写入的数据块数目&…

课程简介及算法分析

先学课程 -概率论 运行时间(running time) - 输入(eg 已经排序) - 输入规模(6和6*10^9) 各种各样的分析: - 最坏情况分析(worst case)usually T(n) max time when inp…