格式化引导卡头

Posted 2023-03-21

【中文标题】格式化引导卡头

【英文标题】：Formatting bootstrap card header

【发布时间】：2021-12-22 18:49:42

【问题描述】：

我们正在重建我们的网站，其中一部分是使用引导程序。我的问题与引导卡头 css 选择器有关。

<div class="card-header">This is my header text</div>

我想格式化该标题，以便我可以使标题文本左对齐（默认情况下），但能够添加链接或按钮等。在标题中右对齐。

<div class="card-header">This is my header text     <a href...>some link</a></div>

文本仍然在标题的左侧，但 url 在标题的最右侧。

我知道我可以使用基本的 html 构建一些东西，但我希望有人已经找到了使用引导功能的方法。

谢谢，

【参考方案1】：

通过访问 CSS 样式表，您可以使用 Flex-box 定位它，并为 .card-header 选择器提供填充以不将 URL 定位在最右侧

 .card-header
   display : flex;
   justify-content : space-between;
   align-items : center;
   padding : 20px /*or padding-right : 20px*/