網(wǎng)頁(yè)設(shè)計(jì)中CSS樣式里設(shè)定margin:0 20px 30% 0;其中30%是相對(duì)于什么?是個(gè)什么概念?

margin是用來(lái)設(shè)定該元素與相鄰元素直接的距離。

創(chuàng)新互聯(lián)憑借專(zhuān)業(yè)的設(shè)計(jì)團(tuán)隊(duì)扎實(shí)的技術(shù)支持、優(yōu)質(zhì)高效的服務(wù)意識(shí)和豐厚的資源優(yōu)勢(shì)，提供專(zhuān)業(yè)的網(wǎng)站策劃、網(wǎng)站制作、成都網(wǎng)站建設(shè)、網(wǎng)站優(yōu)化、軟件開(kāi)發(fā)、網(wǎng)站改版等服務(wù)，在成都十載的網(wǎng)站建設(shè)設(shè)計(jì)經(jīng)驗(yàn)，為成都近千家中小型企業(yè)策劃設(shè)計(jì)了網(wǎng)站。

margin:0

20px

30%

0對(duì)應(yīng)的是與上，右，下，左四邊相鄰元素的距離。

30%指下邊距為其父元素的寬度的30%

補(bǔ)充：

1.如果margin只有三個(gè)值，按照值的順序?yàn)閙argin：top

right

bottom;

缺少了left，根據(jù)原則，則left的值有right來(lái)代替。

margin:10px

20px

30px;就等于margin:10px

20px

30px

20px;

2.如果margin只有兩個(gè)值，按照值的順序?yàn)閙argin：top

right;

缺少了bottom和left，根據(jù)原則left的值由right來(lái)代替，bottm的值由top來(lái)代替。

margin:10px

20px;就等于margin:10px

20px

10px

20px;

3.如果margin只有一個(gè)值，按照值的順序?yàn)閙argin:top;

缺少了bottom、left和right，根據(jù)原則left的值由right來(lái)代替，bottom的值由top來(lái)代替，right的值右top來(lái)代替，也就是說(shuō)left的值也由top來(lái)代替。

margin:10px;就等于margin:10px

10px

10px

10px;

css 為什么有時(shí)MARGIN 不起作用，

css有時(shí)MARGIN 不起作用是設(shè)置錯(cuò)誤造成的，解決方法為：

1、新建一個(gè)HTML文件，命名為test.html。

2、為了測(cè)試出明顯的效果，在test.html使用div定義了一個(gè)帶邊框的模塊，里面放一個(gè)p標(biāo)簽。下面以p標(biāo)簽的外邊距設(shè)置為例，詳細(xì)講解margin的使用。

3、使用margin設(shè)置p標(biāo)簽的左外邊距。主要使用margin-left的方法定義左外邊距的樣式，值越大，距離左邊就越大。

4、使用margin設(shè)置p標(biāo)簽的右外邊距。主要使用margin-right的方法定義右外邊距的樣式，值越大，距離右邊就越大。

5、使用margin設(shè)置p標(biāo)簽的上外邊距。主要使用margin-top的方法定義上外邊距的樣式，值越大，距離上邊就越大。

6、使用margin設(shè)置p標(biāo)簽的下外邊距。主要使用margin-bottom的方法定義下外邊距的樣式，值越大，距離下邊就越大。

網(wǎng)頁(yè)css樣式,margin問(wèn)題

這是內(nèi)核瀏覽器的bug,很普遍的問(wèn)題。解決的方法有幾種：

1.margin換成padding（最快捷的方法）

2.使用浮動(dòng)

3.給父級(jí)div加點(diǎn)內(nèi)容，比較邊框之類(lèi)?；蛘咴趇d=lianjie_t的div之前加點(diǎn)內(nèi)容

具體不懂的話可以M我，互相幫助，望采納。。。

補(bǔ)充下，這個(gè)問(wèn)題在IE6是可以的，是瀏覽器的BUG問(wèn)題，只要是父級(jí)div沒(méi)有內(nèi)容（也就是id=lianjie_t之前沒(méi)內(nèi)容），而且使用margin就會(huì)出現(xiàn)這個(gè)問(wèn)題。別和自己較勁。。。

