【前端CSS】Html元素垂直对齐与水平的对齐的三种方式 您所在的位置:网站首页 表单对齐代码 【前端CSS】Html元素垂直对齐与水平的对齐的三种方式

【前端CSS】Html元素垂直对齐与水平的对齐的三种方式

2024-07-07 02:58| 来源: 网络整理| 查看: 265

使用通配符选择器*,匹配文档中的所有元素,对所有元素应用margin:0和padding:0消除所有元素的内外边距

对div元素应用width:100px;height:100px;background-color:aquamarine;将div元素的设为一个宽度为100px、高度为100px、背景颜色为海蓝色的块级元素

使用position:absolute;将div元素的定位方式设为绝对定位,脱离文档流,使用top:50%;left:50%;将div元素的顶部边界和左侧边界相对于父元素的顶部偏移量和左侧偏移量设置为父元素高度和宽度的50%

使用margin-top:-50px;margin-left:-50px;通过负的上外边距和负的左外边距将div元素向上和向左偏移50px,实现垂直居中和水平居中。



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有