css 设置ul里的li 两个一行

你可以使用CSS的flexbox布局来实现这个效果。

首先，给`ul`设置`display: flex;`，然后给`li`设置`flex-basis: 50%;`，这样每行就只能容纳两个`li`。

具体的CSS代码如下：

ul {
  display: flex;
  flex-wrap: wrap;
}

li {
  flex-basis: 50%;
}

相关问题

ul li一行两个显示

你可以使用CSS的float属性来实现一个ul li一行两个显示的效果。具体实现步骤如下：

1. 给ul元素设置宽度，例如800px。
2. 给li元素设置宽度为50%，并且使用float:left属性来让li元素左浮动。
3. 使用clear:both属性来清除浮动，以便父元素能够正确地包含所有子元素。

示例代码如下：

<style>
  ul {
    width: 800px;
    list-style: none;
    margin: 0;
    padding: 0;
  }
  li {
    width: 50%;
    float: left;
  }
  .clear {
    clear: both;
  }
</style>

<ul>
  <li>第一个项目</li>
  <li>第二个项目</li>
  <li class="clear"></li>
  <li>第三个项目</li>
  <li>第四个项目</li>
  <li class="clear"></li>
</ul>

注意，最后一个li元素需要加上class="clear"，以便清除最后一行的浮动。

用HTML和css做一个两行四列的ul li

好的，以下是用 HTML 和 CSS 做一个两行四列的 ul li 的代码：

<ul class="grid">
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
  <li>6</li>
  <li>7</li>
  <li>8</li>
</ul>

.grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 10px;
}

li {
  background-color: #ccc;
  padding: 20px;
  text-align: center;
}

请注意，上面的代码只是一个简单的示例，您可以根据需要进行样式调整。