CSSでpタグを折り返さないように設定する方法-CSSチュートリアル-php.cn

CSSでpタグを折り返さないように設定する方法

青灯夜游

リリース： 2021-01-28 09:20:02

オリジナル

16420 人が閲覧しました

p タグをラップしないように設定する方法: 表示属性を使用し、p タグ要素の表示属性の値を「inline」または「inline-block」に設定します。これにより、p タグが発生します。インライン要素またはインラインブロック要素として表示する要素の前後に改行がない場合は改行できません。

この記事の動作環境: Acer S40-51、CSS3&&HTML5&&HBuilderX.3.0.5 版、Windows10 Home 中国語版

(学習ビデオ共有: css ビデオチュートリアル)

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>

ログイン後にコピー

レンダリング:

CSSでpタグを折り返さないように設定する方法

p タグをラップしないようにするには、2 つの p タグを同じように設定するにはどうすればよいですか？

p タグをラップしないように設定します

css p タグに「display:inline;」または「display:inline-block;」スタイルを設定できますp タグが折り返されないように改行します。

例:

CSSでpタグを折り返さないように設定する方法

レンダリング:

CSSでpタグを折り返さないように設定する方法

<strong>display:inline ; </strong>

display 属性は、要素が生成するボックスのタイプを指定します。

この属性は、レイアウトの作成時に要素によって生成される表示ボックスのタイプを定義するために使用されます。 HTML などのドキュメントタイプの場合、表示を不用意に使用すると、HTML ですでに定義されている表示階層に違反する可能性があるため、危険です。 XML の場合、XML にはこの種の階層が組み込まれていないため、すべての表示が絶対に必要です。

属性値: