我想做的是在屏幕的左邊，我可以有一個(gè)特定的寬度和高度的列，其中有用戶圖片，就在圖片的用戶名和位置的右邊，在這個(gè)塊下，我會(huì)添加一些標(biāo)題。 問題是當(dāng)我把標(biāo)題放在欄外的時(shí)候！我該怎么用bootstrab解決，讓它有反應(yīng)！ 這是html:

<div class="block">
    <div class="left-part">
      <img src="assets/user.jpeg" alt="User Picture">
    </div>
    <div class="right-part">
      <div class="user-name">user</div>
      <div class="user-status">Operator</div>
    </div>
    <div class="titles">
        <div class="title">
          <i class="fas fa-check-circle"></i>
          Title1
        </div>
        <div class="title">
          <i class="fas fa-check-circle"></i>
          Title2
        </div>
        <div class="title">
          <i class="fas fa-check-circle"></i>
          Title3
        </div>
    </div>
</div>

和SCSS:

.block{
    margin-top: 0%;
    display: flex;
    //align-items: center;
    position: absolute;
    width: 219px;
    height: 599px;
    left: 0px;



  
  .left-part {
    margin-top: 10px;
    margin-right: 14px;
    margin-left: 14px;
  }
  
  .left-part img {
    width: 69 px;
    height: 80px;
   // border-radius: 50%;
   // object-fit: cover;
  }
  
  .right-part {
    margin-top: 10px;
    flex-grow: 1;
    margin-right: 15px;
  }
  
  .user-name {
    font-size: 18px;
    font-weight: bold;
  }
  
  .user-status {
    font-size: 18px;
    margin-top: 5px;
  }
  .title {
    display: flex;
    align-items: center;
    font-size: 14px;
    margin-bottom: 5px;

    i {
      margin-right: 5px;
    }
  }
}

這是我在主頁(yè)中調(diào)用組件的方式:

<div>
    <app-side-bar></app-side-bar>
</div>

如果你使用的是有角度的材質(zhì)，你可以使用名為側(cè)邊導(dǎo)航的材質(zhì)組件。

可以參考的鏈接:https://material.angular.io/components/sidenav/examples