- 浏览: 282782 次
- 性别:
- 来自: 江西
-
文章分类
最新评论
-
wzxxzw519：
多谢哈哈哈哈哈
eclipse左边导航package explorer自动定位 -
jmq2007：
感谢！
eclipse安装maven插件，处理无Maven Pom editor打开方式问题 -
sswh：
非常感谢！不过一个maven插件的安装就弄得这样麻烦（Ecli ...
eclipse安装maven插件，处理无Maven Pom editor打开方式问题 -
摇曳的风：
谢谢，刚知道。
eclipse左边导航package explorer自动定位 -
张阿三：
不错！
将win7电脑变身WiFi热点，让手机、笔记本共享上网
<html xmlns:v>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
v\:*{behavior:url(#default#VML);}
body,td,th {
font-size: 10pt;
}
-->
</style>
</head>
<body>
<div align="center" style="font-size:30px"><strong>模拟投资试算比较分析</strong>
</div>
<table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="#CCCCCC">
<tr>
<td colspan="4" bgcolor="#B2CDFF"><p><strong>试算过程说明 </strong></p>
<p>※ 基金的历史净值水平是包含了分红再投资的收益； </p>
<p>※ 如果选择日期为非工作日，则选取下一工作日的净值进行测算； </p>
<p>※ 投资净收益＝投资总收益－投资总成本 </p>
<p>※ 投资回报率＝投资净收益/投资总成本； </p>
<p>※ 年化投资回报率是按照复利方式计算的。 </p></td>
</tr>
<tr>
<td colspan="4" bgcolor="#FFFFFF"> </td>
</tr>
<tr>
<td height="12" colspan="4" bgcolor="#4F81BD"><strong style="color:#FFFFFF">投资基金：博时价值增长基金（前端：050001）</strong></td>
</tr>
<tr>
<td height="5" colspan="4" bgcolor="#95B3D7"><strong style="color:#FFFFFF">投资时间段：2007年1月1日 至 2008年12月23日</strong></td>
</tr>
<tr>
<td height="0" bgcolor="#FFFFFF"><div align="right">投资方式</div><div>收益情况</div>
<v:group style="width:100%; height:32px; position:absolute; top: 309px;" coordsize="100,100">
<v:line strokecolor="black" from="0,0" to="100,100"></v:line>
</v:group>
</td>
<td bgcolor="#FFFFFF">一次性投资</td>
<td bgcolor="#FFFFFF">定期定额投资</td>
<td height="-2" bgcolor="#FFFFFF">定期不定额投资</td>
</tr>
<tr>
<td height="1" bgcolor="#FFFFFF"> </td>
<td bgcolor="#FFFFFF"> </td>
<td bgcolor="#FFFFFF"> </td>
<td height="-1" bgcolor="#FFFFFF"> </td>
</tr>
<tr>
<td height="3" bgcolor="#FFFFFF"> </td>
<td bgcolor="#FFFFFF"> </td>
<td bgcolor="#FFFFFF"> </td>
<td height="-1" bgcolor="#FFFFFF"> </td>
</tr>
</table>
</body>
</html>
解析：
1. xmlns 全称就是XML NameSpace 也就是命名空间。
2. Behavior(行为)也是IE5.0新推出的东西，它的功能非常强大，结合样式表，可以给任何HTML对象增加行为（新的属性、方法、事件），而在这里，它的用处是把命名空间“v”和系统预定义的行为VML连接。这样定义以后，你就可以使用下面的标记了，和普通的HTML标记有所区别，每个标记都增加了一个命名空间。
3. position 属性把元素放置到一个静态的、相对的、绝对的、或固定的位置中。Object.style.position=static|relative|absolute|fixed
可能的值
值 描述
static 默认。位置设置为 static 的元素，它始终会处于页面流给予的位置（static 元素会忽略任何 top、bottom、left 或 right 声明）。
relative 位置被设置为 relative 的元素，可将其移至相对于其正常位置的地方，因此 "left:20" 会将元素移至元素正常位置左边 20 个像素的位置。
absolute 位置设置为 absolute 的元素，可定位于相对于包含它的元素的指定坐标。此元素的位置可通过 "left"、"top"、"right" 以及 "bottom" 属性来规定。
fixed 位置被设置为 fixed 的元素，可定位于相对于浏览器窗口的指定坐标。此元素的位置可通过 "left"、"top"、"right" 以及"bottom" 属性来规定。不论窗口滚动与否，元素都会留在那个位置。工作于 IE7（strict 模式）。
其原理是引进vml进行画图，下面一些vml例子
注：其中所有的left:top:都是针对图左上角的，比如圆，他的左上角应该是以圆为中心的矩形的左上角
1.line(直线)
a.示例：
Html代码
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一条从(0,0)到(200,200)的红色的边框为2px的直线</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:line strokecolor="red" strokeweight="2" style="z-index:5;position:absolute;left:233;top:150" from="0,0" to="200,200"/>
</body>
</html>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一条从(0,0)到(200,200)的红色的边框为2px的直线</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:line strokecolor="red" strokeweight="2" style="z-index:5;position:absolute;left:233;top:150" from="0,0" to="200,200"/>
</body>
</html>
b.专用属性：from 起点坐标； to 终点坐标
2.Oval(圆)
a.示例：
Html代码
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个宽400高400边框为红色填充为绿色的圆</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:Oval strokecolor='red' fillcolor='green' style='width:400;height:400'/>
</body>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个宽400高400边框为红色填充为绿色的圆</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:Oval strokecolor='red' fillcolor='green' style='width:400;height:400'/>
</body>
</html>
b.专用属性：无
c.其他说明：其高宽主要由style中的width和height决定
3.rect(矩形)
a.示例：
Html代码
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个宽100高100的矩形</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:rect style="position:absolute;z-index:1;left:320px;top:150px;width:100;height:100;"/>
</body>
</html>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个宽100高100的矩形</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:rect style="position:absolute;z-index:1;left:320px;top:150px;width:100;height:100;"/>
</body>
</html>
b.专用属性：无
c.其他说明：其高宽主要由style中的width和height决定
4.roundrect(圆角矩形)
a.示例：
Html代码
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个圆角矩形</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:roundrect style="position:absolute;z-index:1;left:220;width:100;top:100;height:100" fillcolor="red" strokecolor="red" strokeweight="1px" arcsize="0.15"/>
</body>
</html>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个圆角矩形</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:roundrect style="position:absolute;z-index:1;left:220;width:100;top:100;height:100" fillcolor="red" strokecolor="red" strokeweight="1px" arcsize="0.15"/>
</body>
</html>
b.专用属性：arcsize 描述圆矩形四角的弧度值，0-0.5，默认值0.05
c.其他说明：其高宽主要由style中的width和height决定
5.arc(圆弧)
a.示例：
Html代码
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个圆弧</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:arc style="z-index:1;left:110;width:100;position:absolute;top:10;height:100" startangle="-180" endangle="0"/>
</body>
</html>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个圆弧</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:arc style="z-index:1;left:110;width:100;position:absolute;top:10;height:100" startangle="-180" endangle="0"/>
</body>
</html>
b.专用属性：startangle 圆弧的起点缺口，取值范围-360-360，默认值-180；
endangle 圆弧的终点缺口，取值范围-360-360，默认值null(0)
c.其他说明：其高宽主要由style中的width和height决定
6.polyline(多边形)
a.示例：
Html代码
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个多边形</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:polyline style="z-index:1;left:71;position:absolute;top:225" points="0,0,30,-40,100,100,0,0" filled="t" fillcolor="white"/>
</body>
</html>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一个多边形</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:polyline style="z-index:1;left:71;position:absolute;top:225" points="0,0,30,-40,100,100,0,0" filled="t" fillcolor="white"/>
</body>
</html>
b.专用属性：points 各折点坐标，上例表示(0,0)、(30,-40)、(100,100)、(0,0)四个点
7.curve(曲线)
Html代码
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一条曲线</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:curve style="z-index:1;left:100;position:absolute;top:300" from="0px,0px" to="150px,0px" filled='f' control1="75,150" control2="75,-150"/>
</body>
</html>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建一条曲线</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:curve style="z-index:1;left:100;position:absolute;top:300" from="0px,0px" to="150px,0px" filled='f' control1="75,150" control2="75,-150"/>
</body>
</html>
b.专用属性：from 起点
to 终点
control1 曲线的第一个曲度
control2 曲线的第二个曲度
c.其他说明：control1、control2可用都不用、用一个或用两个都用
8.shape(任意形状)
a.示例：
Html代码
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建任意曲线</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:shape style="width:100;height:100" coordsize="100,100" filled="f" strokecolor="blue" path="m 0,0 l 100,100 e"/>
<v:shape style="width:100;height:100" coordsize="50,50" filled="f" strokecolor="blue" path="m 0,0 l 0,100,100,100,100,0,0,0 e"/>
<v:shape style="width:100;height:100" coordsize="100,100" filled="f" strokecolor="blue" path="m 0,0 l 0,100,100,100,100,0,0,0 e"/>
<v:shape style="width:100;height:100" coordsize="100,100" filled="f" strokecolor="blue" path="m0,0 c130,-90,30,90,150,180 e"/>
<v:shape style="width:100;height:100" coordsize="100,100" filled="f" strokecolor="blue" path="m0,0 c130,-90,30,90,150,180 x e"/>
</body>
</html>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>创建任意曲线</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:shape style="width:100;height:100" coordsize="100,100" filled="f" strokecolor="blue" path="m 0,0 l 100,100 e"/>
<v:shape style="width:100;height:100" coordsize="50,50" filled="f" strokecolor="blue" path="m 0,0 l 0,100,100,100,100,0,0,0 e"/>
<v:shape style="width:100;height:100" coordsize="100,100" filled="f" strokecolor="blue" path="m 0,0 l 0,100,100,100,100,0,0,0 e"/>
<v:shape style="width:100;height:100" coordsize="100,100" filled="f" strokecolor="blue" path="m0,0 c130,-90,30,90,150,180 e"/>
<v:shape style="width:100;height:100" coordsize="100,100" filled="f" strokecolor="blue" path="m0,0 c130,-90,30,90,150,180 x e"/>
</body>
</html>
b.专用属性：path 路径(m 起点、 l 画直线、 c 画曲线、x 曲线自动闭合、 e 结束)
coordsize 比例(实际宽:width*100/coordsize第一个值；实际高:height*100/coordsize第二个值)
type 引用模板的名称
9.shapetype(模板)
a.示例：
Html代码
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>模板使用示例</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:ShapeType id="m1" coordsize="1000 1000" fillcolor="yellow">
<v:Path v="m0,0 l30,-30,60,0,0,0 e"/>
</v:ShapeType>
<v:Shape style="z-index:1;left:271;width:1000;position:absolute;top:225;height:1000" type="#m1"/>
<v:Shape style="z-index:1;left:371;width:2600;position:absolute;top:225;height:4600" type="#m1"/>
<v:Shape style="z-index:1;left:271;width:1000;position:absolute;top:300;height:1000" type="#m1" fillcolor="red"/>
</body>
</html>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>模板使用示例</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:ShapeType id="m1" coordsize="1000 1000" fillcolor="yellow">
<v:Path v="m0,0 l30,-30,60,0,0,0 e"/>
</v:ShapeType>
<v:Shape style="z-index:1;left:271;width:1000;position:absolute;top:225;height:1000" type="#m1"/>
<v:Shape style="z-index:1;left:371;width:2600;position:absolute;top:225;height:4600" type="#m1"/>
<v:Shape style="z-index:1;left:271;width:1000;position:absolute;top:300;height:1000" type="#m1" fillcolor="red"/>
</body>
</html>
b.其他说明：shapetype是专门用来定义形状摸版的（不可见），而后在由shape标记引用、将模版实例化的按照path子属性值输出多边形（可见）。
10.background(背景)
a.示例：
Html代码
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>背景示例</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:background fillcolor="white">
<v:fill angle=50 type='gradient' color2="yellow"/>
</v:background>
</body>
</html>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>背景示例</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:background fillcolor="white">
<v:fill angle=50 type='gradient' color2="yellow"/>
</v:background>
</body>
</html>
11.group(容器)
a.示例：
Html代码
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>容器示例</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:group id="group1" style='position:absolute;left:0;top:0;z-index:1;width:100;height:100' coordsize="100,100">
<v:oval style="left:100;top:100;width:50;height:50" fillcolor="white"/>
<v:rect style="left:200;top:100;width:50;height:50" fillcolor="yellow"/>
<v:rect style="left:100;top:200;width:80;height:80" fillcolor="red"/>
<v:arc style="left:200;top:200;width:80;height:80" startangle="360" endangle="167" fillcolor="blue"/>
</v:group>
<v:group id="group2" style='position:absolute;left:100;top:100;z-index:1;width:100;height:100' coordsize="100,100">
<v:oval style="left:100;top:100;width:50;height:50" fillcolor="white"/>
<v:rect style="left:200;top:100;width:50;height:50" fillcolor="yellow"/>
<v:rect style="left:100;top:200;width:80;height:80" fillcolor="red"/>
<v:arc style="left:200;top:200;width:80;height:80" startangle="360" endangle="167" fillcolor="blue"/>
</v:group>
<v:group id="group3" style='position:absolute;left:100;top:100;z-index:1;width:200;height:200' coordsize="100,100">
<v:oval style="left:100;top:100;width:50;height:50" fillcolor="white"/>
<v:rect style="left:200;top:100;width:50;height:50" fillcolor="yellow"/>
<v:rect style="left:100;top:200;width:80;height:80" fillcolor="red"/>
<v:arc style="left:200;top:200;width:80;height:80" startangle="360" endangle="167" fillcolor="blue"/>
</v:group>
</body>
</html>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>容器示例</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:group id="group1" style='position:absolute;left:0;top:0;z-index:1;width:100;height:100' coordsize="100,100">
<v:oval style="left:100;top:100;width:50;height:50" fillcolor="white"/>
<v:rect style="left:200;top:100;width:50;height:50" fillcolor="yellow"/>
<v:rect style="left:100;top:200;width:80;height:80" fillcolor="red"/>
<v:arc style="left:200;top:200;width:80;height:80" startangle="360" endangle="167" fillcolor="blue"/>
</v:group>
<v:group id="group2" style='position:absolute;left:100;top:100;z-index:1;width:100;height:100' coordsize="100,100">
<v:oval style="left:100;top:100;width:50;height:50" fillcolor="white"/>
<v:rect style="left:200;top:100;width:50;height:50" fillcolor="yellow"/>
<v:rect style="left:100;top:200;width:80;height:80" fillcolor="red"/>
<v:arc style="left:200;top:200;width:80;height:80" startangle="360" endangle="167" fillcolor="blue"/>
</v:group>
<v:group id="group3" style='position:absolute;left:100;top:100;z-index:1;width:200;height:200' coordsize="100,100">
<v:oval style="left:100;top:100;width:50;height:50" fillcolor="white"/>
<v:rect style="left:200;top:100;width:50;height:50" fillcolor="yellow"/>
<v:rect style="left:100;top:200;width:80;height:80" fillcolor="red"/>
<v:arc style="left:200;top:200;width:80;height:80" startangle="360" endangle="167" fillcolor="blue"/>
</v:group>
</body>
</html>
b.其他说明：当使用group后，容器内图形的left、top、width、height等值都是相对group的值。
五、二级标记
二级标记可以看作是对有限的属性进行扩展，就像CSS和HTML的关系一样，利用它我们可以做出更漂亮的图画出来，如上边background(背景)中就使用了fill二级标记，下边我们再来看下如何利用二级标记画一条带箭头的直线：
Html代码
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>二级标记示例</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:line style="z-index:5;position:absolute;left:200;top:200" to="0,150" strokecolor="red" strokeweight="10px">
<v:Stroke dashstyle="shortdot" endarrow='classic'/>
</v:line>
</body>
</html>
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<title>二级标记示例</title>
<style>
v\:* { behavior: url(#default#VML);}
</style>
</head>
<body>
<v:line style="z-index:5;position:absolute;left:200;top:200" to="0,150" strokecolor="red" strokeweight="10px">
<v:Stroke dashstyle="shortdot" endarrow='classic'/>
</v:line>
</body>
</html>
例子中的stroke即为二级标记，它可以用来设置边框样式，除此之外还有shadow(阴影)、fill(填充)、extrusion(立体3D)、 textbox、imagedata(背景图片)等二级标记。
二级标记也有自己的属性，我们只须通过设置这些属性就能画出各种漂亮的图来。二级标记的使用也非常简单，直接嵌套于图形标签中即可。
发表评论
-
http status 汇总
2013-06-19 16:23 650http含义： http 200:-文件被正常的访问 ... -
取WebApplicationContext方法集
2012-11-14 16:10 1019通过xml配置文件 bean配置在xml里面，s ... -
Request、Session、servletContext区别
2012-11-14 16:07 924就servlet规范本身，servle ... -
ServletContext与ApplicationContext
2012-11-14 16:04 1300ServletContext,即Servlet环境 ... -
HttpSessionListener进行同名用户剔除登录的方法
2012-07-24 10:33 744实现原理，利用HttpSessionListener的监视监听 ... -
ServletContextListener的用法
2012-07-24 10:24 674这个J2EE小提示阐述了ServletContextLis ... -
文本框Input Text文本垂直居中（line-height）
2012-06-27 17:06 1065http://hi.baidu.com/zhouqicf ... -
getRequestURI,getRequestURL的区别
2012-02-06 10:54 790test1.jsp====================== ... -
request.getSession(false)和request.getSession(true)区别
2011-07-29 12:11 1548request.getSession(false)和reque ... -
JSTL EL 详解
2011-07-13 16:17 844网址1 http://hi.baidu.com/mailluz ...
相关推荐
开发Web项目过程中会遇到在table中画斜线的情况. 例如: 成绩和学员之间在一个td中, 需要用斜线来隔开. 自己下载试试吧
table 圆角 html5 css3
table表格，这个东西大家肯定都不陌生，代码中我们时常都能碰到，那么给table加一个斜线的表头有时是很有必要的，但是到底该怎么实现这种效果呢？
iOS开发
用<TABLE>语句来实现圆角表格可以省去制作圆角图片之苦！
使用jquery绘制表格斜线，表格头斜线，无需使用图片。
用css控制的无图片圆角table div#nifty{ margin: 0 10%;background: #9BD1FA} p {padding:10px}
JAVA WEB 开发 table 圆角效果。美观大方 下载后直接打开 即可看到效果
实现功能点 1.行的合并 2.列的合并 3.给表头添加斜线 4.动态生成列
Android仿IOS的圆角设置界面 直接可用 单选多选等ATable Demo iOS风格设置
1.样式一 圆角表格代码如下： <TABLE style="TABLE-LAYOUT: fixed" height=28 cellSpacing=0 cellPadding=0 width="45%" border=0> <TBODY>
corner table sample share for second develop
js 实现 表格的斜线! 值得下载看看!资源免费,大家分享!!
用js作表格的表头斜线 用js作表格的表头斜线
CSS控制table表头
iText7 原生方法制作带斜线表格
仿IOS的圆角设置界面。直接可用，单选多选等ATable_Demo(iOS风格设置).7z
仿IOS的圆角设置界面。直接可用，单选多选等ATable_Demo(iOS风格设置) [注：本内容来自网络，在此分享仅为帮助有需要的网友，如果侵犯了您的权利，麻烦联系我，我会第一时间删除，谢谢您。]
圆角问题 ，很久前是很麻烦的事情，用过图片等等，现在好了，很简单就可以为div table 加上个圆角
<TABLE fixed" height=28 cellSpacing=0 cellPadding=0 width="100%" border=0> <TR height=3 width="100%"> <TD> <TABLE fixed" height=3 cellSpacing=0 cellPadding=0 width="100%" border=0> ...