Question

我想横向this list。

使用 list-inline ，我会将列表设置为水平，但不会设置<li>的样式。我想在li元素上添加一个类，但不知道代码的哪个位置我可以添加样式。

<ul class="list-inline">
      <?php
        $cat_args['title_li'] = '';
        wp_list_categories(apply_filters('', $cat_args));?>
</ul>

Answer 1

您可以使用getbootstrap网格水平显示项目

http://getbootstrap.com/css/#grid

或者您可以尝试使用form-inline水平显示项目

http://getbootstrap.com/css/#forms-inline

希望这能帮到你

Answer 2

您可以使用 Flexbox 在CSS中设置样式。无需使用.list-inline。

看看下面的代码：

＆＃13;

ul {
  display: flex;
}

ul li {
  border-radius: 0 !important;
  border-right: none !important;
}

ul li:last-child {
  border-right: 1px solid #ddd !important;
}

body {
  padding: 20px;
}

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<ul class="list-group">
	<li class="list-group-item">Cras justo odio</li>
	<li class="list-group-item">Dapibus ac facilisis in</li>
	<li class="list-group-item">Morbi leo risus</li>
	<li class="list-group-item">Porta ac consectetur ac</li>
	<li class="list-group-item">Vestibulum at eros</li>
</ul>

＆＃13;

希望这有帮助！

如何在php代码中设置列表<li>内联样式？

2 个答案: