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

相关推荐

  • 外键约束

    外键约束外键作用:1.保证数据的完整性、一致性,更可靠。2.设置外键约束的两个表之间会有父子关系,即字表中外键字段的取值范围取决于父表3.设置外键一定程度上降低了数据库的速度4.字表中外键字段的

    2022年7月2日
  • goland激活码【注册码】

    goland激活码【注册码】,https://javaforall.net/100143.html。详细ieda激活码不妨到全栈程序员必看教程网一起来了解一下吧!

    2022年3月19日
  • c++迭代器的实现_iterator迭代器用法

    c++迭代器的实现_iterator迭代器用法要访问顺序容器和关联容器中的元素,需要通过“迭代器(iterator)”进行。迭代器是一个变量,相当于容器和操纵容器的算法之间的中介。迭代器可以指向容器中的某个元素,通过迭代器就可以读写它指向的元素。从这一点上看,迭代器和指针类似。迭代器按照定义方式分成以下四种。正向迭代器,定义方法如下:容器类名::iterator 迭代器名;常量正向迭代器,定义方法如下:容器类名::cons…

    2022年8月18日
  • onbeforeunload事件_pageload事件何时触发

    onbeforeunload事件_pageload事件何时触发beforeunload事件简介当窗口,文档及其资源即将卸载时,将触发该事件。该文档仍然可见,此时事件仍可取消。如果为returnValueEvent属性分配了一个字符串,则会出现一个对话框,要求用户确认离开该页面(参见下面的示例)。IE浏览器在对话框中显示返回的字符串,但其他浏览器会显示自己的消息。如果未提供任何值,则以静默方式处理事件。注意:为了防止不需要…

    2022年10月22日
  • 【机器学习算法】线性回归算法

    【机器学习算法】线性回归算法文章目录线性回归回归问题回归和分类预测未来机器学习实现预测的流程线性方程权值调整最简单的回归问题——线性回归问题利用线性回归进行预测的极速入门线性回归的算法原理拟合线性回归算法的数学解析1.假设函数的数学表达式解析线性回归回归问题线性方程偏差度量权值更新回归问题两百年前,与达尔文同时代的统计学家高尔顿在研究父代与子代的身高关系时,发现一种“趋中效应”:如果父代身高高于平均值,则子代具有更高概率比他父亲要矮,简单来说就是身高回归平均值。“回归”一词也由此而来。在回归的世界里,万物的发展轨

    2022年8月21日
  • 软件安全之动态链接库的使用 Libzplay 播放音乐「建议收藏」

    实验1动态链接库的使用实验说明Libzplay是遵循GPL协议的开源库,它集成了mp3、flac、ac3、aac、wav等多种音频格式的解码器和编码器,提供了面向C/C++、C#、Delphi等多种编程语言的接口,仅需3行代码(创建播放资源,打开文件,开始播放)便可实现音乐播放功能。实验目的本实验通过Libzplay提供的C语言接口,实现简单的音乐播放器,以此学习DLL的隐式和显式加载方式。实验原理课程第2讲基础知识实验环境Windows

    2022年4月17日

发表回复

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

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