从右到左显示列表元素



我想从右到左排列显示的列表元素,

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head>

</head>
<body>
<div class="row">
<div class="col-sm-6">
<ul>
<li>Javasript
<ul>
<li>DOM</li>
<li>BOM</li>
<li>Global Objects</li>
</ul>
</li>
<li>jQuery</li>
<li>CSS</li>
<li>HTML</li>
</ul>
</div>
</div>
<script>
</script>
</body>
</html>

我试图将class="pull-right"添加到ul元素中,但发现它们完全对齐,没有格式化。

我应该一个接一个地调整李的填充物吗?

我希望它显示为

- Javascript
- DOM
- BOM
- jQuery

试试这个CSS代码:

ul{
direction: rtl;
}

您忘记在文件中添加引导css cdn。你可以从这里获得引导css。

然后您可以使用引导程序网格。引导程序中有行类。它有12列。单击此处了解网格概念。

将CCD_ 2替换为CCD_。类似地,CCD_ 4被CCD_ 5取代。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
</head>
<body>
<div class="row">
<div class="col-sm-4"></div>
<div class="col-sm-4">
<ul>
<li>Javasript
<ul>
<li>DOM</li>
<li>BOM</li>
<li>Global Objects</li>
</ul>
</li>
<li>jQuery</li>
<li>CSS</li>
<li>HTML</li>
</ul>
</div>
<div class="col-sm-4"></div>
</div>
<script>
</script>
</body>
</html>

更新:-根据您的问题输出进行更新。在这种情况下,可能会出现多种解决方案。其中一个解决方案是您可以使用网格概念,正如我上面提到的。在我更新代码时,确定要在其中显示内容的列。除此之外,您还可以使用align-item以及引导程序。除此之外,您还可以使用justify-content-center链接。

最新更新