html - 关于移动端布局问题。

查看:135
本文介绍了html - 关于移动端布局问题。的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

移动端布局,如何等分这灰色的块呢,我想的是大盒子宽度100%;里边设置33.33%;但是效果不好,请问怎么布局效果最佳呢?

解决方案

<style>
*{margin:0;padding:0;}
.main{width:100%;overflow:hidden;}
.main ul{width:102%;}
.main ul li{float:left;border-right:1px solid red;width:33%;text-align:center;height:60px;list-style:none;box-sizing: border-box;}
</style>
<body>
<div class="main">

<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ul>

</div>
</body>

这篇关于html - 关于移动端布局问题。的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