当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > Line,Polyline(线)对象

CSS样式表
CSS Expression 优化
CSS 网页布局时常犯的10个小错误整理
CSS代码 解决网页挂马问题
CSS去除表格的默认间距并且制作1px的细线表
CSS的私有属性小结(针对FireFox浏览器)
CSS网页设计中的解决方案
Firefox和IE通用的三则网站重构实用技巧
CSS解决文字环绕图片问题
CSS教程:可扩展圆角标签的实现方法
CSS教程:水平对齐(text-align)
写给刚刚接触web标准的新人们
CSS教程:盒模型(BOX Model)
CSS教程:CSS中的定位(position)
Web标准真的是标准吗?
从四个方面谈谈Web标准的价值所在
CSS教程:网页表单设计技巧
CSS Hack整理
CSS教程:网页文本渐变
CSS教程:用dl dt dd来制作列表
CSS入门教程:计算CSS盒模型宽和高

CSS样式表 中的 Line,Polyline(线)对象


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 228 ::
收藏到网摘: n/a

Line是做图中最常用的,它有两个特殊的属性 from 和 to ,就是起始点和终止点坐标。
<v:line from="0,0" to="100,50" style="position:relative;"/>

●如果要改变线的样式,LineStyle (Stroke)属性可以做到:
Single(默认),ThinThinThinThickThickBetweenThin
●如果要改变线的类型,可以用 DashStyle(Stroke)属性:
<v:line style="position:relative" from="0,0" to="100,0" >
<v:stroke dashstyle="Dot"/>
</v:line>
Solid(默认):见上图
ShortDash:
ShortDot:
ShortDashDot:
ShortDashDotDot:
Dot:
Dash:
LongDash:
DashDot:
LongDashDot:
LongDashDotDot:
●在画坐标的时候,需要箭头,VML已经定义好了箭头,在Stroke体现:EndArrow 和 StartArrow 属性,一个是线开始的时候有箭头,另一个是线结束的时候有箭头。箭头的样式也有不少:
<v:line style="position:relative" from="0,0" to="100,0" >
<v:stroke EndArrow="Classic"/>
</v:line>
EndArrow="Block":
EndArrow="Classic": (这个看起来还比较舒服)
EndArrow="Diamond":
StartArrow="Oval":
StartArrow="Open":

PolyLine是 Line 的变形,是不规则的连续的线。它有个特殊的属性 Points ,用来设置每个点的坐标。例如:
<v:PolyLine filled="false" Points="0,0 0,100 20,150 200,100" style="position:relative"/>

一样可以设置它的线的样式和类型以及箭头 ( IE5.0中,PolyLine不支持 Arrow )
<v:PolyLine filled="false" Points="0,0 0,100 20,150 200,100" style="position:relative"/>
<v:stroke StartArrow="Oval" EndArrow="Classic" dashstyle="Dot" />
</v:PolyLine>