|
網(wǎng)站建設(shè)是指使用標(biāo)識(shí)語(yǔ)言（markup language)，通過(guò)一系列設(shè)計(jì)、建模、和執(zhí)行的過(guò)程將電子格式的信息通過(guò)互聯(lián)網(wǎng)傳輸，最終以圖形用戶界面（GUI）的形式被用戶所瀏覽。簡(jiǎn)單來(lái)說(shuō)，網(wǎng)頁(yè)設(shè)計(jì)的目的就是產(chǎn)生網(wǎng)站。簡(jiǎn)單的信息如文字，圖片（GIF，JPEG，PNG）和表格，都可以通過(guò)使超文件標(biāo)示語(yǔ)言、可擴(kuò)展超文本標(biāo)記語(yǔ)言等標(biāo)示語(yǔ)言放置到網(wǎng)站頁(yè)面上。
一、框填充屬性1、padding-bottom
padding-left
padding-top
padding-right功能：毎個(gè)容器都有邊框，這些屬性設(shè)置邊框與框內(nèi)元素間的距離。
數(shù)值：
長(zhǎng)度 - 設(shè)置相對(duì)或絕對(duì)值。在數(shù)字后指定度量單位如下：mm, cm, in, pt, px, pc, ex, em。em 和 ex 設(shè)置產(chǎn)生相對(duì)于父字體的字體尺寸。
百分比 - 以父元素的百分比設(shè)置邊框。
說(shuō)明：填充值不能使用負(fù)值，但可以是小數(shù)。
例子2、padding功能：是個(gè)簡(jiǎn)寫(xiě)屬性，用于設(shè)置上，下，左，右各個(gè)方向邊框和內(nèi)容元素的間距。
數(shù)值：同前。
說(shuō)明：用單一值可以讓毎邊等距填充；如果用兩個(gè)值，則第一個(gè)值用于上下填充，第二個(gè)值用于左右填充；如果用三個(gè)值，則賦于上邊填充，左右填充和下邊填充；如果用四個(gè)值，則分別用于上，右，下，左填充。可以混合數(shù)值類型。
例子二、框邊框?qū)傩?、border-top
border-bottom
border-right
border-left功能：這四個(gè)屬性都是簡(jiǎn)寫(xiě)屬性，分別設(shè)置上，下，右，左的邊框?qū)傩浴Ｈ笔∏闆r下，邊框沒(méi)有樣式設(shè)置。
數(shù)值：共有三個(gè)邊框?qū)傩?br>border-width: 取值為 thin, medium, thick或指定長(zhǎng)度。
border-style: 設(shè)置用于修飾邊框的底紋。可以設(shè)置下列樣式：none, dotted,doshed, solid, double, groove, ridge, inset, outset。
border-color: 設(shè)置邊框顏色。
例子2、border-top-width
border-bottom-width
border-right=width
border-left-width 功能：分別設(shè)置各個(gè)邊框的厚度。
數(shù)值：
thin - 細(xì)邊框。
medium - 中等線寬。
thick - 粗線。
長(zhǎng)度 - 用相對(duì)或絕對(duì)單位設(shè)置邊框?qū)挾取?br>例子3、border-width功能：簡(jiǎn)寫(xiě)屬性，可同時(shí)設(shè)置四個(gè)邊框的寬度。
數(shù)值：
thin - 細(xì)邊框。
medium - 中等線寬。
thick - 粗線。
長(zhǎng)度 - 用相對(duì)或絕對(duì)單位設(shè)置邊框?qū)挾取?br>說(shuō)明：見(jiàn) padding 說(shuō)明。
例子：邊框?qū)傩?、border-color功能：簡(jiǎn)寫(xiě)屬性，設(shè)置四個(gè)邊框的顏色值。
數(shù)值：可以用顏色名或RGB值。如果指定單個(gè)顏色，則四個(gè)邊框都顯示為這個(gè)顏色；如果指定兩個(gè)顏色，則順序?yàn)樯舷拢笥遥蝗绻付ㄈN顏色，則順序?yàn)樯希笥遥拢蝗绻付ㄋ姆N顏色，則順序?yàn)樯希遥拢蟆?br>說(shuō)明：顏色名如下
aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow.
對(duì)于RGB值，可用三種方法指定
#rrggbb; rgb(r,g,b); rgb(r%,g%,b%)
例子：邊框顏色5、border-style功能：用于顯示邊框和指定邊框樣式。
數(shù)值：
none - 不顯示邊框，為缺省值
dotted - 點(diǎn)線
dashed - 虛線
solid - 實(shí)線
double - 雙線
groove - 3D陷入線
ridge - 3D山脊?fàn)罹�
inset - 使頁(yè)面有沉入感
outset - 使頁(yè)面有浮出感
說(shuō)明：并非所有瀏覽器都能顯示ridge, inset, outset 之類的樣式，有些瀏覽器將所有邊框都繪制成實(shí)線。
Example1Example26、border功能：簡(jiǎn)寫(xiě)屬性，設(shè)置所有邊框?qū)傩浴?br>數(shù)值：
border-width - 取值 thin, medium, thick 或指定長(zhǎng)度。
border-style - 取值 none, dotted, dashed, solid, double, groove, ridge, inset, outset
border-color - 可用顏色名或RGB值。
說(shuō)明：與其它簡(jiǎn)寫(xiě)屬性不同的是，每個(gè)設(shè)置只能取一個(gè)值，這個(gè)屬性均勻作用于框的各邊。
例子：This Is A Example 三、框邊界屬性1、margin-bottom
margin-left
margin-right
margin-top功能：這四個(gè)屬性用來(lái)設(shè)置元素與其相鄰元素間的距離，可以用長(zhǎng)度或相對(duì)于其父文本的寬度的百分比來(lái)定義，也可以自動(dòng)處理。
數(shù)值：
長(zhǎng)度 - 設(shè)置元素相應(yīng)邊與框邊緣之間的相對(duì)或絕對(duì)距離，有效單位為：mm, cm, in, px, pt, pica,ex, em ...
百分比 - 以父元素寬度的百分比設(shè)置邊界尺寸。
auto - 自動(dòng)，這個(gè)設(shè)置取瀏覽器的缺省邊界。
例子2、margin功能：簡(jiǎn)寫(xiě)屬性，用于設(shè)置元素的所有邊界。這是用于描述元素的內(nèi)容的邊緣到框邊緣的距離的。這個(gè)區(qū)總是透明的，可以看到下面的頁(yè)面背景。
數(shù)值：
長(zhǎng)度 - 同前
百分比 - 以父元素寬度的百分比設(shè)置邊界尺寸。
auto - 自動(dòng)，這個(gè)設(shè)置取瀏覽器的缺省邊界。
例子四、框位置屬性1、height功能：設(shè)置元素高度，瀏覽器按照這個(gè)高度調(diào)整圖形。
數(shù)值：
長(zhǎng)度 - mm, cm, px, pt, .....
auto - 自動(dòng)。2、width功能：設(shè)置元素寬度，瀏覽器按照這個(gè)寬度調(diào)整圖形。
數(shù)值：
長(zhǎng)度 - mm, cm, in, px, pt, ......
百分比 - 將圖形尺寸設(shè)置為父元素寬度的百分比。
auto - 自動(dòng)調(diào)整3、float功能：用于在普通元素流布置規(guī)則以外放上元素。
數(shù)值：
none - 無(wú)改動(dòng)。
left - 將其它元素內(nèi)容放到浮動(dòng)元素右邊。
right - 將其它元素內(nèi)容放到浮動(dòng)元素左邊。4、clear功能：用于允許或禁止指定元素旁邊放置其它元素(通常是線上圖形).
數(shù)值：
none - 無(wú)限制。
left - 將元素放在左邊浮動(dòng)元素下面
right - 將元素放在右邊浮動(dòng)元素下面
both - 元素兩邊都不允許放置浮動(dòng)元素大多數(shù)人在上網(wǎng)的時(shí)候，都會(huì)瀏覽網(wǎng)頁(yè)提供給我們的信息。
|
