HTML 元素居中的方法
生活随笔
收集整理的這篇文章主要介紹了
HTML 元素居中的方法
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
網址：http://www.cnblogs.com/asqq/archive/2012/04/09/2438745.html
1. 元素的定位的方法選擇 ：absolute 。
2. 給定元素的寬和高。
3.因為是absolute定位的方法， 用百分比的方法，借用left和top的屬性，將元素的左上頂點的坐標定位到屏幕的中心。
4. 矯正圖片的位置，margin-top和margin-left可以為負數時的屬性作用，將margin-left和margin-top的值，分別定位元素寬和高的值的一半，并取為負數。
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"/> 5 <title>Hello The World!</title> 6 <link href="css/main.css" rel="stylesheet" type="text/css" /> 7 <style> 8 #feeling{ 9 background-color: #0000CD; 10 position: absolute; 11 width: 800px; 12 height: 600px; 13 top: 50%; 14 left: 50%; 15 margin-top: -300px; 16 margin-left: -400px; 17 } 18 </style> 19 </head> 20 <body> 21 <id id="feeling"> 22 </id> 23 </body> 24 </html>?
轉載于:https://www.cnblogs.com/jingjingdidunhe/p/6561881.html
總結
以上是生活随笔為你收集整理的HTML 元素居中的方法的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 《廖雪峰 . Git 教程》学习总结
- 下一篇： HTML-Form