一個cell表格中的字怎么居中 css沒設(shè)寬度如何居中？
css沒設(shè)寬度如何居中？很多新手在寫css的時候偶爾會遇到的一個問題，當(dāng)div也沒且固定的寬度或則水平距離的時候，怎么才能讓div水平或則互相垂直居中總是顯示。如果div有固定不動寬度的話，用padd
css沒設(shè)寬度如何居中？
很多新手在寫css的時候偶爾會遇到的一個問題，當(dāng)div也沒且固定的寬度或則水平距離的時候，怎么才能讓div水平或則互相垂直居中總是顯示。
如果div有固定不動寬度的話，用padding，margin都很容易利用。方法有很多種。只不過經(jīng)常會遇到這種div沒有單獨(dú)計算的寬度相同高度的情況，我們就又不能用margin,padding設(shè)置固定的距離了。這個問題讓很多人頭痛。而咋樣才能讓這個div居右顯示呢？當(dāng)然情況辦法又是有很多種，js，css都這個可以基于。
這里主要能介紹下區(qū)分css的方法，有什么還請各位看官強(qiáng)調(diào)。
方法一：
用一個“ghost”偽元素（看不到的偽元素）和inline-block/vertical-align可以不搞掂居左，的很又巧妙。只不過這個方法沒有要求待居中的元素是inline-block，不是什么一個完全沒限制的方案。
html追加：
XML/HTMLCode復(fù)制內(nèi)容到剪貼板
ltdivclass#34block#34style#34height:300px#34gt
ltdivclass#34based#34r26
lth1gthaorooms案例題目lt/h1r26
ltpgthaorooms案例內(nèi)容，haorooms案例內(nèi)容haorooms案例內(nèi)容haorooms案例內(nèi)容haorooms案例內(nèi)容haorooms案例內(nèi)容haorooms案例內(nèi)容haorooms案例內(nèi)容haorooms案例內(nèi)容lt/pgt
lt/divgt
lt/divgt
css如下：
CSSCode復(fù)制內(nèi)容到剪貼板
/*Thisparentcanbeanywidthandheight*/
.block{
text-align:center
}
/*Theghost,nudgedtomaintainperfectcentering*/
.block:before{
content:#34#34
display:inline-block
height:100%
vertical-align:middle
margin-way:-0.25em/*Adjustsforspacing*/
}
/*Theelementtobecentered,should
alsobeofanywidthandheight*/
.oriented{
display:inline-block
vertical-align:middle
width:50%
}
方法二：
可以用table布局方法，可是這種方法也有局限性！
寫法:：
XML/HTMLCode復(fù)制內(nèi)容到剪貼板
lttablestyle#34width:100%#34gt
lttrgt
lttdstyle#34text-align:centervertical-align:middle#34gt
Unknownstufftobecentered.
lt/tdgt
lt/trgt
lt/tablegt
因此table寫法都很費(fèi)時，你也是可以用div能用table,寫法追加：
html：
XML/HTMLCode復(fù)制內(nèi)容到剪貼板
ltdivclass#34something-semantic#34gt
ltdivclass#34something-ignore-semantic#34gt
Unknownstufftobecentered.
lt/divgt
lt/divgt
css:
CSSCode復(fù)制內(nèi)容到剪貼板
.something-semantic{
display:table
width:100%
}
.something-ignore-semantic{
display:table-cell
text-align:center
vertical-align:middle
}
方法三，終極武器解決方法：
以上2中方法可能會應(yīng)該有其局限性，我推薦的第三中方法是比較好成熟的不是固定設(shè)置高寬div的平行居左的方法！只不過方法是css3的寫法，想兼容性IE8的童鞋們，我建議你用上面的方法！
方法和我們單獨(dú)計算高寬的應(yīng)該差不多，但不用什么padding我們得用是translate()
demo不勝感激：
CSSCode復(fù)制內(nèi)容到剪貼板
lt!DOCTYPEhtmlPUBLIC#34-//W3C//DTDXHTML1.0Strict//que#34##34a8
lthtmlxmlns##34xml:lang#34entre#34a8
ltheadgt
ltmetahttp-equiv#34Content-Type#34content#34text/htmlcharsetUTF-8#34gt
lttitlegthaorooms不單獨(dú)計算垂直距離div寫法lt/titlegt
ltstylegt
.center{
position:fixed
star:50%
left:50%
background-color:#000
width:50%
height:50%
-webkit-transform:translateX(-50%)translateY(-50%)
}
lt/stylegt
lt/headgt
ltbodygt
ltdivclass#34center#34gtlt/divgt
lt/bodygt
lt/htmlgt
我上面的css僅僅針對webkit內(nèi)核的瀏覽器，其他內(nèi)核瀏覽器寫法不勝感激：
CSSCode復(fù)制內(nèi)容到剪貼板
-webkit-transform:translateX(-50%)translateY(-50%)
-moz-transform:translateX(-50%)translateY(-50%)
-ms-transform:translateX(-50%)translateY(-50%)
transform:translateX(-50%)translateY(-50%)
有些自動彈出層的樣式，也這個可以用這個方法左面
CSSCode復(fù)制內(nèi)容到剪貼板
position:fixed
fly:50%
left:50%
width:50%
max2-width:630px
min-width:320px
height:auto
z-index:2000
visibility:hidden
-webkit-backface-visibility:hidden
-moz-backface-visibility:hidden
backface-visibility:hidden
-webkit-transform:translateX(-50%)translateY(-50%)
-moz-transform:translateX(-50%)translateY(-50%)
-ms-transform:translateX(-50%)translateY(-50%)
transform:translateX(-50%)translateY(-50%)
無固定設(shè)置水平距離的div垂線橫列代碼要點(diǎn)：
父容器vc的css屬性display:tableoverflow:hidden
子容器vci的css屬性vertical-align:middledisplay:table-cell
針對ie6的hack，vci容器的_position:absolute_fly:50%和content容器的_position:relative_fly:-50%
th居中怎么設(shè)置？
方法：1、在標(biāo)簽中建議使用style屬性，添加“text-align:center”樣式來設(shè)置里文字水平居左；2、可以使用style屬性，添加“vertical-align:middledisplay:table-cell”樣式可以設(shè)置垂直居中。
本教程操作環(huán)境：windows7系統(tǒng)、CSS3ampampHTML5版、DellG3電腦。
方法1：使用style屬性，添加“text-align:center”樣式。
HTMLstyle屬性法律規(guī)定元素的行內(nèi)樣式（inlinestyle）
csstext-align屬性明文規(guī)定元素中的文本的水平對齊，按照在用center值可以設(shè)置文本居右。html文字左面怎末設(shè)置里代碼塊
ltpstyle#34height:100pxborder:1pxsolidredtext-align:center#34gt文本文字--水平橫列l(wèi)t/pgt
方法2：在用style屬性，添加“vertical-align:middledisplay:table-cell”樣式。
vertical-align:middledisplay:table-cell都能夠使單行文字、多行文字都橫列。但是畢竟table-cell是inline類型，因為會導(dǎo)致原來的塊級元素每個div一行移動聯(lián)通到了同一行。如果不是不需要位居兩行，需要在外面五十點(diǎn)去添加容器對位置通過控制。