我对这张 table 有疑问。我从来没有创建过这样的表。如果有人知道如何创建这种类型的表,如列表?帮帮我吧!请。所有建议表示赞赏。
这是我要使用的小代码:
<html>
<body>
<style>
li{
border:1px solid black;
text-align:center;
}
</style>
<ul style="list-style: none outside none;">
<li style="float: left;display: block;width: 100px;height: 40px;">Field 1</li>
<li style="float: left;display: block;width: 100px;height: 40px;">Field 2</li>
<li style="float: left;display: block;width: 100px;height: 40px;">Field 3</li>
</ul>
</body>
</html>
下图将有助于更好地理解我如何需要输出。
最佳答案
我认为您想将列表转换为表格布局。如果是,请将您的列表覆盖在一个 div 中并提供如下 css:
<div class="table">
<ul>
<li>Field 1</li>
<li>Field 2</li>
<li>Field 3</li>
</ul>
<ul>
<li>Field 1</li>
<li>Field 2</li>
<li>Field 3</li>
</ul>
</div>
CSS
.table {
display:table;
width:100%;
border-top:1px solid #ddd;
border-left:1px solid #ddd;
}
.table ul
{
list-style:none;
margin:0;
padding:0;
display:table-row;
}
.table ul li {
display:table-cell;
text-align:center;
border-bottom:1px solid #ddd;
border-right:1px solid #ddd;
padding:2px 4px;
}
关于html - 尝试使用 html 中的列表元素创建表格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20420530/