如何在項目符號清單中實現正確的縮排換行？

在項目符號列表中實現縮減換行

處理換行的冗長項目符號列表項時，需要延續與第一行水平對齊。預設情況下，換行文字出現在項目符號下方，從而形成不對齊的外觀。

要解決此問題，我們可以採用利用額外 div 的方法。

解決方案

1. 將子彈包裹在Div:
   將項目符號放在單獨的
   元素，提供絕對定位並調整其邊距以匹配項目符號的外觀。
2. 將兩個 Div 包裝在容器 Div 中：
   建立一個容器
   儲存項目符號和清單項目文字

   元素。應用必要的樣式來控制填滿和溢出。
3. 對齊清單項目文字：
   在容器內，確保文字
   有適當的填充，使其與項目符號水平對齊。

   程式碼範例

   .row2 {
       padding-left: 20px;
       overflow: hidden;
       max-width: 500px; 
   }
   .red-square-5 {
       position:absolute;
       width:5px;
       height:5px;
       margin-top: 0.5em;
       background:#f00; 
   }

   <div class="container-div">
       <div class="red-square-5"></div>
       <div class="row2">
           Long long long long long long long long long long long 
           long long long long long long long long long long long 
           long long long title
       </div>
   </div>

   透過遵循此方法，項目符號清單將縮排到項目符號右側，與第一行對齊，並提高清單的可讀性和美觀性。