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

CSS样式表
网页制作实例:em实现倒三角的提示效果
CSS实例教程:Border属性制作小三角
网页制作教程:css让页面居中对齐
CSS实例教程:IE6奇数宽度或高度的bug
CSS实例教程:分号引起页面混乱
ie6和ie7下链接图片点不中问题讨论
XHTML+CSS教程:灵活运用HTML标记
12个对网页设计师非常有用的图片优化工具
如何对CSS Expression进行优化
合理利用HTML标记优化网页布局
纯语义化XHTML+CSS设计表单方法
CSS3.0参考手册下载(Webjx推荐)
CSS代码解决网页挂马问题
CSS网页布局时常犯的10个小错误
全面兼容ie6,ie7,ie8,ff的最简单的css写法
CSS网页布局开发时的常见问题小结
ie6和ie7中的链接图片点不中问题讨论
CSS 分号引起页面混乱
网页制作 css让页面居中对齐
CSS first-letter伪类元素的特点

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 224 ::
收藏到网摘: 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>