<!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

     <style>

         .center {

             height: 500px;

             background:#888;

         }

         .center p{

             background: #fafafa;

             position: relative;

             top: 50%;

             transform: translateY(-50%);

         }

     </style>

 </head>

 <body>

     <div class="center">

         <p>

             1、委托代理业务通过客户端发单律师在线报价机制，律师将获得更多案源机会；

             2、客户在线向平台支付律师服务费，并由平台对律师费进行托管；

             3、服务完成或确认线下达成交易后，平台向律师所在律师事务所支付律师费；

             4、律师事务所与律师自行结算律师费。

         </p>

     </div>

 </body>

 </html>

效果如下：

修改文字内容后测试效果：

transform: translateY(-50%) 实现元素垂直居中效果的更多相关文章

  1. 水平居中和transform: translateY(-50%) 实现元素垂直居中效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. CSS(3)实现水平垂直居中效果

    CSS实现水平垂直居中对齐 在CSS中实现水平居中,会比较简单.常见的,如果想实现inline元素或者inline-block元素水平居中,可以在其父级块级元素上设置text-align: cente ...

  3. CSS(3)多种方法实现水平垂直居中效果

    CSS实现水平垂直居中对齐 在CSS中实现水平居中,会比较简单.常见的,如果想实现inline元素或者inline-block元素水平居中,可以在其父级块级元素上设置text-align: cente ...

  4. 黄聪：用 CSS 实现元素垂直居中，有哪些好的方案？

    1.不知道自己高度和父容器高度的情况下, 利用绝对定位只需要以下三行: parentElement{ position:relative; } childElement{ position: abso ...

  5. 浮动元素垂直居中，bootstrap栅格布局垂直居中

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. css元素垂直居中的8中方法

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

  7. DIV块中 元素垂直居中

    1 DIV块中 元素垂直居中 作者:知乎用户链接:https://www.zhihu.com/question/20543196/answer/99429177来源:知乎著作权归作者所有.商业转载请联 ...

  8. 用 CSS 实现元素垂直居中，有哪些好的方案？

    1.不知道自己高度和父容器高度的情况下, 利用绝对定位只需要以下三行: parentElement{ position:relative; } childElement{ position: abso ...

  9. css一个元素垂直居中的6种方法

    方法一: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <titl ...

随机推荐

  1. Controlling z-order using the ZIndex Property

      The Composing a XAML Clip Art Scene posting showed how you could layer multiple drawing objects in ...

  2. python 代码片段2

    #coding=utf-8 # python没有花括号.我们用对齐来代替括号:通常是四个空格(任意数目的空格货tab也都可以) # python 注释用 # # python不需要像其他语言那样需要首 ...

  3. BZOJ3734 : [Ontak2013]Miny

    将所有炸弹按坐标排序 x<-y连边表示x爆炸了y也会爆炸 如果是DAG则直接拓扑排序+DP求出每个点出发能走到的最左端和最右端的点 有环则SCC缩点后再拓扑 用线段树优化建图的过程 边数$O(n ...

  4. 导出一个EXCEL，多个SHEET

    Infragistics.Excel. Workbook work = new Infragistics.Excel.Workbook();                         Infra ...

  5. Centos python 2.6 升级到2.7.3

    wget http://python.org/ftp/python/2.7.3/Python-2.7.3.tar.bz2 sudo make all sudo mak install sudo mak ...

  6. iOS开发项目之四 [ 调整自定义tabbar的位置与加号按钮的位置]

    自定义tabbar与按钮的添加 01 - 把系统的tabbar用我们自己的覆盖 LHQTabBar *lhqTabBar = [[LHQTabBar alloc]init]; [self setVal ...

  7. 【C语言】03-第一个C程序代码分析

    前面我们已经创建了一个C程序,接下来分析一下里面的代码. 项目结构如下: 一.代码分析 打开项目中的main.c文件(C程序的源文件拓展名为.c),可以发现它是第一个C程序中的唯一一个源文件,代码如下 ...

  8. 短语密码(blowfish_secret)的设置

    简单的说,phpmyadmin就是一种mysql的管理工具,安装该工具后,即可以通过web形式直接管理mysql数据,而不需要通过执行系统命令来管理,非常适合对数据库操作命令不熟悉的数据库管理者,下面 ...

  9. 我对Java的java.lang.Class这个类的深入理解

    类是对同一类事物的描述,字段具体的值只有到类实例化时才会指定,静态字段除外.所有的类也是同一类事物,用Class这个类来描述.Class类与String.Person等类是同一个级别的.java的字节 ...

  10. Editplus从下载到使用

    ☆ 准备工作 1,保证浏览器正常上网 2,能下载软件或已经下载到Editplus这个工具. ☆ 下载editplus 在浏览器输入http://www.editplus.com,然后回车.进入edit ...