Heim > Artikel > Web-Frontend > Wie kann man das P-Tag in einem DIV-Tag in HTML sowohl horizontal als auch vertikal zentrieren?
Wie kann man das P-Tag in einem DIV-Tag in HTML sowohl horizontal als auch vertikal zentrieren?
- 黄舟Original
- 2017-07-03 13:51:3511808Durchsuche
Wie zentriert man das P-Tag im DIV-Tag sowohl horizontal als auch vertikal in HTML?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>让DIV标签中的P标签水平和垂直都居中</title>
<style type="text/css">
div {
width:400px;
height:300px;
border:1px solid #666;
overflow:hidden;
position:relative;
display:table-cell;
text-align:center;
vertical-align:middle;
}
p {
border:1px solid #333;
width:100%;
}
* { margin:0; padding:0;}
</style>
</head>
<body>
<div>
<p>我是多行文本，我要水平和垂直都居中。</p>
<p>且要完全兼容ff和ie。我是多行文本，我要水平和垂直都居中。且要完全兼容ff和ie。</p>
</div>
</body>
</html>Das obige ist der detaillierte Inhalt vonWie kann man das P-Tag in einem DIV-Tag in HTML sowohl horizontal als auch vertikal zentrieren?. 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
Vorheriger Artikel：Problem mit der Fehlausrichtung des p-Tags in HTMLNächster Artikel：Problem mit der Fehlausrichtung des p-Tags in HTML