div块中高度总是宽度的一半

Posted gaoxuerong123

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了div块中高度总是宽度的一半相关的知识,希望对你有一定的参考价值。

 1 <!doctype html>
 2 <html>
 3 <head>
 4     <style type="text/css">
 5     body {
 6         margin: 0;
 7         padding: 0;
 8     }
 9     .inner {
10         color: aliceblue;
11         height: 0;
12         padding: 25% 0;
13         background-color: coral;
14         display: flex;
15         align-items: center;
16         justify-content: center;
17     }
18     </style>
19 </head>
20 <body>
21     <div class="inner"> A </div>
22 </body>
23 </html>

 

以上是关于div块中高度总是宽度的一半的主要内容,如果未能解决你的问题,请参考以下文章

将 div 的高度设置为宽度的一半

前端面试 CSS— 实现布局:div垂直居中,左右10px,高度始终为宽度一半

css 怎样定义屏幕高度的一半

DIV块中 元素垂直居中

div内容超出宽度时如何隐藏?如何显示省略标记?

Android获取片段中的布局高度和宽度