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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 校验和计算原理_CRC校验原理及代码

    校验和计算原理_CRC校验原理及代码校验和思路首先,IP、ICMP、UDP和TCP报文头都有检验和字段,大小都是16bit,算法基本上也是一样的。在发送数据时,为了计算数据包的检验和。应该按如下步骤:1、把校验和字段设置为0;2、把需要校验的数据看成以16位为单位的数字组成,依次进行二进制反码求和;3、把得到的结果存入校验和字段中在接收数据时,计算数据包的检验和相对简单,按如下步骤:1、把首部看成以16位为单位的数字组成,依次进行二

    2025年7月16日
    7
  • 数据结构之数组和链表的区别

    数据结构之数组和链表的区别第一题便是数据结构中的数组和链表的区别数组(Array)一、数组特点:所谓数组,就是相同数据类型的元素按一定顺序排列的集合;数组的存储区间是连续的,占用内存比较大,故空间复杂的很大。但数组的二分查找时间复杂度小,都是O(1);数组的特点是:查询简单,增加和删除困难;1.1在内存中,数组是一块连续的区域1.2数组需要预留空间在使用前需要提前申请所占内存的大小,…

    2022年6月29日
    18
  • 大数据平台框架、组件以及处理流程详解

    大数据平台框架、组件以及处理流程详解数据产品和数据密不可分作为数据产品经理理解数据从产生、存储到应用的整个流程,以及大数据建设需要采用的技术框架Hadoop是必备的知识清单,以此在搭建数据产品时能够从全局的视角理解从数据到产品化的价值。本篇文章从三个维度:1.大数据的处理流程2.大数据的的平台框架Hadoop3.Hadoop生态圈组件理解了数据从产生到场景应用每个环节的流程过程以及企业在建立大数据平台时需要采用的技术…

    2022年5月23日
    150
  • linux无锁编程[通俗易懂]

    linux无锁编程[通俗易懂]简单的笔记,未完待续一道题:无锁化编程有哪些常见方法?针对计数器,可以使用原子加只有一个生产者和一个消费者,那么就可以做到免锁访问环形缓冲区(RingBuffer)RCU(Read-Copy-Update),新旧副本切换机制,对于旧副本可以采用延迟释放的做法 CAS(Compare-and-Swap),如无锁栈,无锁队列等待解析:一、RCU   

    2022年6月9日
    55
  • Python 二次开发 AutoCAD 简介「建议收藏」

    Python 二次开发 AutoCAD 简介「建议收藏」一、前沿cad是python是ActiveX是pyautocad模块由俄罗斯工程师开发,因参考实例较少,工程需要,现将模块中一些基本的用法,做出简要说明,叙述力求简洁明了,因个人水平有限,文中难免有所疏漏,还请各位大神不吝批评指正。…

    2022年6月5日
    40
  • 用户和文件权限管理

    用户和文件权限管理

    2022年2月21日
    308

发表回复

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

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