用css怎样使div相对整个页面居中

新建一个html文件,定名为test.html,用于讲解用css如何使div相对整个页面居中。

  • 2

    在test.html文件中,建立一个div,并设置其class属性为dcenter,本家儿要用于下面进行css样式设置。

  • 3

    在test.html文件中,初始化页面所有元素的css样式 ,设置表里边距都为0px。

  • 4

    在css样式中,对类名为dcenter的div进行样式设置。设置div的宽高为200px,布景颜色为红色。

  • 5

    设置div的位置属性为绝对定位(position: absolute),距离页面左边缘为50%,距离页面上边缘为50%。

  • 6

    经由过程上面的css样式设置,只是实现了div左上角的点在页面居中,若想整个div居中,还需要经由过程transform设置div的程度和垂直位置的偏移量为-50%。

  • 7

    在浏览器打开test.html文件,查看div在整个页面居中的结果。

    • 发表于 2019-09-19 17:00
    • 阅读 ( 1941 )
    • 分类:其他类型

    你可能感兴趣的文章

    相关问题

    0 条评论

    请先 登录 后评论
    admin
    admin

    0 篇文章

    作家榜 »

    1. xiaonan123 189 文章
    2. 汤依妹儿 97 文章
    3. luogf229 46 文章
    4. jy02406749 45 文章
    5. 小凡 34 文章
    6. Daisy萌 32 文章
    7. 我的QQ3117863681 24 文章
    8. 华志健 23 文章

    联系我们:uytrv@hotmail.com 问答工具