?? step4.html
字號:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>Thinking in VML</title>
</head>
<STYLE>
v\:* { BEHAVIOR: url(#default#VML) }
</STYLE>
<LINK REL="stylesheet" TYPE="text/css" HREF="style.css" />
<body>
<table align="center">
<tr>
<td align="center" class="title"><strong>Rect,RoundRect(矩形)對象</strong></td>
</tr>
<tr>
<td >
<div class="memo" style="width:700;line-height:23px">
用VML畫矩形,必須設置 style="width:50;height:50",其他就沒有什么特別的。在這節,順便講講 shadow 對象和 TextBox對象:<br>
<v:Rect style="position:relative;<font color=red>width:100;height:50px</font>"/><br>
<center><v:Rect style="position:relative;width:100;height:50px"/></center>
RoundRect顧名思義,是圓角的矩形,這種形狀在畫流程圖的時候很常用,如果加上陰影,就更好看了:<br>
<v:RoundRect style="position:relative;width:100;height:50px"><br>
<v:shadow <font color=red>on="T" type="single" color="#b3b3b3" offset="5px,5px"</font>/><br>
</v:RoundRect>
<center><v:RoundRect style="position:relative;width:100;height:50px">
<v:shadow on="T" type="single" color="#b3b3b3" offset="5px,5px"/>
</v:RoundRect></center><br>
在VML里面,True 和 False 可以簡寫成 T 和 F。Shadow 中的 offset 屬性用來設置 偏移原圖的 x,y 值。 on 屬性用來決定是否顯示陰影。在矩形中寫字,
要用到 TextBox 對象。TextBox 比較關鍵的屬性是 inset(left,top,right,bottom),意思是隔圖形邊的上下左右多少范圍內定位文字:<br>
<v:RoundRect style="position:relative;width:120;height:50px"><br>
<v:shadow on="T" type="single" color="#b3b3b3" offset="5px,5px"/><br>
<v:TextBox <font color=red>inset="5pt,5pt,5pt,5pt"</font> style="font-size:10.2pt;">Hello world!</v:TextBox><br>
</v:RoundRect>
<center><v:RoundRect style="position:relative;width:120;height:50px">
<v:shadow on="T" type="single" color="#b3b3b3" offset="5px,5px"/>
<v:TextBox inset="2pt,5pt,2pt,5pt" style="font-size:10.2pt;">Hello world!</v:TextBox>
</v:RoundRect></center><br>
當然你也可以直接插入HTML代碼,比如說插入一個<br><Div style="padding-top:5px;padding-left:5px;padding-right:5px;padding-bottom:5px">Hello World!</Div><br>效果是一樣的。
</div>
</td>
</tr>
<tr>
<td class="title">
<p align="right"><a href="javascript:self.scrollTo(0,0)">Top</a></p>
<a href="index.html">返回目錄</a><br>
上一節:<a href="step3.html">Line,Polyline(線)對象</a><br>
下一節:<a href="step5.html">Oval(圓)對象</a>
</td>
</tr>
</table>
</body>
</html>
?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -