Bootstrap5笔记(4)
墙裂建议订阅一下Bootstrap5官方教程源地址:https://fishc.com.cn/thread-229784-1-1.html
代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bootstrap5(4)</title>
<link rel="stylesheet" href="css/bootstrap.css">
</head>
<body>
<p>据统计,大多数鱼油的行踪主要包括在:</p>
<ol class="list-unstyled">
<li>https://www.fishc.com.cn</li>
<li>https://www.bilibili.com</li>
<ul class="list-inline">
<p>总结</p>
<ol class="list-inline-item">list-unstyled 可以去除序号</ol>
<ol class="list-inline-item">list-inline 可以把内容放进一行里</ol>
</ul>
</ol>
<ol class="list-unstyled">
<li><ul>
<li>list-unstyled 的另一种情况,不仅可以对 ol 设置</li>
<li class="list-unstyled">而且也可以单独对 li 设置</li>
<li>不对呀,我2捏</li>
</ul></li>
</ol>
<script src="js/bootstrap.js"></script>
</body>
</html>
说明:
list-unstyled 可以作用于 ul、ol 和 li
如果对 li 的话,就是针对这个 li,不过 li 的里面就不会受到影响
换句话说你要是再套一个的话,内层会安然无恙
再说说 list-inline
list-inline 应作用于 ul、ol
并且给 li 一个 list-inline-item
这样 li 就会变成横排的~ {:7_146:} 加油~~ 不二如是 发表于 2023-6-27 09:30
加油~~
那个第五篇我是真感觉到做出来有点难…… 谢谢
页:
[1]