<!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. hbase0.95.2部署

    hbase0.95.2部署 下载安装包 hbase-0.95.2-cdh5.0.0-beta-1.tar.gz hbase需对应hadoop版本 解压 tar zxvf hbase-0.95.2-cd ...

  2. Hashtable和Dictionary<T,K>的使用

    由于Hashtable内部自带有排序(根据Key的HashCode来进行的),因此有时在使用Hashtable时就会造成数据顺序不可控的情况,有两种办法可以解决, 测试代码: Dictionary&l ...

  3. iPhone开发常问的十个问题

    iPhone开发常问的十个问题 前言 今天去stackoverflow.com上看了一下iPhone标签下排名最高的10个问题,将它们整理出来,希望这些常见问题能帮到一些iPhone开发的初学者.本来 ...

  4. the thread has exited with code -1073741819

    内存分配异常.无效或冲突.指针存在但指向无效内存区域.

  5. hdu Super Jumping

    简单的dp,最优子结构是dp[i],即从0~i来看,是的dp[i]最大,然后找到最大中的最大就可以了, 转移方程是:dp[i]=max{dp[i],dp[j]+value[i]},注意这里有两个判断条 ...

  6. OpenSSL使用方法

    生成CA (勾选Generate Self Signed Certificate)openssl req -nodes -x509 -sha256 -newkey rsa:4096 -keyout & ...

  7. MS14-025引起的问题 - 1

    windows2008有一个叫组策略首选项(Group Policy Preference)的新特性.这个特性可以方便管理员在整个域内部署策略.本文会详细介绍这个组策略首选项的一些缺陷.尤其是当下发的 ...

  8. 各分支Linux的镜像下载地址

    https://openstack.redhat.com/Image_resources   http://fedoraproject.org/en/get-fedora#clouds   https ...

  9. JavaScript的My97Date日期工具类的使用

    开发人员最喜欢的事情就是有工具然后拿来直接使用(. ~ .) 使用截图: 1.设置input标签 2.根据其DEMO文件,引入,进行事件处理 3.效果如图 4.效果如图 代码: <!DOCTYP ...

  10. iOS 用宏定义写一个单例（Singleton）

    用如下方法定义单例 @interface singleton_interface(ClassName); @end 实现单例在 @implemention singleton_implemention ...