2015-06-25 90 views
1

這是我的html文件:使用外部CSS樣式表樣式SVG線

<!DOCTYPE html> 
<html xmlns = "http://www.TedTheSpeedlearner.com" 
     xmlns:xsi = "http://www.w3.org/2001/XMLSchema-instance" 
     xsi:schemaLocation = "http://www.TedTheSpeedlearner.com SVG_Red_Circle.xsd"> 
<head> 
<title>SVG Line</title> 
<link rel = "stylesheet" type = "text/css" href = "SVG_Lines.css"> 
</link> 
</head> 
<body> 
<svg id = "Image_Box"> 
<line id = "My_Line"> 
</line> 
</svg> 
</body> 
</html> 

這是我的CSS文件:

#Image_Box { 
height: 500px; 
width: 800px;} 
#My_Line { 
x1: 100px; 
y1: 40px; 
x2: 200px; 
y2: 90px; 
stroke: red; 
stroke-width: 3;} 

當我在谷歌瀏覽器打開我的html文件中,行不出現。我不知道爲什麼。你能幫助我嗎?

回答

1

x1, x2, y1, y2不是CSS元素,而是<line>元素的屬性。

另外,您應該將line標籤放在svg標籤內。

<svg id = "Image_Box"> 
    <line id = "My_Line" x1="0" y1="0" x2="200" y2="200" /> 
</svg>