css margin

CSS:

#header,#footer{border:solid 1px #FF0033;height:20px;}

#main{padding:1px;margin:10px;border:solid 1px #F03;height:1%;}

#content{margin:200px;width:50px;border:solid 1px #F03;background:#C69;}

XHTML:

div id="header"/div

div id="main" onclick="alert(this.currentStyle.hasLayout)"

div id="content"ttttt/div

/div

div id="footer"/div

OK,我來(lái)解釋一下，這個(gè)問(wèn)題涉及到CSS的兩個(gè)話題：“空白邊疊加”和“IE擁有布局”。

首先，你應(yīng)該已經(jīng)對(duì)“空白邊疊加“這個(gè)問(wèn)題有所了解，如果不然，則你可以此為關(guān)鍵字在網(wǎng)上搜索一下，這個(gè)問(wèn)題非常普遍，所以我就不再這里復(fù)制粘貼了，

下面說(shuō)說(shuō)導(dǎo)致問(wèn)題的原因：

在IE中,"擁有布局的元素之間空白邊不疊加"，

當(dāng)main的樣式為：

#main{padding:1px;margin:10px;border:solid 1px #F03;}

這時(shí)候 div id="main" onclick="alert(this.currentStyle.hasLayout)"

通過(guò)JS探測(cè)到此時(shí)的main元素沒(méi)有“擁有布局”,所以"空白邊疊加"了，

為了使main元素"擁有布局"，將main的樣式設(shè)置為：

#main{padding:1px;margin:10px;border:solid 1px #F03;height:1%;}

（實(shí)際應(yīng)該為：

#main{padding:1px;margin:10px;border:solid 1px #F03;}

/* IE5-MAC 隱藏\*/

* html #main{height:1%;}

/* 不在 IE5-MAC中隱藏 */

）

即為元素設(shè)置任意高度（其他方法請(qǐng)搜索之）使其”擁有布局“，問(wèn)題便解決了。IE的”擁有布局“會(huì)導(dǎo)致很多問(wèn)題，所以你可以深入了解下這個(gè)問(wèn)題，以便在以后遇到類(lèi)似的問(wèn)題輕松解決。

CSS樣式里的padding和margin是什么意思,有何作用

Padding:這個(gè)簡(jiǎn)寫(xiě)屬性設(shè)置元素所有內(nèi)邊距的寬度，或者設(shè)置各邊上內(nèi)邊距的寬度。行內(nèi)非替換元素上設(shè)置的內(nèi)邊距不會(huì)影響行高計(jì)算；因此，如果一個(gè)元素既有內(nèi)邊距又有背景，從視覺(jué)上看可能會(huì)延伸到其他行，有可能還會(huì)與其他內(nèi)容重疊。元素的背景會(huì)延伸穿過(guò)內(nèi)邊距。不允許指定負(fù)邊距值。值 描述

* padding-top

* padding-right

* padding-bottom

* padding-left

設(shè)置內(nèi)邊距。

值可以是：

* 百分比（基于父元素寬度的百分比）

* 長(zhǎng)度值（固定的padding值）

Margin:這個(gè)簡(jiǎn)寫(xiě)屬性設(shè)置一個(gè)元素所有外邊距的寬度，或者設(shè)置各邊上外邊距的寬度。

塊級(jí)元素的垂直相鄰?fù)膺吘鄷?huì)合并，而行內(nèi)元素實(shí)際上不占上下外邊距。行內(nèi)元素的的左右外邊距不會(huì)合并。同樣地，浮動(dòng)元素的外邊距也不會(huì)合并。允許指定負(fù)的外邊距值，不過(guò)使用時(shí)要小心。

值 描述

* margin-top

* margin-right

* margin-bottom

* margin-left

設(shè)置針對(duì)邊距的屬性。

值可以是：

* 百分比（基于父對(duì)象總高度或?qū)挾鹊陌俜直龋?/p>

* 長(zhǎng)度值（定義一個(gè)固定的邊距）

* auto（瀏覽器設(shè)定的值）。

默認(rèn)值：未定義。