css注意事项
文章描述：
在不固定高度情况下，高度自适应方式
内边距
box-sizing: border-box;在使用padding没有内边距情况下模型盒子会被撑大
底部对齐
align-self: flex-end;flex布局的时候，模块在底部对齐显示
自适应高度
display: -webkit-box;
列表
html
<div class="item">
<div class="pm-container">
<a>
<div class="pic-wrap"> <img src="img/1.jpg"> </div>
<div class="text-content">
<div class="title">标题</div>
<div class="foot-item"> <span>描述</span> </div>
</div>
</a>
</div>
</div>
css
.pm-container a {
display: -webkit-box;
}.pm-container a {
border-top: 1px solid #f0f0f0;
text-decoration: none;
cursor: pointer;
padding-top: 14px;
padding-bottom: 14px;
align-items: center;
}图片
.pic-wrap {
position: relative;
width: 33.333%;
padding-top: 22.222%;
}文字
.text-content {
-webkit-box-flex: 1;
flex: 1;
margin-left: 14px;
}
发布时间：2022/05/19
发表评论