flex布局实现div的水平垂直居中

flex布局实现div的水平垂直居中代码如下:<divclass="outerContainer"><divclass="innerContent"></div></div>.outerContainer{width:100%;height:100%;background:#eee;display:flex;jus…

大家好,又见面了,我是你们的朋友全栈君。

代码如下:

<div class="outerContainer">
    <div class="innerContent"></div>
</div>
.outerContainer{ 
   
    width:100%;
    height:100%;
    background:#eee;
    display:flex;
    justify-content: center;
    align-items: center;
}
.innerContent{ 
   
    width:300px;
    height:300px;
    background: #fff;
    border:1px solid #ccc;
}

效果图:

在这里插入图片描述

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/143096.html原文链接:https://javaforall.net

(0)
上一篇 2022年5月22日 上午11:00
下一篇 2022年5月22日 上午11:00


相关推荐

  • 微信自动回复机器人使用教程[通俗易懂]

    微信自动回复机器人使用教程[通俗易懂]第一步,打开软件,选择关键词回复一栏第二步:单击鼠标右键选择添加一个词,设置好关键词,回复词,选择回复到哪个微信群即可。第三步:测试一下效果第四步:操作就是这么简单,效果很明显。完美通过…

    2022年10月1日
    4
  • 一文弄懂什么是Precision,Recall,F1score,以及accuracy[通俗易懂]

    一文弄懂什么是Precision,Recall,F1score,以及accuracy[通俗易懂]近期在做实验的时候一直出现Precision,Recall,F1score,以及accuracy这几个概念,为了防止混淆,在这里写下学习笔记,方便以后复习。以一个二分类问题为例,样本有正负两个类别。那么模型预测的结果和真实标签的组合就有4种:TP,FP,FN,TN,如下图所示。TP实际为正样本你预测为正样本,FN实际为正样本你预测为负样本,FP实际为负样本你预测为正样本,TN实际为负样本…

    2022年10月14日
    3
  • LDAP协议 学习

    LDAP协议 学习LDAP 简介 LDAP LightDirecto 是基于 X 500 标准的轻量级目录访问协议 LDAP 协议之前有一个 X 500DAP 协议规范 该协议什么复杂 是一个重量级的协议 后来对 X 500 进行了简化 诞生了 LDAP 协议 与 X 500 相比变得较为轻量 其实 LDAP 协议依然复杂 LDAP 约定了 Client Server 之间的信息交换格式 使用的端口号 认证方式等内容 而 LDAP 协议的实现 有着众多版本 例如微软的 ActiveDirect 是 LDAP 在 W

    2026年3月17日
    2
  • MySQL 日期格式时间戳转换函数

    MySQL 日期格式时间戳转换函数简介方便查看函数功能,特摘录在此。平时比较常用的时间、字符串、时间戳之间的互相转换,虽然常用但是几乎每次使用时候都喜欢去搜索一下用法;本文将作为一个笔记,整理一下三者之间的转换(即:date转字符串、date转时间戳、字符串转date、字符串转时间戳、时间戳转date,时间戳转字符串)用法,方便日后查看;涉及的函数date_format(date,format)函数,MySQ…

    2022年6月21日
    49
  • HSRP配置

    HSRP配置HSRP 配置问题在企业网络到外部的连接方案中 要求不高的条件下可以是单出口 一旦该出口线路出现问题 整个企业网络就不能连接到外网了 为了使得企业网络到外网连接的高可用性 可以设置两个以上的出口 然而多个出口对于内网主机意味着我个网关 主机不能同时使用多个网关 当主机所使用的网关出现故障时 它不能实现网关的自动切换 1 配置热备份路由协议方案在出口设备上配置热备份路由协议 HSRP 组成

    2026年3月17日
    2
  • 百度一口气开源 10 个模型 | 我们深入解读了这份开源技术报告

    百度一口气开源 10 个模型 | 我们深入解读了这份开源技术报告

    2026年3月12日
    1

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号