SVG提供了大量的筆畫屬性绘雁，實現(xiàn)各種各樣的描邊效果。我們來介紹一下：

stroke：筆畫屬性男翰，

stroke-width：筆畫寬度屬性糯彬，

stroke-linecap：筆畫線帽屬性，

stroke-dasharray：虛線筆畫屬性忿峻。

所有的描邊屬性都可以應(yīng)用于任何類型的線條薄啥、文本和元素的輪廓，如 circle逛尚。

首先我們學(xué)習(xí) stroke 屬性垄惧，它定義了一個元素的線條、文本或輪廓的顏色绰寞，值是任何合法的顏色值到逊。

打開編輯器铣口，新建一個 stroke-properties.html 文件，補(bǔ)全基礎(chǔ)代碼蕾管，在 body 里添加一個 svg 標(biāo)簽枷踏，定義屬性 width 等于 300，height 等于 80掰曾。

在 svg 里添加 g 標(biāo)簽，給它定義一個 fill 屬性停团，值為 none旷坦。

在 g 標(biāo)簽里添加 path 標(biāo)簽，定義屬性 stroke 等于 red佑稠，再定義一個 d 屬性秒梅，畫一條線。

復(fù)制兩個 path 標(biāo)簽舌胶。

修改線條的起點(diǎn)坐標(biāo)捆蜀。

修改第二條線的描邊顏色為 black。修改第三條線的描邊顏色為 blue幔嫂。保存文件辆它。

在瀏覽器中預(yù)覽，三條顏色不同的線條就繪制好了履恩。

接下來我們學(xué)習(xí) stroke-width 筆畫寬度屬性锰茉。它定義了一個元素的線條、文本或輪廓的厚度切心。值是一個數(shù)字飒筑。

回到編輯器，在上個 svg 結(jié)尾處添加一個 br 標(biāo)簽绽昏⌒牛回車換行。

添加一個新的 svg 標(biāo)簽全谤，屬性 width 等于 300肤晓，height 等于 80。

在 svg 里添加 g 標(biāo)簽啼县，給它定義一個 fill 屬性材原，值為 none。stroke 屬性季眷，值為 black余蟹。

在 g 標(biāo)簽里添加 path 標(biāo)簽，定義屬性 stroke-width 等于 2子刮，再定義一個 d 屬性威酒，畫一條線窑睁。

復(fù)制兩個 path 標(biāo)簽。

修改線條的起點(diǎn)坐標(biāo)葵孤。

修改第二條線的線寬為 4担钮。修改第三條線的線寬為 6。保存尤仍。

在瀏覽器中預(yù)覽箫津，三條線厚度不同的黑色線條就繪制好了。

接下來我們學(xué)習(xí) stroke-linecap宰啦， 筆畫線帽屬性苏遥。它定義了一個開放路徑的不同類型的結(jié)束點(diǎn)。它的值是有三個：

butt ([b?t]) 赡模，沒有線帽田炭，也是默認(rèn)屬性。

round ([ra?nd])漓柑，圓形線帽教硫。

square ([skwer])，方形線帽辆布。

回到編輯器瞬矩，在上個 svg 結(jié)尾處添加一個 br 標(biāo)簽⊙枋猓回車換行丧鸯。

添加一個新的 svg 標(biāo)簽，屬性 width 等于 300嫩絮，height 等于 80丛肢。

在 svg 里添加 g 標(biāo)簽，給它定義一個 fill 屬性剿干，值為 none蜂怎。stroke 屬性，值為 black置尔，stroke-width 屬性杠步，值為 6。

在 g 標(biāo)簽里添加 path 標(biāo)簽榜轿，定義屬性 stroke-linecap 等于 butt幽歼，再定義一個 d 屬性，畫一條線谬盐。

復(fù)制兩個 path 標(biāo)簽甸私。

修改線條的起點(diǎn)坐標(biāo)。

修改第二條線的線帽屬性為 round飞傀。修改第三條線的線帽屬性為 square皇型。保存诬烹。

在瀏覽器中預(yù)覽，三條線帽不同的黑色線條就繪制好了弃鸦。

接下來我們學(xué)習(xí) stroke-dasharray 屬性绞吁，dasharray，直譯過來就是虛線序列唬格。這個屬性用來創(chuàng)建虛線家破。它的值是一個數(shù)字序列，以此定義虛線的線條與空隙的大小购岗，序列值是個數(shù)字员舵，至少定義兩個值。比如藕畔，"20，20" (直接讀 20 20)庄拇，是這樣的虛線注服；"20, 10, 5, 5 ,5, 10" 是這樣的虛線！

回到編輯器措近，在上個 svg 結(jié)尾處添加一個 br 標(biāo)簽溶弟。回車換行瞭郑。

添加一個新的 svg 標(biāo)簽辜御，屬性 width 等于 300，height 等于 80屈张。

在 svg 里添加 g 標(biāo)簽擒权，給它定義一個 fill 屬性，值為 none阁谆。stroke 屬性碳抄，值為 black，stroke-width 屬性场绿，值為 4剖效。

在 g 標(biāo)簽里添加 path 標(biāo)簽，定義屬性 stroke-dasharray 等于 "5,5" 焰盗，再定義一個 d 屬性璧尸，畫一條線。

復(fù)制兩個 path 標(biāo)簽熬拒。

修改線條的起點(diǎn)坐標(biāo)爷光。

修改第二條線的虛線序列值。修改第三條線的虛線序列值梦湘。保存瞎颗。

在瀏覽器中預(yù)覽件甥，三條不同的虛線就繪制好了。