Community Learn Tools Library Leisure
search
English
Home > Web Front-end > HTML Tutorial > CSS 实现垂直居中的几种方案

CSS 实现垂直居中的几种方案

WBOY
Release： 2016-06-16 08:39:28
Original
1729 people have browsed it

最近在学关系型数据库相关，MySQL 和 Postgre,捎带着学了 PHP，为了练手这几天就忙着自己搭博客，项目部署在某云上，该云算是良心，给的空间自己搭博客用足够了。本来想着每日一bo的,所以有的时候实在来不及就只能隔天更新了。以后尽量发点东西出来，等博客搭完写一写 SQL 数据库基础相关的分享，给跟我一样的小白道友们做下参考，大神请直接无视~

说到居中，很多人第一反应应该是水平居中，说到水平居中，肯定道友们有一万种方法做到，CSS3 的FlexBox更是强大到没朋友。但是良辰今天想聊的是 CSS 垂直居中的方法，下面是萌萌的分割线。神马？你敢说不萌？

 

  • 方式一 ：table 布局方法
    • 直接上
Related labels：
CSS 实现垂直居中的几种方案
source：php.cn
Previous article：css实现两端对齐~ Next article：css的四种隐藏方式
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
Make sure the table cell's container fills the entire height of the parent I'm trying to vertically align the content without using Flexbox, because there are some i...
From 2024-04-04 16:03:18
0
1
404
My CSS stylesheet no longer works/links to my HTML file - what could be the reason? I've searched many forums for answers and looked at about 50 google links but haven't foun...
From 2024-04-03 09:49:45
0
1
402
Convert neo4j query results to graphjson like nodes and links in nodejs I have been using neo4j-driver in node-app to retrieve neo4j query results. I want to get ...
From 2024-04-02 18:29:29
0
1
341
How to make an image appear in the center of the header? First of all, my code is based on 3 files, an HTML, a CSS and a JS. It should be noted tha...
From 2024-04-01 23:49:58
0
1
372
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template