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

    css怎么让div居中

    青灯夜游青灯夜游2021-04-16 13:33:31原创435

    方法:1、在div中使用“position:absolute”和“transform:translate(-50%,-50%)”样式来居中。2、在div中使用“position:absolute”和“margin:auto”样式来居中。

    本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

    方法1:

    div使用绝对定位position:absolute,并且设置left和top的值都为50%。使用css3的transform属性。transform:translate(-50%,-50%)。

    1.jpg

    效果图:

    4.png

    方法2:

    对div使用绝对布局position:absolute;并设置top,left,right,bottom的值相等,但不一定都等于0;并且设置margin:auto。

    2.jpg

    效果图:

    5.png

    (学习视频分享:css视频教程

    以上就是css怎么让div居中的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:css div居中
    上一篇:css如何设置透明 下一篇:css怎么禁止点击事件
    大前端线上培训班

    相关文章推荐

    • css如何实现不换行• css三种样式表写法是什么• css失效的原因是什么• css如何设置自动换行• css如何设置最小宽度

    全部评论我要评论

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

    PHP中文网