Heim  >  Artikel  >  Web-Frontend  >  So zentrieren Sie Text in HTML

So zentrieren Sie Text in HTML

藏色散人
藏色散人Original
2021-05-12 14:12:2936785Durchsuche

So zentrieren Sie Text in HTML: 1. Fügen Sie den CSS-Attributwert „text-align:center“ zur Beschriftung hinzu, an der sich der Text befindet. 2. Fügen Sie den CSS-Attributwert „text-align:left“ zur Inline-Beschriftung hinzu oder Inline-Block-Level-Label.

So zentrieren Sie Text in HTML

Die Betriebsumgebung dieses Artikels: Windows7-System, HTML5- und CSS3-Version, Dell G3-Computer.

Zwei Situationen: 1. Das Textformat ist zentriert; 2. Die Beschriftung, auf der sich der Text befindet, ist im Fenster zentriert.

1. Fügen Sie den CSS-Attributwert „text-align:center“ zur Beschriftung hinzu, an der sich der Text befindet. Zum Beispiel:

<p style="text-align:center">我是文本,居中显示</p>

2. Es gibt viele Methoden, hier sind zwei, zum Beispiel:

1) (Empfehlung) Text sollte durch Inline-Tags oder Inline-Block-Level-Tags und Inline-Tags oder Inline-Block-Level-Tags umschlossen werden werden wiederum von einem Tag-Paket auf Blockebene umhüllt. Dadurch wird das Textformat zentriert. Wenn Sie möchten, dass das Textformat nicht zentriert ist, können Sie den CSS-Attributwert „text-align:left“ oder andere zum Inline-Label oder Inline-Block-Level-Label hinzufügen.

<div style="text-align:center"> <!-- 块级标签 -->
    <span>我是文本所在标签1,文本居中显示<span> <!-- 行内标签 -->
    <div style="display:inline-block;">我是文本所在标签2,文本居中显示</div> <!-- 行内块级标签 -->
</div>

2) Text wird von Tags auf Blockebene umschlossen. Legen Sie die Breite für das Tag auf Blockebene fest und fügen Sie den CSS-Eigenschaftswert „margin:0 auto“ hinzu. Dadurch wird das Textformat nicht zentriert. Wenn Sie möchten, dass das Textformat zentriert ist, können Sie dem Tag auf Blockebene den CSS-Attributwert „text-align:center“ hinzufügen.

<div style="width: 100px; margin:0 auto">我是文本所在标签,文本居中显示</div>

Lernvideo-Sharing: CSS-Video-Tutorial

Das obige ist der detaillierte Inhalt vonSo zentrieren Sie Text in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn