0
点赞
收藏
分享

微信扫一扫

虚拟机配置桥接模式

624c95384278 2024-06-21 阅读 37

html元素的对齐方式

水平居中

.align{
  left: 0;
  right: 0;
  margin: auto;
}

垂直居中

.align{
  top: 0;
  bottom: 0;
  margin: auto;
}

水平垂直居中

.align{
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

html元素中内容的对齐方式

水平居中

内容水平居中
弹性布局(Flex布局)是一种现代的CSS布局方式,通过使用display: flex属性来创建一个弹性容器,并在其中使用灵活的盒子模型来进行元素的排列和定位。

.align{
  display: flex;
  justify-content: center;
}

垂直居中

内容垂直居中

.align{
  display: flex;
  align-items: center;
}

水平垂直居中

内容水平垂直居中

.align{
  display: flex;
  justify-content: center;
  align-items: center;
}

内容水平垂直居中,并将块级元素(block)转为行内元素(inline),取消元素自动换行

.align{
  display: inline-flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中 */
}
举报

相关推荐

0 条评论