html body標籤的居中屬性你知道嗎? html body標籤的定義和使用方法。以下這篇文章主要為大家解釋的就是html body標籤的定義和居中屬性的兩種方法,還有關於html body標籤的定義和使用方法介紹
html body標籤的定義和用法:
body 元素定義文件的主體。
body 元素包含文件的所有內容(例如文字、超連結、圖像、表格和清單等等。)
HTML 標籤實例
一個簡單的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類別就垂直居中了
#瀏覽器支援
所有主流瀏覽器都支援
標籤。【相關推薦】
HTML del標籤是區塊級元素嗎? html del標籤具體應用方法
html hr標籤的屬性有哪些? HTML hr標籤的樣式詳解
以上是html body標籤的居中屬性你知道嗎? html body標籤的定義與使用方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!