主页 / user-23030758

hanzoera's questions

Martin Hope
hanzoera
Asked: 2024-11-17 05:01:04 +0800 CST
  • 6

在此处输入图片描述

基本上，我唯一剩下的问题就是标题旁边的行的高度自动调整。我用 div flex 包含了垂直线和标题，但我不确定结构本身是否正确或是否是我情况的理想解决方案。

这是我所做的：

.post-title {
  font-weight: 700;
}

.vertical-line {
  height: /* (Main Issue Here) */;
  width: 10px;
  background-color: #007bff;
  margin-right: 1rem;
}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

<div class="post-title-container d-flex align-items-center">
  <div class="vertical-line"></div>
  <h1 class="post-title">
    Lorem ipsum dolor sit amet consectetur adipisicing
  </h1>
</div>

html