您好,登錄后才能下訂單哦!
本篇內容主要講解“html怎么設置p標簽行間距”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實用性強。下面就讓小編來帶大家學習“html怎么設置p標簽行間距”吧!
html設置p標簽行間距的方法是,給段落文字添加line-height屬性,并且設置合理的行間距數值即可,例如【p.small {line-height:70%;}】,表示設置行間距為當前字體的百分之70。
本文操作環境:windows10系統、html 5、thinkpad t480電腦。
我們要設置p標簽的行間距其實是非常簡單的,因為在css中有一個現成的屬性line-height,這是由于該屬性才讓行間距的設置如此簡單。可能很多同學不太清楚該屬性,下面就讓我們來一起看看該屬性吧。
line-height屬性是用來設置以百分比計的行高的。
該屬性的常用屬性值有如下幾種:
normal 默認。設置合理的行間距。
number 設置數字,此數字會與當前的字體尺寸相乘來設置行間距。
length 設置固定的行間距。
% 基于當前字體尺寸的百分比行間距。
inherit 規定應該從父元素繼承 line-height 屬性的值。
下面我們來一起看看代碼示例:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>億速云(www.php.cn)</title> <style> p.small {line-height:70%;} p.big {line-height:200%;} </style> </head> <body> <p> 這是一個標準行高的段落。<br> 這是一個標準行高的段落。<br> 大多數瀏覽器的默認行高約為110%至120%。<br> </p> <p class="small"> 這是一個更小行高的段落。<br> 這是一個更小行高的段落。<br> 這是一個更小行高的段落。<br> 這是一個更小行高的段落。<br> </p> <p class="big"> 這是一個更大行高的段落。<br> 這是一個更大行高的段落。<br> 這是一個更大行高的段落。<br> 這是一個更大行高的段落。<br> </p> </body> </html>
運行效果如下圖所示:
到此,相信大家對“html怎么設置p標簽行間距”有了更深的了解,不妨來實際操作一番吧!這里是億速云網站,更多相關內容可以進入相關頻道進行查詢,關注我們,繼續學習!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。