更改 Bootstrap 管理模板

Posted 2023-05-08

【中文标题】更改 Bootstrap 管理模板

【英文标题】：Changing Bootstrap admin template

【发布时间】：2020-12-06 11:07:50

【问题描述】：

如何更改此 Bootstrap 3 管理模板

https://getbootstrap.com/docs/3.3/examples/dashboard/

喜欢这样吗？

很容易移除顶部固定导航栏并将所有内容向上移动 50 像素（在 dashboard.css 中定义）。我觉得困难的是修改带有顶部矩形部分的侧边栏作为徽标。

【问题讨论】：

如果有页面的代码而不是图片就好了。

【参考方案1】：

您可以使用这些 css 添加顶部 ul

top: 0;
position: absolute;
margin-bottom: 10px;
width: 100%;
background-color: aquamarine;

第二个ul 应该有一个margin-top: 30px;。

最后更新.sidebar并添加top: 0;。

把你的文字放在一个li里面，放在你刚刚创建的ul里面。

http://jsfiddle.net/w4k50nbo

【讨论】：

完成，但海蓝宝石矩形的左下方仍有一个填充。将此 <ul style="top: 0; position: absolute; margin-bottom: 10px; width: 100%; background-color: aquamarine;">Export</ul>、margin-top: 30px 添加到第二个 和 style="top: 0" 到侧边栏 。

您应该在 ul 中添加一个 li，然后在该 li 中添加您的文本。没提，觉得很明显，答案编辑了。

更好，但还不像你的。我建议使用内联或单独的css 在您的答案中粘贴完整的侧边栏 以帮助其他 SO 用户。

@abenci 页面外的 css 不会有相同的结果，这里有一个例子 jsfiddle.net/w4k50nbo