這是我有疑問(wèn)和我必須做的這是我到目前為止所做的我很難解決這個(gè)問(wèn)題，我懷疑我如何才能在元素之間留出這個(gè)空間，還有這個(gè)用灰色和紅色著色的邊框以及它們兩者之間的垂直線，我只能用純 HTML、CSS 和 JS 來(lái)做到這一點(diǎn)沒(méi)有任何框架/lib/api。我嘗試過(guò)類似的方法，但仍然無(wú)法按我想要的方式工作，如果有人可以提供幫助，我將不勝感激    .table {    display: inline-flex;    margin-top: 0rem;       margin-left: 5rem;         }.fgraphs {    position: relative;    height: 20px;    width: 100px;  }  .fgraphs:before,  .fgraphs:after {    content: "";    position: absolute;    top: 50%;    right: 0;    transform: translateY(-50%);  }  .fgraphs:before {    border-bottom: 2px dashed #979797;    width: 100%;  }  .fgraphs:after {    border-bottom: 3.5px solid #F03D24;    width: 50%;    border-radius: 4px 0 0 4px;  }    <table class="table">            <tbody>                <tr>                    <td>Domingo</td>                    <td>Icone</td>                    <td>54%</td>                    <td><img src="./images/cloudy-day-3.svg" alt=""></td>                    <td>20oC</td>                    <td class="fgraphs"></td>                    <td>32oC</td>                </tr>                <tr>                    <td>Segunda</td>                    <td>Icone</td>                    <td>54%</td>                    <td><img src="./images/cloudy-day-3.svg" alt=""></td>                    <td>20oC</td>                    <td class="fgraphs"></td>                    <td>32oC</td>                </tr>                <tr>                    <td>Ter?a</td>                    <td>Icone</td>                    <td>54%</td>                    <td><img src="./images/cloudy-day-3.svg" alt=""></td>                    <td>20oC</td>                    <td class="fgraphs"></td>                    <td>32oC</td>                </tr>