总结了几种解决方法 但也不是说除了我说的就没有其他方法了

第一个、利用flex布局

代码：

效果：

第二个、利用transform 的 translate属性

代码：

效果：

第三个、使用伪类::after

代码：

补充第四个 直接利用margin:auto; 鉴定完毕很好用

效果：同上

如果各位大神还有其他的方法

热烈欢迎 下面留言 先替广大莘莘学子谢谢你~

如需转载请注明出处 谢谢~！

纯CSS垂直居中的四种解决方案的更多相关文章

  1. CSS垂直居中的四种方法

    写在前面的话 最近在Stack Overflow上看到 一个不错的回答 ,以下是我对其的总结,分享给大家. 垂直居中的四种方法 ①基础的方法 设置父元素的line-height等于height,这种方 ...

  2. Mybatis多参传递的四种解决方案

    Mybatis多参传递的四种解决方案 代码异常:org.apache.ibatis.binding.BindingException: Parameter 'param' not found. 长时间 ...

  3. HTML5样式和列表、CSS链接的四种状态

    一.HTML5样式 1.标签: <style>:样式定义: <link>:资源引用: 2.属性: type="text/css":引入文档类型: rel=& ...

  4. HTML 引用Css样式的四种方式

    不才,只知道HTML引用CSS样式有四种方式,内部引用和外部引用各两种,因为老是忘记细节,记下了随时翻阅亦可方便如我般的初学者 内部引用方式1: 直接在标签内用 style 引用,如: <div ...

  5. CSS简单的四种引入方式

    CSS一共有四种引入方式 (1)最简单的两种方式是直接在html标签里面引入,或者在html文件前面声明,以下是简单的代码示例 <!DOCTYPE html> <html lang= ...

  6. iOS多线程全套：线程生命周期，多线程的四种解决方案，线程安全问题，GCD的使用，NSOperation的使用

    目的 本文主要是分享iOS多线程的相关内容,为了更系统的讲解,将分为以下7个方面来展开描述. 多线程的基本概念 线程的状态与生命周期 多线程的四种解决方案:pthread,NSThread,GCD,N ...

  7. 直接将字典转为DataFrame格式时，会出现：ValueError: If using all scalar values, you must pass an index（四种解决方案）

    问题:想要将字典直接转为DataFrame格式时,除了字典外没有传入其他参数时,会报错 ValueError: If using all scalar values, you must pass an ...

  8. CSS垂直居中的8种方法

    CSS垂直居中的8种方法 1.通过verticle-align:middle实现CSS垂直居中. 通过vertical-align:middle实现CSS垂直居中是最常使用的方法,但是有一点需要格外注 ...

  9. HTML与CSS结合的四种方式

    HTML与CSS结合的四种方式: 方式一:每个标签加一个属性: 例如:<div style="background-color:red; color: green"> ...

随机推荐

  1. WC2006水管局长（加强）

    倒过来就变成了加边 然后就直接LCT # include <stdio.h> # include <stdlib.h> # include <iostream> # ...

  2. 论文学习：Fully Convolutional Networks for Semantic Segmentation

    发表于2015年这篇<Fully Convolutional Networks for Semantic Segmentation>在图像语义分割领域举足轻重. 1 CNN 与 FCN 通 ...

  3. 【Learning】带花树——一般图最大匹配

    一般图最大匹配--带花树 问题 ​ 给定一个图,求该图的最大匹配.即找到最多的边,使得每个点至多属于一条边. ​ 这个问题的退化版本就是二分图最大匹配. ​ 由于二分图中不存在奇环,偶环对最大匹配并无 ...

  4. Android实时直播，一千行java搞定不依赖jni，延迟0.8至3秒，强悍移动端来袭

    项目首页:https://github.com/ossrs/srs-sea SRS服务器项目:https://github.com/ossrs/srs 一个支持RTMP推流的版本:https://gi ...

  5. VMware Workstation 14 Pro永久激活密钥

    1. ZC3WK-AFXEK-488JP-A7MQX-XL8YF 2. AC5XK-0ZD4H-088HP-9NQZV-ZG2R4 3. ZY5H0-D3Y8K-M89EZ-AYPEG-MYUA8 4 ...

  6. C++ RCSP智能指针简单实现与应用

    智能指针的实现代码来源博客:<http://blog.csdn.net/to_be_better/article/details/53570910> 修改:添加 get()函数,用以获得原 ...

  7. CSS之盒子模型（深入理解）

    CSS--盒子模型(Box Model) 简介: CSS盒子模型本质上是一个盒子,对网页中绝大部分的HTML元素进行包装定位(外边距,边框,内边距以及实际内容). 但是并不是所有的HTML元素都可以看 ...

  8. 常见排序算法及Java实现

    先上个总图↓: ①.直接插入排序 插入排序(Insertion Sort)的算法描述是一种简单直观的排序算法.它的工作原理是通过构建有序序列,对于未排序数据,在已排序序列中从后向前扫描,找到相应位置并 ...

  9. kubernete的证书总结

    服务端保留公钥和私钥,客户端使用root CA认证服务端的公钥. kubernetes的证书类型主要分为3类: serving CA: 用于签署serving证书,该证书用于加密https通信.用于签 ...

  10. 如何给自己的外包APP开发报价？

    作者:CODING 兄弟,你看做这样一个软件需要多少钱?" 这估计是所有软件从业人员被问的最多也是最无奈的一个问题.这个问题等同于,"你看装修一个100平米的房子需要多少钱?&qu ...