Rect,RoundRect(矩形)對(duì)象
更新時(shí)間:2006年12月24日 00:00:00 作者:
用VML畫矩形,必須設(shè)置 style="width:50;height:50",其他就沒有什么特別的。在這節(jié),順便講講 shadow 對(duì)象和 TextBox對(duì)象:
<v:Rect style="position:relative;width:100;height:50px"/>
RoundRect顧名思義,是圓角的矩形,這種形狀在畫流程圖的時(shí)候很常用,如果加上陰影,就更好看了:
<v:RoundRect style="position:relative;width:100;height:50px">
<v:shadow on="T" type="single" color="#b3b3b3" offset="5px,5px"/>
</v:RoundRect>
在VML里面,True 和 False 可以簡寫成 T 和 F。Shadow 中的 offset 屬性用來設(shè)置 偏移原圖的 x,y 值。 on 屬性用來決定是否顯示陰影。在矩形中寫字,要用到 TextBox 對(duì)象。TextBox 比較關(guān)鍵的屬性是 inset(left,top,right,bottom),意思是隔圖形邊的上下左右多少范圍內(nèi)定位文字:
<v:RoundRect style="position:relative;width:120;height:50px">
<v:shadow on="T" type="single" color="#b3b3b3" offset="5px,5px"/>
<v:TextBox inset="5pt,5pt,5pt,5pt" style="font-size:10.2pt;">Hello world!</v:TextBox>
</v:RoundRect>Hello world!
當(dāng)然你也可以直接插入HTML代碼,比如說插入一個(gè)
<Div style="padding-top:5px;padding-left:5px;padding-right:5px;padding-bottom:5px">Hello World!</Div>
效果是一樣的。
<v:Rect style="position:relative;width:100;height:50px"/>
<v:RoundRect style="position:relative;width:100;height:50px">
<v:shadow on="T" type="single" color="#b3b3b3" offset="5px,5px"/>
</v:RoundRect>
在VML里面,True 和 False 可以簡寫成 T 和 F。Shadow 中的 offset 屬性用來設(shè)置 偏移原圖的 x,y 值。 on 屬性用來決定是否顯示陰影。在矩形中寫字,要用到 TextBox 對(duì)象。TextBox 比較關(guān)鍵的屬性是 inset(left,top,right,bottom),意思是隔圖形邊的上下左右多少范圍內(nèi)定位文字:
<v:RoundRect style="position:relative;width:120;height:50px">
<v:shadow on="T" type="single" color="#b3b3b3" offset="5px,5px"/>
<v:TextBox inset="5pt,5pt,5pt,5pt" style="font-size:10.2pt;">Hello world!</v:TextBox>
</v:RoundRect>
當(dāng)然你也可以直接插入HTML代碼,比如說插入一個(gè)
<Div style="padding-top:5px;padding-left:5px;padding-right:5px;padding-bottom:5px">Hello World!</Div>
效果是一樣的。
相關(guān)文章
建立WEB兩大經(jīng)典!《VML極道教程》+FlashVml(閃耀之星)3.0中/英文版聯(lián)合發(fā)布!
建立WEB兩大經(jīng)典!《VML極道教程》+FlashVml(閃耀之星)3.0中/英文版聯(lián)合發(fā)布!...2006-12-12