当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > ShapeType给VML制作模版

CSS样式表
CSS中的text-shadow属性
利用CSS3特性和浏览器中的工具进行网页设计
使用CSS3将你的网站设计推向未来
网页设计师福音:CSS网格布局生成器
CSS教程:汇总让IE6崩溃的几种方法
CSS教程:快速提升设计可读性和维护性
HTML5和CSS3给网站设计带来出色效果
CSS选择器大全
TypeSelect实现网页嵌入字体
CSS样式表尽量放到网页头部
CSS3的优势以及网页设计师如何使用CSS3技术
CSS样式表中引用图片地址在各浏览器中的差异
5种给CSS样式表瘦身减肥的方法
英文教程:50个网页制作中应用的CSS技巧
用CSS3将你的设计带入下个高度
CSS教程:新的图像替换方法
创造100%功能自适应css布局的行之有效的方法
轻松搞定IE的CSS制作网页技巧3则
网页设计应该熟知的CSS 3.0技术
制作网页常用的50种CSS工具

CSS样式表 中的 ShapeType给VML制作模版


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

VML的这个功能很有用,模版,顾名思义,它可以减少书写代码的量,又使的代码可读性提高。在理解VML模版的时候,可以和 HTML 的 CSS 一样理解,它是定义好的一种形状,下次使用的时候直接声明 type 属性就可以了。看看下面的例子:
<v:shapetype id="arrowUP" coordsize="6 6"> <!--三角形 向上-->
<v:path v="m 3,0 l 0,6,6,6,3,0 x e" />
</v:shapetype>
<v:shapetype id="arrowDown" coordsize="6 6"> <!--三角形 向下-->
<v:path v="m 0,0 l 3,6,6,0,0,0 x e" />
</v:shapetype>
定义好上面的模版后,以后就可以直接调用了:
<v:shape type="#arrowUP" style="position:relative;width:50;height:50"/>
<v:shape type="#arrowDown" style="position:relative;width:50;height:50"/>
<v:shape fillcolor=blue type="#arrowDown" style="position:relative;width:80;height:80" />
不知道大家有没有注意到,VML里面对“,”使用不强制的,你可以使用 coordsize="6,6" 也可以使用 coordsize="6 6" ,效果是一样的。