bootstrap中有沒有一個類可以讓元素內(nèi)容，可以在屏幕上，上下左右都居中顯示？
我覺得要是有這樣一個類會很方便啊，可惜text-center只能讓元素內(nèi)容左右居中顯示。
長孫同學(xué)
2016-04-15
6 回答
舉報
0/150
提交
取消
2016-10-11
<!DOCTYPE?html> <html> <head> ??<meta?charset="UTF-8"> ??<meta?http-equiv="X-UA-Compatible"?content="IE=edge"> ??<meta?name="viewport"?content="width=device-width,?initial-scale=1"> ??<title>絕對屏幕居中</title> ??<!--?Boostrap?--> ??<link?rel="stylesheet"?type="text/css"?href="css/bootstrap.min.css"> ??<link?rel="stylesheet"?type="text/css"?href=""> ??<!--?以下兩個插件是對IE8及以下版本瀏覽器支持html5元素和媒體查詢?--> ??<!--?[if?lt?IE?9]?--> ??<script?src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> ??<script?src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> ??<!--?[endif]?--> </head> <body> ??<div?id="d1"?style="position:?fixed;?width:?100px;?height:?100px;?background-color:?green;">我要永遠(yuǎn)居中</div> ??<div?style="text-align:?center;?margin:?0?auto;?height:?5000px;?background-color:?red"></div> ??<script?type="text/javascript"> ????function?getClientWidth() ????{ ??????var?clientWidth=0; ??????if(document.body.clientWidth&&document.documentElement.clientWidth) ??????{ ????????clientWidth?=?(document.body.clientWidth<document.documentElement.clientWidth)?document.body.clientWidth:document.documentElement.clientWidth; ??????} ??????else ??????{ ????????clientWidth?=?(document.body.clientWidth>document.documentElement.clientWidth)?document.body.clientWidth:document.documentElement.clientWidth; ??????} ??????return?clientWidth; ????} ????function?getClientHeight() ????{ ??????var?clientHeight=0; ??????if(document.body.clientHeight&&document.documentElement.clientHeight) ??????{ ????????clientHeight?=?(document.body.clientHeight<document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight; ??????} ??????else ??????{ ????????clientHeight?=?(document.body.clientHeight>document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight; ??????} ??????return?clientHeight; ????} ????var?d1?=?document.getElementById("d1"); ????d1.style.left?=?getClientWidth()/2?-?50?+?"px"; ????d1.style.top?=?getClientHeight()/2?-?50?+?"px"; ??</script> ??<!--?若果要使用Boostrap的js插件，必須先調(diào)入jQuery?--> ??<script?src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js"></script> ??<!--?包括所有bootstrap的js插件或者可以根據(jù)需要使用的js插件調(diào)用 --> ??<script?src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> </body> </html>貌似沒有，只能自己先寫
2016-11-28
自己寫啊text-align:center;vertical-align: middle;
2016-09-14
text-align: center;
margin: 0 auto;
2016-04-15
好像是需要用jquery動態(tài)獲取屏幕的高度。
2016-04-15
看了下源代碼，沒找到，sad~ ?那么問題又來了，怎么寫這樣一個類呢？
2016-04-15
好像沒有