• 技术文章 >web前端 >css教程

    css3怎么让文字垂直居中显示

    VV2020-11-20 09:12:45原创570

    css3让文字垂直居中显示的方法:可以通过使用绝对定位和transform属性来实现,如【position:relative; transform:translate(50%,-50%);】。

    实现思路:

    通过使用绝对定位和transform属性来实现。

    (视频教程推荐:css视频教程

    属性介绍:

    Transform属性应用于元素的2D或3D转换。这个属性允许你将元素旋转,缩放,移动,倾斜等。

    语法:

    transform: none|transform-functions;

    测试代码:

    daefbc1816c3fb9fefbf0dfae9e1baf.png

    说明:

    这种方法非常明显的好处就是不必提前知道被居中的元素的尺寸,因为transform中偏移的百分比就是相对于元素自身的尺寸而言。

    相关推荐:CSS教程

    以上就是css3怎么让文字垂直居中显示的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:css3 文字 垂直居中
    上一篇:css grid布局的优缺点是什么? 下一篇:css中position的定位有哪些
    线上培训班

    相关文章推荐

    • 如何让图片垂直居中显示• html中table表格的内容水平和垂直居中显示• div文字垂直居中的方法有哪些?div文字垂直居中显示的方法介绍• css如何设置元素水平垂直居中显示

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网