html5 - html怎么让div居中啊??
伊谢尔伦
伊谢尔伦 2017-04-17 13:09:33
0
4
1231
伊谢尔伦
伊谢尔伦

小伙看你根骨奇佳,潜力无限,来学PHP伐。

Antworte allen(4)
左手右手慢动作

没看你代码哈。
不过让快元素居中,有多种方式:
1: display:inline-block
<style>

.total{width:1000px;height:auto;border:1px solid #ccc;text-align:center;}
.center{width:200px;height:50px;background-color:blue;display:inline-block;}

</style>
<p class='total'>

<p class='center'></p>

</p>

2: 未知宽高:position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
<style>

.total{width:1000px;height:auto;border:1px solid #ccc;}
.center{width:200px;height:50px;background-color:blue;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}

</style>
<p class='total'>

<p class='center'></p>

</p>

2: 已知宽高:width:200px;height:200px;position:absolute;left:50%;top:50%;transform:translate(-100px,-100px);
<style>

.total{width:1000px;height:auto;border:1px solid #ccc;}
.center{width:200px;height:50px;background-color:blue;position:absolute;left:50%;top:50%;transform:translate(-100px,-100px)}

</style>
<p class='total'>

<p class='center'></p>

</p>

以上代码未经测试,若有问题再问哈

巴扎黑

infelx 加justify 加align 不要太好用,不过记住要兼容

Peter_Zhu

margin:0 auto

左手右手慢动作

http://jackzong.github.io/201...

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!