<template> <div class="auxiliary"> <ul> <li> <div class="list-box"> <div class="label">货币类型:</div> <div class="value">产品123asdasd1231啊实打实大苏打阿三大熬是的</div> </div> <div class="list-box"> <div class="label">货币类型:</div> <div class="value">产品</div> </div> <div class="list-box"> <div class="label">货币类型:</div> <div class="value">产品</div> </div> <div class="list-box"> <div class="label">货币类型:</div> <div class="value">产品</div> </div> </li> <li> <div class="list-box"> <div class="label">货币类型:</div> <div class="value">产品123asdasd1231啊实打实大苏打阿三大熬是的</div> </div> <div class="list-box"> <div class="label">货币类型:</div> <div class="value">产品</div> </div> <div class="list-box"> <div class="label">货币类型:</div> <div class="value">产品</div> </div> <div class="list-box"> <div class="label">货币类型:</div> <div class="value">产品</div> </div> </li> <li> <div class="list-box"> <div class="label">货币类型:</div> <div class="value">产品123asdasd1231啊实打实大苏打阿三大熬是的</div> </div> <div class="list-box"> <div class="label">货币类型:</div> <div class="value">产品</div> </div> <div class="list-box"> <div class="label">货币类型:</div> <div class="value">产品</div> </div> <div class="list-box"> <div class="label">货币类型:</div> <div class="value">产品</div> </div> </li> </ul> </div> </template> <style lang="scss"> .auxiliary{ ul{ padding: 0; margin: 0; li{ list-style:none; padding: 15px 15px; background: #f1f1f1; overflow: hidden; margin-bottom: 10px; .list-box{ float: left; width: 50%; padding:0 5px; box-sizing: border-box; .label{ width: 70px; text-align: right; color: #666; font-size: 14px; float: left; line-height: 30px; } .value{ flex: 1; float: left; font-size: 14px; line-height: 30px; color: #333; width: calc(100% - 70px); } } } } } </style>