使用flex垂直居中(超简单)

使用flex垂直居中(超简单)flex+margin垂直居中-加粗样式在父级中使用flex,在子级中使用margin:autobody中的代码<body> <divclass=”a”> <divclass=”b”></div> </div></body>css样式.a{ width:500px; height:500px; border:1pxsolidblue; display:flex;}.b{

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

flex+margin垂直居中

加粗样式 在父级中使用flex,在子级中使用margin:auto

body中的代码

<body>
	<div class="a">
		<div class="b"></div>
	</div>
</body>

css样式

.a{
	 width: 500px;
	 height: 500px;
	 border: 1px solid blue;
	 display: flex;
 }
.b{
	 width: 300px;
	 height: 300px;
	 background: red;
	 margin:auto;
 }
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

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

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • epp和edr_一文读懂分频器

    epp和edr_一文读懂分频器一文读懂什么是EPP、EDR、CWPP、HIDS及业内主流产品当前终端安全概念包括:针对云工作负载保护平台cwpp、端点防护平台epp和终端全检测响应平台edr。HIDS品类(长亭牧云、青藤万相)更倾向于CWPP的落地产品。1、EPP与EDR如果通俗的讲可以理解成传统防病毒和下一代防病毒软件(其实EPP之前的阶段才是传统杀毒),但实际上EDR是个方案,深信服EDR、奇安信天擎、安恒明御对外宣传都是EDR产品,从产品能力严谨来讲,这些产品属于EPP+EDR的方案结合产物,其中EPP解决…

    2022年10月22日
    0
  • 电磁兼容实验室「建议收藏」

    电磁兼容实验室「建议收藏」南京信息工程大学电磁兼容实验室南京信息工程大学电子与信息工程学院[1]电磁兼容实验室依托“江苏省传感网与现代气象装备”优势学科,‘江苏省信息与通信工程’优势学科,“江苏省气象探测与信号处理重点实验室”,“江苏省气象传感网技术工程中心”,成立于2012年10月[2]。电磁兼容暗室设计频率范围:10kHz-18GHz;暗室经过203所验收合格。可以满足国军标151A/151B-2013军标9项测试标准,民标多项测试,具体测试项目如下:GJB151B测试项目:25Hz~10kHz电源线传导发…

    2025年7月26日
    1
  • python——循环(for循环、while循环)及练习

    python——循环(for循环、while循环)及练习目标程序的三大流程1.while循环的基本使用 2.break和continue 3.while循环嵌套在程序开发中,一共有三种流程方式:顺序:从上向下,顺序执行代码 分支:根据条件判断,决定执行代码的分支 循环:让特定代码重复执行(解决程序员重复工作)一、for循环1、基本用法for循环使用的语法:“”"for变量inrange(10):循环…

    2022年8月12日
    6
  • 一些常用的find命令

    一些常用的find命令

    2021年5月2日
    154
  • VMware虚拟机安装Ubuntu系统步骤详解

    VMware虚拟机安装Ubuntu系统步骤详解Ubuntu系统介绍VMware安装Ubuntu步骤一.Ubuntu系统的下载二.VMwareworkstation的下载安装三.配置Ubuntu虚拟机系统VMware安装Ubuntu系统Ubuntu系统介绍Ubuntu是一个以桌面应用为主的Linux操作系统。作为Linux发行版中的后起之秀,UbuntuLinux在短短几年时间里就成长为从L…

    2022年4月12日
    38
  • DIV ID用途_纸的用途

    DIV ID用途_纸的用途我是超级链接这个例子是一个很简单的超级链接。用到了DIV,实际上DIV就相当于一个肉眼看不到盒子,盒子里边可以放入很多的文字、图片、flash等等。而盒子里边内容的样式,就全部靠DIV的id所对应的

    2022年8月1日
    5

发表回复

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

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