!DOCTYPE?html
創(chuàng)新互聯(lián)公司網(wǎng)站建設(shè)10余年堅(jiān)持，服務(wù)企業(yè)網(wǎng)站設(shè)計(jì)、自適應(yīng)網(wǎng)站建設(shè)等網(wǎng)站建設(shè)服務(wù)。數(shù)千家企業(yè)的合作經(jīng)驗(yàn)，幫助我們?yōu)榉?wù)企業(yè)不斷提升價(jià)值。為企業(yè)建設(shè)開(kāi)發(fā)網(wǎng)站和維護(hù)，主推個(gè)性化定制型網(wǎng)站設(shè)計(jì)
html?lang="en"
head
meta?charset="UTF-8"
titletest/title
style
div?{
text-align:?center;
margin-bottom:?20px;
width:?100px;
height:?100px;
line-height:?100px;
}
.a?{
/*圓點(diǎn)*/
border:?10px?dotted?red;
}
.b?{
/*實(shí)線*/
border:?10px?solid?red;
}
.c?{
/*雙實(shí)線*/
border:?10px?double?red;
}
.d?{
/*虛線*/
border:?10px?dashed?red;
}
/style
/head
body
div?class="a"
圓點(diǎn)
/div
div?class="b"
實(shí)線
/div
div?class="c"
雙實(shí)線
/div
div?class="d"
虛線
/div
/body
/html
在CSS 中常見(jiàn)的邊框(border) 屬性有以下幾種：
border-style
border-width
border-color
border-top-, border-left-, border-bottom-, border-right-
border
border-style
border-style屬性指定邊框的樣式。以下的表格列出這個(gè)屬性可能有的值，以及每一個(gè)值顯現(xiàn)出來(lái)的結(jié)果。
border-width
border-width屬性是用來(lái)設(shè)定邊框的寬度?？捎玫闹禐閠hin (薄)、medium (中等)、thick (厚)，或是一個(gè)數(shù)字。
border-color
border-color屬性是用來(lái)設(shè)定邊寬的顏色。
border-top-, border-left-, border-bottom-, border-right-
我們可以將方向(top -上、bottom -下、left -左、right -右)和樣式、寬度、及顏色合起來(lái)而成為一個(gè)屬性。舉例來(lái)說(shuō)， border-top-style屬性就是用來(lái)設(shè)定上邊框的樣式。以下舉幾個(gè)例子：
border
若四邊的邊框?qū)傩远家粯?，那我們可以用一個(gè)border屬性來(lái)描述，而不必四個(gè)邊都描述一次。另外，我們可以在同一行一次宣告邊框樣式、邊框?qū)挾取⒁约斑吙蝾伾?/p>
p {
border:#0000FF 5px solid;?
}
那以下的HTML，
p用一行來(lái)宣布所有邊框的屬性/p ?
會(huì)顯現(xiàn)出
border線型主要有：
1、dotted【點(diǎn)狀】
2、solid【實(shí)線】
3、double【雙實(shí)線】
4、dashed;【虛線】
實(shí)例一：如果一個(gè)CSS這樣寫(xiě)：border-style:dotted solid double dashed; 出來(lái)的框就是：上邊框是點(diǎn)狀，右邊框是實(shí)線，下邊框是雙線，左邊框是虛線
實(shí)例二：如果一個(gè)CSS這樣寫(xiě)：border-bottom:1px dashed #000000;出來(lái)的框就是：一條寬度為1像素的黑色下劃虛線。
以此類推。多試試就知道什么效果了哦。
需要準(zhǔn)備的材料分別有：電腦、瀏覽器、html編輯器。
1、首先，打開(kāi)html編輯器，新建html文件，例如：index.html。
2、在index.html中的style標(biāo)簽中，輸入css代碼：div {height:60px;border-bottom:1px dashed}。
3、瀏覽器運(yùn)行index.html頁(yè)面，此時(shí)通過(guò)css定義了一個(gè)水平的虛線。
css有兩種虛線形式，一種是dashed，一種是dotted；如：
div?style="width:100px;height:100px;border:1px?dashed?red"/div
div?style="width:100px;height:100px;border:1px?dotted?red"/div
效果圖如下：
style type="text/css"
!--
.dashed_tbl {
border-top: 1px dashed #333333;
border-left: 1px dashed #333333;
}
.dashed_tbl td{
border-bottom:1px dashed #333333;
border-right:1px dashed #333333;
padding:3px 10px;
}
--
/style
table cellpadding="0" cellspacing="0" class="dashed_tbl"
tr
td123/td
td234/td
td345/td
/tr
tr
td123/td
td234/td
td345/td
/tr
tr
td123/td
td234/td
td345/td
/tr
/table
是不是這樣的?
重慶分公司
重慶分公司
