doctype html
>
<
html
lang
="en"
>
<
head
>
<
meta
charset
="utf-8"
>
<
meta
name
="generator"
content
="editplus®"
>
<
meta
name
="author"
content
="">
<
meta
name
="keywords"
content
="">
<
meta
name
="description"
content
="">
<
title
>塊級元素居中問題
title
>
<
style
type
="text/css"
>
.one
.two
.t-parent
.three
.f-parent
.four
style
>
head
>
<
body
>
<
div
class
="one"
>定寬塊級元素水平居中
div>
<
table
class
="two"
>
<
tr>
<
td>
<
div
>不定寬塊級元素水平居中
div>
td>
tr>
table
>
<
div
class
="t-parent"
>
<
div
class
="three"
>不定寬塊級元素水平居中
div>
div>
<
div
class
="f-parent"
>
<
div
class
="four"
>不定寬塊級元素水平居中
div>
div>
body
>
html
>
行內元素和塊級元素的垂直居中，水平居中
一 行內元素 1 行內元素的水平居中 給父級元素使用屬性text align center 2 行內元素的垂直居中 給父級元素使用屬性line hight 父元素盒子的高度 二 塊級元素 1 塊級元素的水平居中 給子級元素使用屬性margin 0 auto 2 行內元素的水平垂直居中，有四種方法 h...
水平居中塊級元素較好的實現
如上圖所示，要做圖中黃色區域的到期提醒，要求提醒的內容 提醒的內容是指黃色背景上的圖示和文字 居中顯示。我將圖中的驚嘆號標識做為提醒內容的背景處理，而這就要求內容區有乙個高度，所以內容區必須是block level的。但block level的元素的寬度預設等於父元素的寬度，這樣的話內容將從黃色左邊...
行內元素和塊級元素水平及垂直居中問題
首先，介紹一下行內元素和塊級元素，這個很重要，因為有的屬性只能用於塊元素，而有的正好相反，在一定的情況下，它們也可以相互轉換，比如用display來進行設定。行內元素 不佔據一整行，隨內容而定，有以下特點 不可以設定寬高，也不可以設定行高，其寬度隨著內容增加，高度隨字型大小而改變。內聯元素可以設定外...