来源: 吾推网
发布时间: 2018-04-09
次浏览
屏幕正中间有个元素A
随着屏幕宽度的增加，始终需要满足以下条件：
A元素垂直居中于屏幕中央；
A元素距离屏幕左右边距各10px；
A元素里面的文字”A”的font-size:20px；水平垂直居中;
A元素的高度始终是A元素宽度的50%; ( 如果搞不定可以实现为A元素的高度固定为
200px;)
请用 html及css 实现
html部分：
<div class="txt">A</div>
css部分：
html部分：
<div class="txt">A</div>
css部分：
.txt{
background: red;
position: absolute;
top:0;
left: 10px;
right: 10px;
bottom: 0;
margin:auto;
flex: 1;
text-align: center;
color: #fff;
font-size: 20px;
display: flex;
align-items: center;
justify-content:center;
padding: 25% 0;
height:0;
}