我正在處理一個 HTML 代碼，我得到了一個 UI。我盡力讓它看起來盡可能接近。但我堅持使用標題和行間距。這是我的代碼。
<div>
Hello, Alice! Here are your appointments for the day:
</div>
<div style="font-style:italic">
**All times are Arizona Time**
</div>
<table style="border:1px solid #e9e9e9">
<thead bgcolor="#8c8c8c" style="border-bottom:1px solid #e9e9e9; padding:none !important">
<tr>
<th style="width:auto">10:00AM - 10:30AM (30 MIN)</th>
<th style="width:auto; float:right">Abc</th>
</tr>
</thead>
<tbody>
<tr>
<td><div style="line-height:2em">
Topic:</div></td>
<td><div>Resume Review</div></td>
</tr>
<tr>
<td><div style="line-height:2em">Phone:</div></td>
<td>1234567890</td>
</tr>
<tr>
<td><div style="line-height:2em">Email:</div></td>
<td>[email protected]</td>
</tr>
<tr>
<td><div style="line-height:2em">Student notes:</div></td>
<td>Hello,
My resume is pretty ugly, I built it based on what I learned in TAPS in military out-processing.
I will be standing by for the phone call, I missed my last one because I mixed up the appointment time zone.</td>
</tr>
</tbody>
</table>注意：我需要使用行內樣式，我不能在我的系統中使用外部 CSS。
這是提供的 [![在此處輸入影像描述][1]][1] UI。請讓我知道如何匹配 UI 并使其回應。
uj5u.com熱心網友回復：
您可以使用div.
檢查下面的代碼。
<div>
Hello, Alice! Here are your appointments for the day:
</div>
<div style="font-style:italic">
**All times are Arizona Time**
</div>
<div style="border: 1px solid black">
<div style="width:100%; background-color:#8c8c8c; height:20px; display:flex;justify-content:space-between;align-items:center">
<p>10:00AM - 10:30AM (30 mins)</p>
<p>Data</p>
</div>
<table>
<tbody>
<tr>
<td>
<div style="line-height:2em">
Topic:</div>
</td>
<td>
<div>Resume Review</div>
</td>
</tr>
<tr>
<td>
<div style="line-height:2em">Phone:</div>
</td>
<td>1234567890</td>
</tr>
<tr>
<td>
<div style="line-height:2em">Email:</div>
</td>
<td>[email protected]</td>
</tr>
<tr>
<td>
<div style="line-height:2em">Student notes:</div>
</td>
<td>Hello, My resume is pretty ugly, I built it based on what I learned in TAPS in military out-processing. I will be standing by for the phone call, I missed my last one because I mixed up the appointment time zone.</td>
</tr>
</tbody>
</table>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/322076.html