背景:前端用css怎么写出分式结构.很多个分式在同一行.
我写了两种方式:
第一种代码:
<html>
<body>
<style>
ul{
list-style:none;
margin: 0;
padding: 5;
}
.li{
border-bottom: 1px solid black;
width: 10px;
}
</style>
<div style="display: flex;">
<ul>
<li class="li">4</li>
<li>5</li>
</ul>
<ul>
<li class="li">4</li>
<li>5</li>
</ul>
<ul>
<li class="li">4</li>
<li>5</li>
</ul>
</div>
</body>
</html>
效果图:
第二种代码:
<html>
<body>
<style>
ul{
list-style:none;
margin: 0;
padding: 5;
}
.li1{
width:10px;
height:1px;
margin:0px auto;
padding:0px;
background-color:black;
overflow:hidden;
}
</style>
<div style="display: flex;">
<ul>
<li>4</li>
<li class="li1"></li>
<li>5</li>
</ul>
<ul>
<li>4</li>
<li class="li1"></li>
<li>5</li>
</ul>
<ul>
<li>4</li>
<li class="li1"></li>
<li>5</li>
</ul>
</div>
</body>
</html>
效果图:
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。