簡體   English   中英

增加標題和段落之間的空間

[英]Increase Space between Headings & Paragraphs

如果您在Snippet下運行,則可以看到標題和段落之間有很多空間

在“ 1.訪問端口,控件和傳感器”與“所有情況”之間

但在網站上,其顯示如下圖所示:

在此處輸入圖片說明

所以我想增加“標題和段落”之間的空間。

我也想增加每個單詞之間的空間,我想顯示如下圖所示:

在此處輸入圖片說明

 <div class="product-size-space-img"><img alt="" src="/media/wysiwyg/new-image.jpg" /></div> <div class="product-size-space-content"> <b>1. Access to ports, controls and sensors</b> <p>All cases we sell have access to all ports, buttons, camera and sensors, there won&rsquo;t be any interference with your phone censors. Fully compatible with regular charges and headphones.</p> <b>2. Protect it from bumps and drops</b> <p>This case is made of light, durable and slim material called polycarbonate, it is hard plastic with high impact resistance and low scratch resistance. It is flexible enough to snap on to your phone with ease and strong enough to protect it from&ensp;&ensp; bumps, scratches and accidental drops.</p> <b>3.Lay-flat bezel raise lip </b> <p>Raised lip around the sides of the case protects your screen from directly contacting surfaces on accidents drops.</p> <b>4. High quality printing</b> <p>Site1 name uses image transfer technologies which results high quality designs embedded right onto the surface of the phones cases, so there won&rsquo;t be any peeling off or wearing off or chipping on your case design.</p> </div> <div style="clear: both;">&nbsp;</div> 

刪除margin並在p tag上添加line-height

p {
    line-height: 30px;
    margin: 0;
}

嘗試在下面的代碼中查找標題和段落之間以及每個單詞之間的空間:

 p { line-height: 25px; margin: 15px 0; word-spacing: 5px; } 
 <div class="product-size-space-img"><img alt="" src="/media/wysiwyg/new-image.jpg" /></div> <div class="product-size-space-content"> <b>1. Access to ports, controls and sensors</b> <p>All cases we sell have access to all ports, buttons, camera and sensors, there won&rsquo;t be any interference with your phone censors. Fully compatible with regular charges and headphones.</p> <b>2. Protect it from bumps and drops</b> <p>This case is made of light, durable and slim material called polycarbonate, it is hard plastic with high impact resistance and low scratch resistance. It is flexible enough to snap on to your phone with ease and strong enough to protect it from&ensp;&ensp; bumps, scratches and accidental drops.</p> <b>3.Lay-flat bezel raise lip </b> <p>Raised lip around the sides of the case protects your screen from directly contacting surfaces on accidents drops.</p> <b>4. High quality printing</b> <p>Site1 name uses image transfer technologies which results high quality designs embedded right onto the surface of the phones cases, so there won&rsquo;t be any peeling off or wearing off or chipping on your case design.</p> </div> <div style="clear: both;">&nbsp;</div> 

要增加“標題和段落”之間的空間,可以使用br :)

為了增加每個單詞之間的空間,您必須使用CSS樣式

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM