溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章將為大家詳細講解有關css中如何設置p標簽不換行，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。
設置p標簽不換行的方法：使用display屬性，在p標簽元素中設置display屬性的值為“inline”或“inline-block”；這樣可以使p標簽被顯示為內聯元素或行內塊元素，元素前后沒有換行符，也就無法換行了。
HTML p標簽
p標簽是塊級元素，會獨占一行。默認情況下p標簽會自動換行的。
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>css設置p標簽不換行</title>
<style>
p{
background: pink;
}
</style>
</head>
<body>
<p>測試文本。</p>
<p>測試文本。</p>
<!--
p標簽是塊級元素，會獨占一行
默認情況下p標簽會自動換行的
-->
</body>
</html>效果圖：
如果我們想要讓p標簽不換行，讓兩個p標簽在同一行該如何設置呢？
設置p標簽不換行
css可以通過為p標簽設置“display:inline;”或“display:inline-block;”樣式使p標簽不換行。
示例：
效果圖：
display:inline;
display 屬性規定元素應該生成的框的類型。
這個屬性用于定義建立布局時元素生成的顯示框類型。對于 HTML 等文檔類型，如果使用 display 不謹慎會很危險，因為可能違反 HTML 中已經定義的顯示層次結構。對于 XML，由于 XML 沒有內置的這種層次結構，所有 display 是絕對必要的。
屬性值：
block 此元素將顯示為塊級元素，此元素前后會帶有換行符。
inline 默認。此元素會被顯示為內聯元素，元素前后沒有換行符。
inline-block 行內塊元素，元素前后沒有換行符。（CSS2.1 新增的值）
內聯元素的特征：
設置寬高無效
對margin僅設置左右方向有效，上下無效；padding設置上下左右都有效，即會撐大空間
不會自動進行換行
行內塊元素的特征：
不自動換行
能夠識別寬高
默認排列方式為從左到右
關于“css中如何設置p標簽不換行”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
