doctype html>
<
html
>
<
head
lang
="en"
>
<
meta
charset
="utf-8"
>
<
title
>
title
>
<
style
>
body
.div1
.div2
.spcenter
.div3
.div4
.div5
imgul
ul li
style
>
head
>
<
body
>
<
p>水平居中
p>
<
div
class
="div1 spcenter"
>
<
div
class
="div2 spcenter"
>
div>
div>
<
hr/>
<
p>的垂直居中
p>
<
div
class
="div3"
>
div>
<
hr/>
<
p>針對文字短的文字的垂直居中
p>
<
div
class
="div4"
>
<
span
>這真的是文字的垂直居中
span
>
div>
<
hr/>
<
p>文字與、按鈕、導航的垂直居中
p>
<
div
class
="div5"
>
<
span
>與文字垂直居中
span
>
<
input
type
="text"
/>
<
img
src="no**atar_big.gif"
alt=""
/>
<
ul>
<
li>qwe
li>
<
li>wer
li>
<
li>ert
li>
ul>
div>
body
>
html
>
**執行如下
css 居中總結
1.定寬塊狀元素 水平居中 divstyle 2.不定寬塊狀元素 水平居中 wrap class wrap 設定我所在的div容器水平居中 div 2.display inline textalign center 它將塊狀元素的 display 型別改為 inline,變成了行內元素,所以少了一些...
css居中總結
給父元素設定 text align center 但對浮動元素,絕對定位元素無效設定margin 0 auto 將塊級元素display設定為inline,然後使用text align center 給父元素設定float,position relative,left 50 子元素設定positio...
css居中總結
1.我們可以通過給該元素的父級設定margin 0 auto的方式來實現。html class parent class child center div div css child此時檢查元素即可即可實現內層的div實現了居中,這種方式是最為我們熟知的,其缺點是需要設定子元素的寬度。2.通過pos...