html body標籤的居中屬性你知道嗎？ html body標籤的定義與使用方法
- 寻∝梦原創
- 2018-08-20 14:14:1725379瀏覽
html body標籤的居中屬性你知道嗎？ html body標籤的定義和使用方法。以下這篇文章主要為大家解釋的就是html body標籤的定義和居中屬性的兩種方法，還有關於html body標籤的定義和使用方法介紹
html body標籤的定義和用法：
body 元素定義文件的主體。
body 元素包含文件的所有內容（例如文字、超連結、圖像、表格和清單等等。）
HTML 6c04bd5ca3fcae76e30b72ad730ca86d 標籤實例
一個簡單的HTML 文檔，帶有最基本的必需的元素：
<html> <head> <title>文档的标题</title> </head> <body> 文档的内容... ... </body> </html>
#html body標籤的居中屬性
html body標籤的居中屬性(一):
基礎居中的使用方法：
<html> <head> <title>居中</title> </head> <body style="text-align:center;"> <h2>居中</h2> </body> </html>
html body標籤的居中屬性（二）:
#div標籤在body裡水平垂直居中使用方法：
水平居中： div標籤在整個body裡居中的方法用CSS控制即可，body{text-align:center;} .box{margin: 0 auto;} 類別box就是在整個body里水平居中
垂直居中：div在body裡的垂直居中用CSS控制都不是很有效果，所以用js來控制比較管用,程式碼如下（jQuery ):
function SetPostion(){
var wheight = $(window).height(); //浏览器的高度
var boxheight = $(“.box”).height(); //box的高度
//浏览器的高度若大于box的高度，才设置box垂直居中
if(wheight > boxheight){
var h = (wheight -boxheight)/2; //计算box距顶端的距离
$(“.box”).css(“margin-top” ,h+”px”) //设置box的margin-top属性
}
}名為box的css類別就垂直居中了
#瀏覽器支援
所有主流瀏覽器都支援6c04bd5ca3fcae76e30b72ad730ca86d標籤。
【相關推薦】
HTML del標籤是區塊級元素嗎？ html del標籤具體應用方法
html hr標籤的屬性有哪些？ HTML hr標籤的樣式詳解
以上是html body標籤的居中屬性你知道嗎？ html body標籤的定義與使用方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn