<?xml version="1.0" encoding="utf-8" ?>



<feed version="0.3" xmlns="http://purl.org/atom/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xml:lang="zh_CN">
<title><![CDATA[技术收藏]]></title>
<link rel="alternate" type="text/html" href="http://loveingling.blog.bokee.net"/>
<modified>2008-12-16T16-39-15 CST</modified>
<tagline type="text/html" mode="escaped"><![CDATA[软件开发收集]]></tagline>
<generator url="http://www.bokee.net/" version="2.0">bokee.net</generator>
<copyright>Copyright (c) 2005,  loveingling</copyright>


<entry>
<title>OA碰到的问题</title>
<link rel="alternate" type="text/html" href="http://www.bokee.net/blogmodule/weblogcomment_viewEntry/2383347.html"/>
<issued>2008-12-16T16-39-15 CST</issued> 
<created>2008-12-16T16-39-15 CST</created>
<modified>2008-12-16T16-41-17Z</modified>
<id>tag:loveingling.blogchina.com,2005://2383347</id>
<author>
<name>loveingling</name>
<url>http://www.bokee.net/blogmodule/weblogcomment_index/loveingling.html</url>
</author>
<dc:subject>OA资料收录</dc:subject>
<content type="text/html" mode="escaped" xml:lang="zh_CN" xml:base="http://www.bokee.net"> 
<![CDATA[<p>最近需要接手一个OA的系统了,所以特建个栏目,收集项目中遇到的问题.</p>
<p>因为项目需要独立开发一套适合多个行业的流程引擎.</p>]]>
</content>
</entry>

<entry>
<title>sql截取</title>
<link rel="alternate" type="text/html" href="http://www.bokee.net/blogmodule/weblogcomment_viewEntry/1009294.html"/>
<issued>2007-09-04T13-40-25 CST</issued> 
<created>2007-09-04T13-40-25 CST</created>
<modified>2007-09-04T13-40-25Z</modified>
<id>tag:loveingling.blogchina.com,2005://1009294</id>
<author>
<name>loveingling</name>
<url>http://www.bokee.net/blogmodule/weblogcomment_index/loveingling.html</url>
</author>
<dc:subject>sql系列</dc:subject>
<content type="text/html" mode="escaped" xml:lang="zh_CN" xml:base="http://www.bokee.net"> 
<![CDATA[<p>1.截取已知长度的函数</p>
<p><br />&nbsp; A.截取从字符串左边开始N个字符</p>
<p>&nbsp; Declare @S1 varchar(100)<br />&nbsp; Select @S1='http://www.xrss.cn'<br />&nbsp; Select Left(@S1,4)<br />&nbsp; ------------------------------------<br />&nbsp; 显示结果: http </p>
<p><br />&nbsp; B.截取从字符串右边开始N个字符(例如取字符<a href="http://www.163.com">www.163.com</a>)</p>
<p>&nbsp; Declare @S1 varchar(100)<br />&nbsp; Select @S1='http://www.xrss.cn'<br />&nbsp; Select right(@S1,11)&nbsp; <br />&nbsp; ------------------------------------<br />&nbsp; 显示结果: <a href="http://www.163.com">www.163.com</a> </p>
<p><br />&nbsp; C.截取字符串中任意位置及长度(例如取字符www)</p>
<p>&nbsp; Declare @S1 varchar(100)<br />&nbsp; Select @S1='http://www.xrss.cn'<br />&nbsp; Select SUBSTRING(@S1,8,3)&nbsp; <br />&nbsp; ------------------------------------<br />&nbsp; 显示结果: <a href="http://www.163.com">www.163.com</a> <br />&nbsp;<br />&nbsp; 以上例子皆是已知截取位置及长度,下面介绍未知位置的例子</p>
<p>2.截取未知位置的函数</p>
<p><br />&nbsp; A.截取指定字符串后的字符串(例如截取http://后面的字符串)</p>
<p>&nbsp; 方法一:</p>
<p>&nbsp; Declare @S1 varchar(100)<br />&nbsp; Select @S1='http://www.xrss.cn'&nbsp; <br />&nbsp; Select Substring(@S1,CHARINDEX('www',@S1)+1,Len(@S1))<br />&nbsp; /*此处也可以这样写:Select Substring(@S1,CHARINDEX('//',@S1)+2,Len(@S1))*/ <br />&nbsp; ------------------------------------<br />&nbsp; 显示结果: <a href="http://www.163.com">www.163.com</a><br />&nbsp;</p>
<p>&nbsp; 需要注意:CHARINDEX函数搜索字符串时,不区分大小写,因此CHARINDEX('www',@S1)也可以写成CHARINDEX('WWW',@S1)</p>
<p>&nbsp; 方法二:(与方法一类似)</p>
<p>&nbsp; Declare @S1 varchar(100)<br />&nbsp; Select @S1='http://www.xrss.cn'&nbsp; <br />&nbsp; Select Substring(@S1,PATINDEX('%www%',@S1)+1,Len(@S1))<br />&nbsp; --此处也可以这样写:Select Substring(@S1,PATINDEX('%//%',@S1)+2,Len(@S1))<br />&nbsp; ------------------------------------<br />&nbsp; 显示结果: <a href="http://www.163.com">www.163.com</a>&nbsp;&nbsp; </p>
<p><br />&nbsp;&nbsp; 函数PATINDEX与CHARINDEX区别在于:前者可以参数一些参数,增加查询的功能</p>
<p>&nbsp; 方法三:</p>
<p>&nbsp; Declare @S1 varchar(100)<br />&nbsp; Select @S1='http://www.xrss.cn'&nbsp; <br />&nbsp; Select REPLACE(@S1,'http://','')<br />&nbsp; ------------------------------------<br />&nbsp; 显示结果: <a href="http://www.163.com">www.163.com</a> </p>
<p><br />&nbsp; 利用字符替换函数REPLACE,将除需要显示字符串外的字符替换为空</p>
<p>&nbsp; 方法四:</p>
<p>&nbsp; Declare @S1 varchar(100)<br />&nbsp; Select @S1='http://www.xrss.cn'&nbsp; <br />&nbsp; Select STUFF(@S1,CHARINDEX('http://',@S1),Len('http://'),'')<br />&nbsp; ------------------------------------<br />&nbsp; 显示结果: <a href="http://www.163.com">www.163.com</a>&nbsp;&nbsp; </p>
<p>&nbsp; 函数STUFF与REPLACE区别在于:前者可以指定替换范围,而后者则是全部范围内替换</p>
<p>&nbsp; B.截取指定字符后的字符串(例如截取C:\Windows\test.txt中文件名)<br />&nbsp;&nbsp;&nbsp; 与A不同的是,当搜索对象不是一个时,利用上面的方法只能搜索到第一个位置</p>
<p>&nbsp; 方法一:</p>
<p>&nbsp; Declare @S1 varchar(100)<br />&nbsp; Select @S1='C:\Windows\test.txt'<br />&nbsp; select right(@S1,charindex('\',REVERSE(@S1))-1)<br />&nbsp; -------------------------------------<br />&nbsp; 显示结果: text.txt<br />&nbsp;</p>
<p>利用函数REVERSE获取需要截取的字符串长度</p>
<p>&nbsp;</p>]]>
</content>
</entry>

<entry>
<title>sqlServer2000存储过程学习笔记 </title>
<link rel="alternate" type="text/html" href="http://www.bokee.net/blogmodule/weblogcomment_viewEntry/981816.html"/>
<issued>2007-08-24T16-32-13 CST</issued> 
<created>2007-08-24T16-32-13 CST</created>
<modified>2007-08-24T16-31-01Z</modified>
<id>tag:loveingling.blogchina.com,2005://981816</id>
<author>
<name>loveingling</name>
<url>http://www.bokee.net/blogmodule/weblogcomment_index/loveingling.html</url>
</author>
<dc:subject>sql系列</dc:subject>
<content type="text/html" mode="escaped" xml:lang="zh_CN" xml:base="http://www.bokee.net"> 
<![CDATA[<div class="postTitle"><a href="http://blog.csdn.net/gaoyunpeng/archive/2007/03/19/1533629.aspx"><img height="13" src="http://blog.csdn.net/images/authorship.gif" width="15" border="0" alt="" />&nbsp;sqlServer2000存储过程学习笔记</a> </div>
<div class="postText">开始学习存储过程的编写。<br />首先先搞清楚了几个基本的写法，从0开始，嘎嘎：<br />声明一个变量：declare @gao varchar(30)<br />关键字：declare<br />变量名：@gao<br />为啥用@，不知道，就当是必须的啦，先这么记着，将来弄明白了再回来补充<br /><br />赋值：select @gao = convert(varchar,getdate(),111)<br />关键字：select<br />奇怪的用法，干嘛select，不知道还有没有别的方法，也是先这么记着。。。<br />用到一个函数：convert(varchar,getdate(),111)，第一个参数是输出的数据类型，第二个参数是随意合法表达式或函数，第三个是输出的日期格式代号，具体的我已经收录了一个帖子专门说明。<br /><a href="http://blog.csdn.net/gaoyunpeng/archive/2007/03/19/1533594.aspx">http://blog.csdn.net/gaoyunpeng/archive/2007/03/19/1533594.aspx</a><br /><br />输出：print @gao<br />关键字：print<br />这个试了一堆，write、out、output，最后才知道需要用print，嘎嘎<br /><br />完整的运行一下：<br />declare @gao varchar(30)<br />select @gao = convert(varchar,getdate(),111)<br />print @gao<br /><br />输出：<br />2007/03/19<br /><br />呵呵，成功，俺开始入门啦<br /><br />＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝<br /><br />@@TRANCOUNT&nbsp;&nbsp;&nbsp; 用来获得当前执行的事务的数量，为什么用了两个@呢，待学习。。。<br /><br />exec和execute貌似是同样的功能哎～都是用来执行一段SQL语句或者一个存储过程。或者根本就是同 一个东西的两个名字？？<br /><br />＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝<br /><br />看如下一个SQL语句<br />SELECT COUNT(*) FROM msdb.dbo.syscategories WHERE name = N'[Uncategorized (Local)]'<br />这里 N'[Uncategorized (Local)]'&nbsp; 让人很郁闷，因为我不知道那个N是啥～～于是&mdash;&mdash;查！<br />结果：<br /><span style="BACKGROUND-COLOR: rgb(153,204,255)">必须在处理使用 Unicode 字符串常量在 SQLServer 时 SQLServer 联机图书主题 &quot; 使用 Unicode 数据 &quot; 中所述之前所有 Unicode 字符串以大写字母 N。 &quot; N &quot; 前缀代表 SQL-92 标准, 中有关 National 语言， 必须大写。 如果您执行不前缀 Unicode 字符串常量使用 N, SQLServer 会将其到当前数据库的非Unicode 代码页之前使用字符串。</span><br />以上文字为微软的帮助主页上写的概要解释，翻译很难受，不过人家声明了是机器自动翻译的，不过足以说明问题，那个N表示的就是<span style="BACKGROUND-COLOR: rgb(255,255,255)">Unicode 字符串～，完毕。<br /><br />============================================<br /><br /></span><span style="BACKGROUND-COLOR: rgb(255,255,255)">RAISERROR函数<br />到处找资料，发现没有，最后在MSDN上找到了，后来一想，也是，人家自己的东西肯定有帮助文档的，既然有帮助文档，别人再写就显得多余了，哈。那篇帮助我已经转载了，写的挺多，不过一般的使用是不用那么罗唆的，于是就记录一个常用版本的，代码如下：<br /></span><span style="BACKGROUND-COLOR: rgb(255,255,255)">RAISERROR('错误！该卷烟库存小于等于0，不能销售。',16,1)<br />解释：<br />第一个参数：错误信息，可以是直接写一个字符串，也可以传入一个字符串变量，还可以写上错误代号，似乎需要大于50000（不知道为什么选了这么大一个数字），如果用户选择的是直接写入错误信息，那么这个代号将默认为50000；以上三种可以作为参数的形式只能选择一个，即直接值或变量或代号。<br />第二个参数：错误严重程度，数值为0到25，其中20－25被视为致命错误（就是特严重啦～），需要一定权限的用户才可以发出那种错误信息，还需要加别的参数，太罗唆，再说我们平时用不到那些啦，所以就随便选个号码吧，十几就可以（这里不知道是否需要严格选择一个号码，等弄明白再来补充），如果指定的号码小于0，将取0值。<br />第三个参数：</span>
<p style="BACKGROUND-COLOR: rgb(153,204,255)"><a name="sectionToggle0">介于 1 至 127 之间的任意整数。state 的负值默认为 1。值为 0 或大于 127 会生成错误。</a></p>
<a style="BACKGROUND-COLOR: rgb(153,204,255)" name="sectionToggle0"></a>
<p style="BACKGROUND-COLOR: rgb(153,204,255)"><a name="sectionToggle0">如果在多个位置引发相同的用户定义错误，则针对每个位置使用唯一的状态号有助于找到引发错误的代码段。</a></p>
<p style="BACKGROUND-COLOR: rgb(255,255,255)"><a name="sectionToggle0">以上是MSDN上的话，说的蛮干净利落，就直接引用了</a></p>
<p style="BACKGROUND-COLOR: rgb(255,255,255)"><a name="sectionToggle0">执行效果：</a></p>
<p style="BACKGROUND-COLOR: rgb(255,255,255)"><a name="sectionToggle0">RAISERROR('错误！该卷烟库存小于等于0，不能销售。',16,1)<br />执行后显示：<br /><span style="COLOR: rgb(255,0,0)">Server: Msg 50000, Level 16, State 1, Line 7</span><br />错误！该卷烟库存小于等于0，不能销售。</a></p>
<p style="BACKGROUND-COLOR: rgb(255,255,255)"><a name="sectionToggle0">完毕。</a></p>
</div>]]>
</content>
</entry>

<entry>
<title>dotnet下生成简单sql语句</title>
<link rel="alternate" type="text/html" href="http://www.bokee.net/blogmodule/weblogcomment_viewEntry/981790.html"/>
<issued>2007-08-24T16-26-40 CST</issued> 
<created>2007-08-24T16-26-40 CST</created>
<modified>2007-08-24T16-26-39Z</modified>
<id>tag:loveingling.blogchina.com,2005://981790</id>
<author>
<name>loveingling</name>
<url>http://www.bokee.net/blogmodule/weblogcomment_index/loveingling.html</url>
</author>
<dc:subject>Default Cloumn</dc:subject>
<content type="text/html" mode="escaped" xml:lang="zh_CN" xml:base="http://www.bokee.net"> 
<![CDATA[&nbsp;static public void insert_sql(string tablename,Hashtable param_employeefield,string connstring) <br />&nbsp;&nbsp; { <br />&nbsp;&nbsp; //System.Web.HttpContext.Current.Response.Write(&quot;xxx&quot;); <br />&nbsp;&nbsp; Hashtable ht_field=new Hashtable(); <br />&nbsp;&nbsp; ht_field=getfieldtype(tablename,connstring); //表的字段 <br />&nbsp;&nbsp; string field_value; <br />&nbsp;&nbsp; string field_type;//字段类型 <br />&nbsp;&nbsp; string str_sql_fieldname=&quot;insert into &quot; + &quot;tablename(&quot;; //插入语句 <br />&nbsp;&nbsp; string str_sql_fieldvalue=&quot; values(&quot;; <br />&nbsp;&nbsp; string str_sql; <br />&nbsp;&nbsp; foreach(object obj_param in param_employeefield) <br />&nbsp;&nbsp; { <br />&nbsp;&nbsp; field_type=ht_field[obj_param.ToString()].ToString();//获取 int型 or varchar型等等 <br />&nbsp;&nbsp; field_value=param_employeefield[obj_param].ToString(); <br />&nbsp;&nbsp; str_sql_fieldname+=param_employeefield[obj_param].ToString()+&quot;,&quot;; <br />&nbsp;&nbsp; str_sql_fieldvalue+=judgetype(field_type,field_value)+&quot;,&quot;; <br />&nbsp;&nbsp; } <br />&nbsp;&nbsp; <br />&nbsp;&nbsp; str_sql_fieldname=str_sql_fieldname.Substring(1,str_sql_fieldname.Length)+&quot;)&quot;; <br />&nbsp;&nbsp; str_sql_fieldvalue=str_sql_fieldvalue.Substring(1,str_sql_fieldvalue.Length)+&quot;)&quot;; <br />&nbsp;&nbsp; str_sql=str_sql_fieldname+str_sql_fieldvalue; <br />&nbsp;&nbsp; nsn.core.SqlHelper.ExecuteNonQuery(connstring,CommandType.Text,str_sql); <br />&nbsp;&nbsp; } <br />&nbsp;&nbsp; <br />&nbsp;&nbsp; static public void update_sql(string tablename,Hashtable param_employeefield,string connstring) <br />&nbsp;&nbsp; { <br />&nbsp;&nbsp; Hashtable ht_field=new Hashtable(); <br />&nbsp;&nbsp; ht_field=getfieldtype(tablename,connstring); <br />&nbsp;&nbsp; string field_value; <br />&nbsp;&nbsp; string field_type; <br />&nbsp;&nbsp; StringBuilder str_sql = new StringBuilder(); <br />&nbsp;&nbsp; str_sql.Append(&quot;update &quot; + &quot;tablename set &quot;); <br />&nbsp;&nbsp; string sql1; <br />&nbsp;&nbsp; foreach(object obj_param in param_employeefield) <br />&nbsp;&nbsp; { <br />&nbsp;&nbsp; field_type=ht_field[obj_param.ToString()].ToString(); <br />&nbsp;&nbsp; field_value=param_employeefield[obj_param].ToString(); <br />&nbsp;&nbsp; str_sql.Append(param_employeefield[obj_param].ToString()+&quot;=&quot;+judgetype(field_type,field_value)+&quot;,&quot;); <br />&nbsp;&nbsp; } <br />&nbsp;&nbsp; sql1=str_sql.ToString().Substring(1,str_sql.ToString().Length-1)+&quot; where&quot;; <br />&nbsp;&nbsp; nsn.core.SqlHelper.ExecuteNonQuery(connstring,CommandType.Text,sql1); <br />&nbsp;&nbsp; } <br />&nbsp;&nbsp; <br />&nbsp;&nbsp; static protected string judgetype(string field_type,string field_value) <br />&nbsp;&nbsp; { <br />&nbsp;&nbsp; string str_value; <br />&nbsp;&nbsp; switch(field_type) <br />&nbsp;&nbsp; { <br />&nbsp;&nbsp; case &quot;int&quot;: str_value=field_value; <br />&nbsp;&nbsp; break; <br />&nbsp;&nbsp; case &quot;varchar&quot;: str_value=&quot;'&quot;+field_value+&quot;'&quot;; <br />&nbsp;&nbsp; break; <br />&nbsp;&nbsp; case &quot;ntext&quot;: str_value=&quot;'&quot;+field_value+&quot;'&quot;; <br />&nbsp;&nbsp; break; <br />&nbsp;&nbsp; case &quot;datetime&quot;:str_value=&quot;'&quot;+field_value+&quot;'&quot;; <br />&nbsp;&nbsp; break; <br />&nbsp;&nbsp; case &quot;tinyint&quot;: str_value=field_value; <br />&nbsp;&nbsp; break; <br />&nbsp;&nbsp; case &quot;smallint&quot;: str_value=field_value; <br />&nbsp;&nbsp; break; <br />&nbsp;&nbsp; } <br />&nbsp;&nbsp; return(field_type); <br />&nbsp;&nbsp; } <br />&nbsp;&nbsp; <br />&nbsp;&nbsp; static protected Hashtable getfieldtype(string tablename,string connstring) <br />&nbsp;&nbsp; { <br />&nbsp;&nbsp; DataSet ds = new DataSet(); <br />&nbsp;&nbsp; Hashtable ht_field=new Hashtable(); <br />&nbsp;&nbsp; SqlParameter[] paramsToStore = new SqlParameter[1]; <br />&nbsp;&nbsp; paramsToStore[0] = new SqlParameter(&quot;@tablename&quot;, SqlDbType.NVarChar); <br />&nbsp;&nbsp; paramsToStore[0].Direction=ParameterDirection.Input; <br />&nbsp;&nbsp; paramsToStore[0].Value=tablename; <br />&nbsp;&nbsp; <br />&nbsp;&nbsp; ds=nsn.core.SqlHelper.ExecuteDataset(connstring,CommandType.StoredProcedure,&quot;main_searchtable&quot;,paramsToStore); <br />&nbsp;&nbsp; DataTable tbl=ds.Tables[0]; <br />&nbsp;&nbsp; foreach(DataRow row in tbl.Rows) <br />&nbsp;&nbsp; { <br />&nbsp;&nbsp; <br />&nbsp;&nbsp; ht_field.Add(row[&quot;字段名&quot;].ToString(),row[&quot;类型&quot;].ToString()); <br />&nbsp;&nbsp; //System.Web.HttpContext.Current.Response.Write(row[&quot;字段名&quot;].ToString()); <br />&nbsp;&nbsp; } <br />&nbsp;&nbsp; return(ht_field); <br />&nbsp;&nbsp; } <br />&nbsp;&nbsp; <br />&nbsp;&nbsp;main_searchtable 存储过程是 <br />&nbsp;&nbsp;CREATE PROCEDURE main_searchtable <br />&nbsp;&nbsp;@tablename nvarchar(50) <br />&nbsp;&nbsp;AS <br />&nbsp;&nbsp; <br />&nbsp;&nbsp;SELECT <br />&nbsp;&nbsp; 表名=case when a.colorder=1 then d.name else '' end, <br />&nbsp;&nbsp; 表说明=case when a.colorder=1 then isnull(f.value,'') else '' end, <br />&nbsp;&nbsp; 字段序号=a.colorder, <br />&nbsp;&nbsp; 字段名=a.name, <br />&nbsp;&nbsp; 标识=case when COLUMNPROPERTY( a.id,a.name,'IsIdentity')=1 then '&radic;'else '' end, <br />&nbsp;&nbsp; 类型=b.name <br />&nbsp;&nbsp; <br />&nbsp;&nbsp; <br />&nbsp;&nbsp;FROM syscolumns a <br />&nbsp;&nbsp; left join systypes b on a.xtype=b.xusertype <br />&nbsp;&nbsp; inner join sysobjects d on a.id=d.id and d.xtype='U' and d.name&lt;&gt;'dtproperties' <br />&nbsp;&nbsp; <br />&nbsp;&nbsp; left join sysproperties f on d.id=f.id and f.smallid=0 <br />&nbsp;&nbsp; <br />&nbsp;&nbsp;where d.name=@tablename --如果只查询指定表,加上此条件 <br />&nbsp;&nbsp;order by a.id,a.colorder <br />&nbsp;&nbsp;GO]]>
</content>
</entry>

<entry>
<title>bcp将本地txt文本导入远程sqlserver中，本地未装sqlserver</title>
<link rel="alternate" type="text/html" href="http://www.bokee.net/blogmodule/weblogcomment_viewEntry/981783.html"/>
<issued>2007-08-24T16-25-50 CST</issued> 
<created>2007-08-24T16-25-50 CST</created>
<modified>2007-08-24T16-25-50Z</modified>
<id>tag:loveingling.blogchina.com,2005://981783</id>
<author>
<name>loveingling</name>
<url>http://www.bokee.net/blogmodule/weblogcomment_index/loveingling.html</url>
</author>
<dc:subject>sql系列</dc:subject>
<content type="text/html" mode="escaped" xml:lang="zh_CN" xml:base="http://www.bokee.net"> 
<![CDATA[上次写的bcp导入是在有sqlserver环境下进行的远程导入，由于项目需要我做了修改，因为在开发项目中，遇到对大型数据库导入导出处理，客户要求环境是web服务器、文件服务器和数据库服务器搭配，web服务器上不允许安装sqlserver，在没有bcp的环境下导入大批量的文本数据，不能直接调用cmd命令进行导入，必须引用外部bcp.exe文件来进行数据导入，引用时必须将sqlserver的bcp.exe和bcp.rll两个文件复制到web服务器上，如下这两个文件我都放在项目中的compant文件夹里： <br />&nbsp;&nbsp; <br />&nbsp;&nbsp;using System; <br />&nbsp;&nbsp;using System.Data; <br />&nbsp;&nbsp;using System.Data.SqlClient; <br />&nbsp;&nbsp;using System.Diagnostics; <br />&nbsp;&nbsp;代码 <br />&nbsp;&nbsp; private void Page_Load(object sender, System.EventArgs e) <br />&nbsp;&nbsp; { <br />&nbsp;&nbsp; // 在此处放置用户代码以初始化页面 <br />&nbsp;&nbsp; Process p = new Process(); <br />&nbsp;&nbsp; p.StartInfo.FileName = Server.MapPath(&quot;compant/bcp.exe&quot;); <br />&nbsp;&nbsp; p.StartInfo.UseShellExecute = false; <br />&nbsp;&nbsp; //@必须加上，不然特殊字符会被自动过滤掉 <br />&nbsp;&nbsp; p.StartInfo.Arguments = @&quot;Test..BcpTest in D:\temp.txt -S -Usa -P1 -c -t,&quot; ; <br />&nbsp;&nbsp; try <br />&nbsp;&nbsp; { <br />&nbsp;&nbsp; p.Start(); <br />&nbsp;&nbsp; p.WaitForExit(); <br />&nbsp;&nbsp; p.Close(); <br />&nbsp;&nbsp; } <br />&nbsp;&nbsp; catch <br />&nbsp;&nbsp; {} <br />&nbsp;&nbsp; }&nbsp;<br />&nbsp;&nbsp; <br />]]>
</content>
</entry>

<entry>
<title>DIV CSS布局实例：用css网站布局之十步实录！（目录）</title>
<link rel="alternate" type="text/html" href="http://www.bokee.net/blogmodule/weblogcomment_viewEntry/972047.html"/>
<issued>2007-08-21T09-35-25 CST</issued> 
<created>2007-08-21T09-35-25 CST</created>
<modified>2007-08-21T09-35-25Z</modified>
<id>tag:loveingling.blogchina.com,2005://972047</id>
<author>
<name>loveingling</name>
<url>http://www.bokee.net/blogmodule/weblogcomment_index/loveingling.html</url>
</author>
<dc:subject>ajax开发 </dc:subject>
<content type="text/html" mode="escaped" xml:lang="zh_CN" xml:base="http://www.bokee.net"> 
<![CDATA[<strong>用css网站布局之十步实录　目录：&nbsp;<br />点击链接查看教程具体内容！<br /><br /></strong>第一步：规划网站<br /><a href="http://www.52css.com/article.asp?id=175" target="_blank">http://www.52css.com/article.asp?id=175</a><br /><br />第二步：创建html模板及文件目录等<br /><a href="http://www.52css.com/article.asp?id=176" target="_blank">http://www.52css.com/article.asp?id=176</a><br /><br />第三步：将网站分为五个div&nbsp;网页基本布局<br /><a href="http://www.52css.com/article.asp?id=177" target="_blank">http://www.52css.com/article.asp?id=177</a><br /><br />第四步：网页布局与div浮动等<br /><a href="http://www.52css.com/article.asp?id=178" target="_blank">http://www.52css.com/article.asp?id=178</a><br /><br />第五步：网页主要框架之外的附加结构的布局与表现<br /><a href="http://www.52css.com/article.asp?id=179" target="_blank">http://www.52css.com/article.asp?id=179</a><br /><br />第六步：页面内的基本文本的样式(css)设置<br /><a href="http://www.52css.com/article.asp?id=180" target="_blank">http://www.52css.com/article.asp?id=180</a><br /><br />第七步：网站头部图标与logo部分的设计<br /><a href="http://www.52css.com/article.asp?id=181" target="_blank">http://www.52css.com/article.asp?id=181</a><br /><br />第八步：页脚信息的表现设置<br /><a href="http://www.52css.com/article.asp?id=182" target="_blank">http://www.52css.com/article.asp?id=182</a><br /><br />第九步：导航条的制作<br /><a href="http://www.52css.com/article.asp?id=183" target="_blank">http://www.52css.com/article.asp?id=183</a><br /><br />第十步：解决IE浏览器的显示BUG<br /><a href="http://www.52css.com/article.asp?id=184" target="_blank">http://www.52css.com/article.asp?id=184</a><br />]]>
</content>
</entry>

<entry>
<title>CSS技巧学习：像table一样布局div</title>
<link rel="alternate" type="text/html" href="http://www.bokee.net/blogmodule/weblogcomment_viewEntry/972034.html"/>
<issued>2007-08-21T09-32-39 CST</issued> 
<created>2007-08-21T09-32-39 CST</created>
<modified>2007-08-21T09-32-39Z</modified>
<id>tag:loveingling.blogchina.com,2005://972034</id>
<author>
<name>loveingling</name>
<url>http://www.bokee.net/blogmodule/weblogcomment_index/loveingling.html</url>
</author>
<dc:subject>ajax开发 </dc:subject>
<content type="text/html" mode="escaped" xml:lang="zh_CN" xml:base="http://www.bokee.net"> 
<![CDATA[许多网页设计师都喜欢，将两个或者多个容器等高的并排放置，并在里面展示每个容器的内容，就象经典表格布局中的单元格控制几个栏目的位置，也喜欢容器的内容居中或顶部对齐显示。<br />但是你又不喜欢用table来实现他，那怎么办呢？实现的方法很多，有根据视觉错觉实现的，有用JS控制使高度相等的，还有采用容器溢出部分隐藏和列的负底边界和正的内补丁相结合的方法来解决列高度相同的问题。<br />其实有个简单的方法，使用display:table, display:table-row and display:table-cell 就可以实现，而且高度小的容器会自适应那些高度相对较高的，但是IE不支持这个属性，我们先不用去责备IE，相信以后会有所改善的。这里我制作了一个模型。<br /><br />先看看xhtml的结构：<br />&lt;div class=&quot;equal&quot;&gt;<br />&lt;div class=&quot;row&quot;&gt;<br />&lt;div class=&quot;one&quot;&gt;&lt;/div&gt;<br />&lt;div class=&quot;two&quot;&gt;&lt;/div&gt;<br />&lt;div class=&quot;three&quot;&gt;&lt;/div&gt;<br />&lt;/div&gt;<br />&lt;/div&gt;<br />很简单不用解释就能看懂，但是这里给出一个table的结构，是不是很相似<br /><br />&lt;table&gt;<br />&lt;tr&gt;<br />&lt;td&gt;&lt;/td&gt;<br />&lt;td&gt;&lt;/td&gt;<br />&lt;td&gt;&lt;/td&gt;<br />&lt;/tr&gt;<br />&lt;/table&gt;<br /><br />下来是css：<br />.equal {<br />display:table;<br />border-collapse:separate;<br />}<br />.row {<br />display:table-row;<br />}<br />.row div {<br />display:table-cell;<br />}<br />.row .one {<br />width:200px;<br />}<br />.row .two {<br />width:200px;<br />}<br />.row .three {<br /><br />}<br /><br />解释：<br />1.dispaly:table;让层.equal作为块级元素的表格table显示，也就是将他作为一个表格<br />2.border-collapse:separate;边框独立，就像表格没有合并单元格以前<br />3.display:table-row;将.row作为表格行tr显示<br />4.display:table-cell;将.row的下级div作为表格单元格td显示<br />5.然后定义宽度<br /><br />这里还使用了 border-spacing:10px;来区别几个盒子，正如上面所陈述的，IE下不能正常显示，但是在：Mozilla 1.6, Opera 7.50, Safari 1.2.2, Firefox 0.8, OmniWeb 5b, Camino 0.8b, and Netscape 7.1经过测试均可以完美显示.<br /><br />至此整个任务就结束了。]]>
</content>
</entry>

<entry>
<title>CSS</title>
<link rel="alternate" type="text/html" href="http://www.bokee.net/blogmodule/weblogcomment_viewEntry/971964.html"/>
<issued>2007-08-21T09-11-57 CST</issued> 
<created>2007-08-21T09-11-57 CST</created>
<modified>2007-08-21T09-11-55Z</modified>
<id>tag:loveingling.blogchina.com,2005://971964</id>
<author>
<name>loveingling</name>
<url>http://www.bokee.net/blogmodule/weblogcomment_index/loveingling.html</url>
</author>
<dc:subject>ajax开发 </dc:subject>
<content type="text/html" mode="escaped" xml:lang="zh_CN" xml:base="http://www.bokee.net"> 
<![CDATA[<table cellspacing="0" cellpadding="5" width="540" align="center" border="0">
    <tbody>
        <tr align="center">
            <td width="180">
            <div style="BORDER-RIGHT: rgb(51,51,51) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(51,51,51) 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(51,51,51) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(51,51,51) 1px solid; HEIGHT: 50px">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(204,204,204) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(204,204,204) 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(204,204,204) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(204,204,204) 1px solid; HEIGHT: 50px">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(0,153,0) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(0,153,0) 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(0,153,0) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(0,153,0) 1px solid; HEIGHT: 50px">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(153,0,0) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(153,0,0) 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(153,0,0) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(153,0,0) 1px solid; HEIGHT: 50px">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(153,153,51) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(153,153,51) 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(153,153,51) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(153,153,51) 1px solid; HEIGHT: 50px">TEXT<br />TEXT<br />&hellip;</div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#333333;border-width:1px;border-style:solid;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#cccccc;border-width:1px;border-style:solid;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#009900;border-width:1px;border-style:solid;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#990000;border-width:1px;border-style:solid;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#999933;border-width:1px;border-style:solid;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
        </tr>
        <tr align="center">
            <td width="180">
            <div style="BORDER-RIGHT: rgb(51,51,51) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(51,51,51) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(204,204,204) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(51,51,51) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(51,51,51) 1px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(204,204,204) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(204,204,204) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(247,247,247) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(204,204,204) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(204,204,204) 1px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(0,153,0) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(0,153,0) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(173,254,173) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(0,153,0) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(0,153,0) 1px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(153,0,0) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(153,0,0) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(254,198,198) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(153,0,0) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(153,0,0) 1px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(153,153,51) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(153,153,51) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(249,249,186) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(153,153,51) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(153,153,51) 1px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#333333;border-width:1px;border-style:solid;height:50px;width:80px;background:#cccccc;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#cccccc;border-width:1px;border-style:solid;height:50px;width:80px;background:#F7F7F7;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#009900;border-width:1px;border-style:solid;height:50px;width:80px;background:#ADFEAD;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#990000;border-width:1px;border-style:solid;height:50px;width:80px;background:#FEC6C6;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#999933;border-width:1px;border-style:solid;height:50px;width:80px;background:#F9F9BA;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
        </tr>
        <tr align="center">
            <td width="180">
            <div style="BORDER-RIGHT: rgb(51,51,51) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(51,51,51) 1px dotted; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(51,51,51) 1px dotted; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(51,51,51) 1px dotted; HEIGHT: 50px">TEXT<br />TEXT<br />dotted</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(204,204,204) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(204,204,204) 1px dotted; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(204,204,204) 1px dotted; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(204,204,204) 1px dotted; HEIGHT: 50px">TEXT<br />TEXT<br />dotted</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(0,153,0) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(0,153,0) 1px dotted; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(0,153,0) 1px dotted; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(0,153,0) 1px dotted; HEIGHT: 50px">TEXT<br />TEXT<br />dotted</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(153,0,0) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(153,0,0) 1px dotted; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(153,0,0) 1px dotted; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(153,0,0) 1px dotted; HEIGHT: 50px">TEXT<br />TEXT<br />dotted</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(153,153,51) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(153,153,51) 1px dotted; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(153,153,51) 1px dotted; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(153,153,51) 1px dotted; HEIGHT: 50px">TEXT<br />TEXT<br />dotted</div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#333333;border-width:1px;border-style:dotted;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#cccccc;border-width:1px;border-style:dotted;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#009900;border-width:1px;border-style:dotted;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#990000;border-width:1px;border-style:dotted;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#999933;border-width:1px;border-style:dotted;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
        </tr>
        <tr align="center">
            <td width="180">
            <div style="BORDER-RIGHT: rgb(51,51,51) 1px dashed; PADDING-RIGHT: 5px; BORDER-TOP: rgb(51,51,51) 1px dashed; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(51,51,51) 1px dashed; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(51,51,51) 1px dashed; HEIGHT: 50px">TEXT<br />TEXT<br />dashed</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(204,204,204) 1px dashed; PADDING-RIGHT: 5px; BORDER-TOP: rgb(204,204,204) 1px dashed; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(204,204,204) 1px dashed; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(204,204,204) 1px dashed; HEIGHT: 50px">TEXT<br />TEXT<br />dashed</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(0,153,0) 1px dashed; PADDING-RIGHT: 5px; BORDER-TOP: rgb(0,153,0) 1px dashed; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(0,153,0) 1px dashed; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(0,153,0) 1px dashed; HEIGHT: 50px">TEXT<br />TEXT<br />dashed</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(153,0,0) 1px dashed; PADDING-RIGHT: 5px; BORDER-TOP: rgb(153,0,0) 1px dashed; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(153,0,0) 1px dashed; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(153,0,0) 1px dashed; HEIGHT: 50px">TEXT<br />TEXT<br />dashed</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(153,153,51) 1px dashed; PADDING-RIGHT: 5px; BORDER-TOP: rgb(153,153,51) 1px dashed; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(153,153,51) 1px dashed; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(153,153,51) 1px dashed; HEIGHT: 50px">TEXT<br />TEXT<br />dashed</div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#333333;border-width:1px;border-style:dashed;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#cccccc;border-width:1px;border-style:dashed;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#009900;border-width:1px;border-style:dashed;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#990000;border-width:1px;border-style:dashed;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;border-color:#999933;border-width:1px;border-style:dashed;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
        </tr>
        <tr align="center">
            <td width="180">
            <div style="PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BACKGROUND: rgb(204,204,204) 0% 50%; PADDING-BOTTOM: 5px; WIDTH: 80px; PADDING-TOP: 5px; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BACKGROUND: rgb(239,239,239) 0% 50%; PADDING-BOTTOM: 5px; WIDTH: 80px; PADDING-TOP: 5px; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BACKGROUND: rgb(179,217,186) 0% 50%; PADDING-BOTTOM: 5px; WIDTH: 80px; PADDING-TOP: 5px; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BACKGROUND: rgb(179,197,217) 0% 50%; PADDING-BOTTOM: 5px; WIDTH: 80px; PADDING-TOP: 5px; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BACKGROUND: rgb(217,209,179) 0% 50%; PADDING-BOTTOM: 5px; WIDTH: 80px; PADDING-TOP: 5px; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#cccccc;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#EFEFEF;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#B3D9BA;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#B3C5D9;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#D9D1B3;height:50px;width:80px;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
        </tr>
        <tr align="center">
            <td width="180">
            <div style="BORDER-RIGHT: rgb(140,168,90) 0pt solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(140,168,90) 0pt solid; PADDING-LEFT: 5px; BACKGROUND: rgb(235,252,206) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(140,168,90) 0pt solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(140,168,90) 3px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(106,53,160) 0pt solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(106,53,160) 0pt solid; PADDING-LEFT: 5px; BACKGROUND: rgb(225,203,247) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(106,53,160) 0pt solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(106,53,160) 3px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(53,139,160) 0pt solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(53,139,160) 0pt solid; PADDING-LEFT: 5px; BACKGROUND: rgb(175,203,210) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(53,139,160) 0pt solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(53,139,160) 3px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(82,147,122) 0pt solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(82,147,122) 0pt solid; PADDING-LEFT: 5px; BACKGROUND: rgb(175,210,197) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(82,147,122) 0pt solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(82,147,122) 3px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(156,159,68) 0pt solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(156,159,68) 0pt solid; PADDING-LEFT: 5px; BACKGROUND: rgb(250,252,199) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(156,159,68) 0pt solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(156,159,68) 3px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#cccccc;height:50px;width:80px;border-color:#333333;border-width:0 0 3px 0;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#EFEFEF;height:50px;width:80px;border-color:#cccccc;border-width:0 0 3px 0;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#B3D9BA;height:50px;width:80px;border-color:#40A352;border-width:0 0 3px 0;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#B3C5D9;height:50px;width:80px;border-color:#2B609C;border-width:0 0 3px 0;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#D9D1B3;height:50px;width:80px;border-color:#9C8223;border-width:0 0 3px 0;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
        </tr>
        <tr align="center">
            <td width="180">
            <div style="BORDER-RIGHT: rgb(51,51,51) 0pt solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(51,51,51) 0pt solid; PADDING-LEFT: 5px; BACKGROUND: rgb(204,204,204) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(51,51,51) 3px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(51,51,51) 0pt solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(204,204,204) 0pt solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(204,204,204) 0pt solid; PADDING-LEFT: 5px; BACKGROUND: rgb(239,239,239) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(204,204,204) 3px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(204,204,204) 0pt solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(64,163,82) 0pt solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(64,163,82) 0pt solid; PADDING-LEFT: 5px; BACKGROUND: rgb(179,217,186) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(64,163,82) 3px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(64,163,82) 0pt solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(43,96,156) 0pt solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(43,96,156) 0pt solid; PADDING-LEFT: 5px; BACKGROUND: rgb(179,197,217) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(43,96,156) 3px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(43,96,156) 0pt solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(156,130,35) 0pt solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(156,130,35) 0pt solid; PADDING-LEFT: 5px; BACKGROUND: rgb(217,209,179) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(156,130,35) 3px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(156,130,35) 0pt solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#cccccc;height:50px;width:80px;border-color:#333333;border-width:0 0 0 3px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#EFEFEF;height:50px;width:80px;border-color:#cccccc;border-width:0 0 0 3px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#B3D9BA;height:50px;width:80px;border-color:#40A352;border-width:0 0 0 3px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#B3C5D9;height:50px;width:80px;border-color:#2B609C;border-width:0 0 0 3px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#D9D1B3;height:50px;width:80px;border-color:#9C8223;border-width:0 0 0 3px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
        </tr>
        <tr align="center">
            <td width="180">
            <div style="BORDER-RIGHT: rgb(140,168,90) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(235,252,206) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(140,168,90) 1px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(106,53,160) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(225,203,247) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(106,53,160) 1px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(53,139,160) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(175,203,210) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(53,139,160) 1px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(82,147,122) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(175,210,197) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(82,147,122) 1px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(156,159,68) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(250,252,199) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 80px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(156,159,68) 1px solid; HEIGHT: 50px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#cccccc;height:50px;width:80px;border-color:#333333;border-width:0 0 3px 0;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#EFEFEF;height:50px;width:80px;border-color:#cccccc;border-width:0 0 3px 0;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#B3D9BA;height:50px;width:80px;border-color:#40A352;border-width:0 0 3px 0;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#B3C5D9;height:50px;width:80px;border-color:#2B609C;border-width:0 0 3px 0;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:5px;background:#D9D1B3;height:50px;width:80px;border-color:#9C8223;border-width:0 0 3px 0;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;</textarea></td>
        </tr>
        <tr align="center">
            <td width="180">
            <div style="PADDING-RIGHT: 3px; PADDING-LEFT: 3px; BACKGROUND: rgb(235,252,206) 0% 50%; PADDING-BOTTOM: 3px; WIDTH: 76px; PADDING-TOP: 3px; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(140,168,90) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(235,252,206) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(140,168,90) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="PADDING-RIGHT: 3px; PADDING-LEFT: 3px; BACKGROUND: rgb(225,203,247) 0% 50%; PADDING-BOTTOM: 3px; WIDTH: 76px; PADDING-TOP: 3px; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(106,53,160) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(225,203,247) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(106,53,160) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="PADDING-RIGHT: 3px; PADDING-LEFT: 3px; BACKGROUND: rgb(175,203,210) 0% 50%; PADDING-BOTTOM: 3px; WIDTH: 76px; PADDING-TOP: 3px; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(53,139,160) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(175,203,210) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(53,139,160) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="PADDING-RIGHT: 3px; PADDING-LEFT: 3px; BACKGROUND: rgb(175,210,197) 0% 50%; PADDING-BOTTOM: 3px; WIDTH: 76px; PADDING-TOP: 3px; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(82,147,122) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(175,210,197) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(82,147,122) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="PADDING-RIGHT: 3px; PADDING-LEFT: 3px; BACKGROUND: rgb(250,252,199) 0% 50%; PADDING-BOTTOM: 3px; WIDTH: 76px; PADDING-TOP: 3px; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(156,159,68) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(250,252,199) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(156,159,68) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:3px;background:#EBFCCE;height:46px;width:76px;&quot;&gt;&lt;div style=&quot;padding:5px;background:#EBFCCE;height:40px;width:70px;border-color:#FFFFFF #8CA85A #8CA85A #FFFFFF;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:3px;background:#E1CBF7;height:46px;width:76px;&quot;&gt;&lt;div style=&quot;padding:5px;background:#E1CBF7;height:40px;width:70px;border-color:#FFFFFF #6A35A0 #6A35A0 #FFFFFF;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:3px;background:#AFCBD2;height:46px;width:76px;&quot;&gt;&lt;div style=&quot;padding:5px;background:#AFCBD2;height:40px;width:70px;border-color:#FFFFFF #358BA0 #358BA0 #FFFFFF;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:3px;background:#AFD2C5;height:46px;width:76px;&quot;&gt;&lt;div style=&quot;padding:5px;background:#AFD2C5;height:40px;width:70px;border-color:#FFFFFF #52937A #52937A #FFFFFF;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:3px;background:#FAFCC7;height:46px;width:76px;&quot;&gt;&lt;div style=&quot;padding:5px;background:#FAFCC7;height:40px;width:70px;border-color:#FFFFFF #9C9F44 #9C9F44 #FFFFFF;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
        </tr>
        <tr align="center">
            <td width="180">
            <div style="BORDER-RIGHT: rgb(140,168,90) 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: rgb(140,168,90) 1px solid; PADDING-LEFT: 3px; BACKGROUND: rgb(235,252,206) 0% 50%; PADDING-BOTTOM: 3px; BORDER-LEFT: rgb(140,168,90) 1px solid; WIDTH: 76px; PADDING-TOP: 3px; BORDER-BOTTOM: rgb(140,168,90) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(140,168,90) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(140,168,90) 1px dotted; PADDING-LEFT: 5px; BACKGROUND: rgb(235,252,206) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(140,168,90) 1px dotted; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(140,168,90) 1px dotted; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(106,53,160) 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: rgb(106,53,160) 1px solid; PADDING-LEFT: 3px; BACKGROUND: rgb(225,203,247) 0% 50%; PADDING-BOTTOM: 3px; BORDER-LEFT: rgb(106,53,160) 1px solid; WIDTH: 76px; PADDING-TOP: 3px; BORDER-BOTTOM: rgb(106,53,160) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(106,53,160) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(106,53,160) 1px dotted; PADDING-LEFT: 5px; BACKGROUND: rgb(225,203,247) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(106,53,160) 1px dotted; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(106,53,160) 1px dotted; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(53,139,160) 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: rgb(53,139,160) 1px solid; PADDING-LEFT: 3px; BACKGROUND: rgb(175,203,210) 0% 50%; PADDING-BOTTOM: 3px; BORDER-LEFT: rgb(53,139,160) 1px solid; WIDTH: 76px; PADDING-TOP: 3px; BORDER-BOTTOM: rgb(53,139,160) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(53,139,160) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(53,139,160) 1px dotted; PADDING-LEFT: 5px; BACKGROUND: rgb(175,203,210) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(53,139,160) 1px dotted; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(53,139,160) 1px dotted; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(82,147,122) 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: rgb(82,147,122) 1px solid; PADDING-LEFT: 3px; BACKGROUND: rgb(175,210,197) 0% 50%; PADDING-BOTTOM: 3px; BORDER-LEFT: rgb(82,147,122) 1px solid; WIDTH: 76px; PADDING-TOP: 3px; BORDER-BOTTOM: rgb(82,147,122) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(82,147,122) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(82,147,122) 1px dotted; PADDING-LEFT: 5px; BACKGROUND: rgb(175,210,197) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(82,147,122) 1px dotted; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(82,147,122) 1px dotted; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(156,159,68) 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: rgb(156,159,68) 1px solid; PADDING-LEFT: 3px; BACKGROUND: rgb(250,252,199) 0% 50%; PADDING-BOTTOM: 3px; BORDER-LEFT: rgb(156,159,68) 1px solid; WIDTH: 76px; PADDING-TOP: 3px; BORDER-BOTTOM: rgb(156,159,68) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(156,159,68) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(156,159,68) 1px dotted; PADDING-LEFT: 5px; BACKGROUND: rgb(250,252,199) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(156,159,68) 1px dotted; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(156,159,68) 1px dotted; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:3px;background:#EBFCCE;height:46px;width:76px;border-color:#8CA85A;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#EBFCCE;height:40px;width:70px;border-color:#8CA85A;border-width:1px;border-style:dotted;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:3px;background:#E1CBF7;height:46px;width:76px;border-color:#6A35A0;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#E1CBF7;height:40px;width:70px;border-color:#6A35A0;border-width:1px;border-style:dotted;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:3px;background:#AFCBD2;height:46px;width:76px;border-color:#358BA0;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#AFCBD2;height:40px;width:70px;border-color:#358BA0;border-width:1px;border-style:dotted;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:3px;background:#AFD2C5;height:46px;width:76px;border-color:#52937A;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#AFD2C5;height:40px;width:70px;border-color:#52937A;border-width:1px;border-style:dotted;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:3px;background:#FAFCC7;height:46px;width:76px;border-color:#9C9F44;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#FAFCC7;height:40px;width:70px;border-color:#9C9F44;border-width:1px;border-style:dotted;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
        </tr>
        <tr align="center">
            <td width="180">
            <div style="BORDER-RIGHT: rgb(140,168,90) 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: rgb(140,168,90) 1px solid; PADDING-LEFT: 2px; BACKGROUND: rgb(235,252,206) 0% 50%; PADDING-BOTTOM: 2px; BORDER-LEFT: rgb(140,168,90) 1px solid; WIDTH: 76px; PADDING-TOP: 2px; BORDER-BOTTOM: rgb(140,168,90) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(140,168,90) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(140,168,90) 1px dotted; PADDING-LEFT: 5px; BACKGROUND: rgb(255,255,255) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(140,168,90) 1px dotted; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(140,168,90) 1px dotted; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(106,53,160) 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: rgb(106,53,160) 1px solid; PADDING-LEFT: 2px; BACKGROUND: rgb(225,203,247) 0% 50%; PADDING-BOTTOM: 2px; BORDER-LEFT: rgb(106,53,160) 1px solid; WIDTH: 76px; PADDING-TOP: 2px; BORDER-BOTTOM: rgb(106,53,160) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(106,53,160) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(106,53,160) 1px dotted; PADDING-LEFT: 5px; BACKGROUND: rgb(255,255,255) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(106,53,160) 1px dotted; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(106,53,160) 1px dotted; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(53,139,160) 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: rgb(53,139,160) 1px solid; PADDING-LEFT: 2px; BACKGROUND: rgb(175,203,210) 0% 50%; PADDING-BOTTOM: 2px; BORDER-LEFT: rgb(53,139,160) 1px solid; WIDTH: 76px; PADDING-TOP: 2px; BORDER-BOTTOM: rgb(53,139,160) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(53,139,160) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(53,139,160) 1px dotted; PADDING-LEFT: 5px; BACKGROUND: rgb(255,255,255) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(53,139,160) 1px dotted; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(53,139,160) 1px dotted; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(82,147,122) 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: rgb(82,147,122) 1px solid; PADDING-LEFT: 2px; BACKGROUND: rgb(175,210,197) 0% 50%; PADDING-BOTTOM: 2px; BORDER-LEFT: rgb(82,147,122) 1px solid; WIDTH: 76px; PADDING-TOP: 2px; BORDER-BOTTOM: rgb(82,147,122) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(82,147,122) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(82,147,122) 1px dotted; PADDING-LEFT: 5px; BACKGROUND: rgb(255,255,255) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(82,147,122) 1px dotted; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(82,147,122) 1px dotted; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(156,159,68) 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: rgb(156,159,68) 1px solid; PADDING-LEFT: 2px; BACKGROUND: rgb(250,252,199) 0% 50%; PADDING-BOTTOM: 2px; BORDER-LEFT: rgb(156,159,68) 1px solid; WIDTH: 76px; PADDING-TOP: 2px; BORDER-BOTTOM: rgb(156,159,68) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(156,159,68) 1px dotted; PADDING-RIGHT: 5px; BORDER-TOP: rgb(156,159,68) 1px dotted; PADDING-LEFT: 5px; BACKGROUND: rgb(255,255,255) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(156,159,68) 1px dotted; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(156,159,68) 1px dotted; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:2px;background:#EBFCCE;height:46px;width:76px;border-color:#8CA85A;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#FFFFFF;height:40px;width:70px;border-color:#8CA85A;border-width:1px;border-style:dotted;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:2px;background:#E1CBF7;height:46px;width:76px;border-color:#6A35A0;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#FFFFFF;height:40px;width:70px;border-color:#6A35A0;border-width:1px;border-style:dotted;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:2px;background:#AFCBD2;height:46px;width:76px;border-color:#358BA0;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#FFFFFF;height:40px;width:70px;border-color:#358BA0;border-width:1px;border-style:dotted;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:2px;background:#AFD2C5;height:46px;width:76px;border-color:#52937A;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#FFFFFF;height:40px;width:70px;border-color:#52937A;border-width:1px;border-style:dotted;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:2px;background:#FAFCC7;height:46px;width:76px;border-color:#9C9F44;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#FFFFFF;height:40px;width:70px;border-color:#9C9F44;border-width:1px;border-style:dotted;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
        </tr>
        <tr align="center">
            <td width="180">
            <div style="BORDER-RIGHT: rgb(140,168,90) 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: rgb(140,168,90) 1px solid; PADDING-LEFT: 2px; BACKGROUND: rgb(235,252,206) 0% 50%; PADDING-BOTTOM: 2px; BORDER-LEFT: rgb(140,168,90) 1px solid; WIDTH: 76px; PADDING-TOP: 2px; BORDER-BOTTOM: rgb(140,168,90) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(140,168,90) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(140,168,90) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(245,253,229) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(140,168,90) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(140,168,90) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(106,53,160) 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: rgb(106,53,160) 1px solid; PADDING-LEFT: 2px; BACKGROUND: rgb(225,203,247) 0% 50%; PADDING-BOTTOM: 2px; BORDER-LEFT: rgb(106,53,160) 1px solid; WIDTH: 76px; PADDING-TOP: 2px; BORDER-BOTTOM: rgb(106,53,160) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(106,53,160) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(106,53,160) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(239,227,251) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(106,53,160) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(106,53,160) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(53,139,160) 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: rgb(53,139,160) 1px solid; PADDING-LEFT: 2px; BACKGROUND: rgb(175,203,210) 0% 50%; PADDING-BOTTOM: 2px; BORDER-LEFT: rgb(53,139,160) 1px solid; WIDTH: 76px; PADDING-TOP: 2px; BORDER-BOTTOM: rgb(53,139,160) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(53,139,160) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(53,139,160) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(209,227,231) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(53,139,160) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(53,139,160) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(82,147,122) 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: rgb(82,147,122) 1px solid; PADDING-LEFT: 2px; BACKGROUND: rgb(175,210,197) 0% 50%; PADDING-BOTTOM: 2px; BORDER-LEFT: rgb(82,147,122) 1px solid; WIDTH: 76px; PADDING-TOP: 2px; BORDER-BOTTOM: rgb(82,147,122) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(82,147,122) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(82,147,122) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(209,231,223) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(82,147,122) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(82,147,122) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(156,159,68) 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: rgb(156,159,68) 1px solid; PADDING-LEFT: 2px; BACKGROUND: rgb(250,252,199) 0% 50%; PADDING-BOTTOM: 2px; BORDER-LEFT: rgb(156,159,68) 1px solid; WIDTH: 76px; PADDING-TOP: 2px; BORDER-BOTTOM: rgb(156,159,68) 1px solid; HEIGHT: 46px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(156,159,68) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(156,159,68) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(252,253,224) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(156,159,68) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(156,159,68) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:2px;background:#EBFCCE;height:46px;width:76px;border-color:#8CA85A;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#F5FDE5;height:40px;width:70px;border-color:#8CA85A;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:2px;background:#E1CBF7;height:46px;width:76px;border-color:#6A35A0;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#EFE3FB;height:40px;width:70px;border-color:#6A35A0;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:2px;background:#AFCBD2;height:46px;width:76px;border-color:#358BA0;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#D1E3E7;height:40px;width:70px;border-color:#358BA0;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:2px;background:#AFD2C5;height:46px;width:76px;border-color:#52937A;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#D1E7DF;height:40px;width:70px;border-color:#52937A;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:2px;background:#FAFCC7;height:46px;width:76px;border-color:#9C9F44;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#FCFDE0;height:40px;width:70px;border-color:#9C9F44;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
        </tr>
        <tr align="center">
            <td width="180">
            <div style="BORDER-RIGHT: rgb(51,51,51) 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: rgb(51,51,51) 1px solid; PADDING-LEFT: 1px; BACKGROUND: rgb(153,153,153) 0% 50%; PADDING-BOTTOM: 1px; BORDER-LEFT: rgb(51,51,51) 1px solid; WIDTH: 72px; PADDING-TOP: 1px; BORDER-BOTTOM: rgb(51,51,51) 1px solid; HEIGHT: 42px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(204,204,204) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(239,239,239) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(204,204,204) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(81,26,26) 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: rgb(81,26,26) 1px solid; PADDING-LEFT: 1px; BACKGROUND: rgb(178,124,124) 0% 50%; PADDING-BOTTOM: 1px; BORDER-LEFT: rgb(81,26,26) 1px solid; WIDTH: 72px; PADDING-TOP: 1px; BORDER-BOTTOM: rgb(81,26,26) 1px solid; HEIGHT: 42px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(218,186,186) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(244,233,233) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(218,186,186) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(26,81,81) 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: rgb(26,81,81) 1px solid; PADDING-LEFT: 1px; BACKGROUND: rgb(124,178,178) 0% 50%; PADDING-BOTTOM: 1px; BORDER-LEFT: rgb(26,81,81) 1px solid; WIDTH: 72px; PADDING-TOP: 1px; BORDER-BOTTOM: rgb(26,81,81) 1px solid; HEIGHT: 42px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(186,218,218) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(233,244,244) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(186,218,218) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(26,81,26) 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: rgb(26,81,26) 1px solid; PADDING-LEFT: 1px; BACKGROUND: rgb(124,178,124) 0% 50%; PADDING-BOTTOM: 1px; BORDER-LEFT: rgb(26,81,26) 1px solid; WIDTH: 72px; PADDING-TOP: 1px; BORDER-BOTTOM: rgb(26,81,26) 1px solid; HEIGHT: 42px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(186,218,186) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(233,244,233) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(186,218,186) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
            <td width="180">
            <div style="BORDER-RIGHT: rgb(81,81,26) 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: rgb(81,81,26) 1px solid; PADDING-LEFT: 1px; BACKGROUND: rgb(178,178,124) 0% 50%; PADDING-BOTTOM: 1px; BORDER-LEFT: rgb(81,81,26) 1px solid; WIDTH: 72px; PADDING-TOP: 1px; BORDER-BOTTOM: rgb(81,81,26) 1px solid; HEIGHT: 42px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">
            <div style="BORDER-RIGHT: rgb(218,218,186) 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: rgb(255,255,255) 1px solid; PADDING-LEFT: 5px; BACKGROUND: rgb(244,244,233) 0% 50%; PADDING-BOTTOM: 5px; BORDER-LEFT: rgb(255,255,255) 1px solid; WIDTH: 70px; PADDING-TOP: 5px; BORDER-BOTTOM: rgb(218,218,186) 1px solid; HEIGHT: 40px; moz-background-clip: -moz-initial; moz-background-origin: -moz-initial; moz-background-inline-policy: -moz-initial">TEXT<br />TEXT<br />&hellip;</div>
            </div>
            </td>
        </tr>
        <tr align="center">
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:1px;background:#999999;height:42px;width:72px;border-color:#333333;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#EFEFEF;height:40px;width:70px;border-color:#FFFFFF #CCCCCC #CCCCCC #FFFFFF;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:1px;background:#B27C7C;height:42px;width:72px;border-color:#511A1A;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#F4E9E9;height:40px;width:70px;border-color:#FFFFFF #DABABA #DABABA #FFFFFF;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:1px;background:#7CB2B2;height:42px;width:72px;border-color:#1A5151;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#E9F4F4;height:40px;width:70px;border-color:#FFFFFF #BADADA #BADADA #FFFFFF;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:1px;background:#7CB27C;height:42px;width:72px;border-color:#1A511A;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#E9F4E9;height:40px;width:70px;border-color:#FFFFFF #BADABA #BADABA #FFFFFF;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
            <td><textarea onmouseover="this.focus()" onfocus="this.select()" name="" cols="10">&lt;div style=&quot;padding:1px;background:#B2B27C;height:42px;width:72px;border-color:#51511A;border-width:1px;border-style:solid;&quot;&gt;&lt;div style=&quot;padding:5px;background:#F4F4E9;height:40px;width:70px;border-color:#FFFFFF #DADABA #DADABA #FFFFFF;border-width:1px;border-style:solid;&quot;&gt;TEXT&lt;br&gt;TEXT&lt;br&gt;&hellip;&lt;/div&gt;&lt;/div&gt;</textarea></td>
        </tr>
    </tbody>
</table>]]>
</content>
</entry>

<entry>
<title>div+css布局漫谈 (2)</title>
<link rel="alternate" type="text/html" href="http://www.bokee.net/blogmodule/weblogcomment_viewEntry/971954.html"/>
<issued>2007-08-21T09-09-52 CST</issued> 
<created>2007-08-21T09-09-52 CST</created>
<modified>2007-08-21T09-09-52Z</modified>
<id>tag:loveingling.blogchina.com,2005://971954</id>
<author>
<name>loveingling</name>
<url>http://www.bokee.net/blogmodule/weblogcomment_index/loveingling.html</url>
</author>
<dc:subject>ajax开发 </dc:subject>
<content type="text/html" mode="escaped" xml:lang="zh_CN" xml:base="http://www.bokee.net"> 
<![CDATA[<p><strong>xhtml:</strong></p>
<p><span class="code">&nbsp;&lt;div id=&quot;center&quot; class=&quot;column&quot;&gt;<br />&nbsp;&nbsp;&lt;h1&gt;This is the main content.&lt;/h1&gt;<br />&nbsp;&lt;/div&gt;<br />&nbsp;&lt;div id=&quot;left&quot; class=&quot;column&quot;&gt;<br />&nbsp;&nbsp;&lt;h2&gt;This is the left sidebar.&lt;/h2&gt;<br />&nbsp;&lt;/div&gt;<br />&nbsp;&lt;div id=&quot;right&quot; class=&quot;column&quot;&gt;<br />&nbsp;&nbsp;&lt;h2&gt;This is the right sidebar.&lt;/h2&gt;<br />&nbsp;&lt;/div&gt;</span></p>
<p><strong>CSS:</strong></p>
<p><span class="code">body {margin: 0;padding-left: 200px;padding-right: 190px;min-width: 240px;}<br />.column {position: relative;float: left;}<br />#center {width: 100%;}<br />#left {width: 180px; right: 240px;margin-left: -100%;}<br />#right {width: 130px;margin-right: -100%;}</span></p>
<p><strong>两行三列</strong></p>
<p><strong>xhtml:</strong></p>
<p><span class="code">&lt;div id=&quot;header&quot;&gt;这里是顶行&lt;/div&gt;<br />&lt;div id=&quot;warp&quot;&gt;<br />&nbsp;&lt;div id=&quot;column&quot;&gt;<br />&nbsp;&lt;div id=&quot;column1&quot;&gt;这里是第一列&lt;/div&gt;<br />&nbsp;&lt;div id=&quot;column2&quot;&gt;这里是第二列&lt;/div&gt;<br />&nbsp;&lt;div class=&quot;clear&quot;&gt;&lt;/div&gt;<br />&nbsp;&lt;/div&gt;<br />&nbsp;&lt;div id=&quot;column3&quot;&gt;这里是第三列&lt;/div&gt;<br />&nbsp;&lt;div class=&quot;clear&quot;&gt;&lt;/div&gt;<br />&lt;/div&gt;</span></p>
<p><strong>CSS:</strong></p>
<p><span class="code">#header{width:100%; height:auto;}<br />#wrap{ width:100%; height:auto;}<br />#column{ float:left; width:60%;}<br />#column1{ float:left; width:30%;}<br />#column2{ float:right; width:30%;}<br />#column3{ float:right; width:40%;}<br />.clear{ clear:both;} </span></p>
<p><strong>三行三列</strong></p>
<p><strong>xhtml:</strong></p>
<p><span class="code">&lt;div id=&quot;header&quot;&gt;这里是顶行&lt;/div&gt;<br />&lt;div id=&quot;warp&quot;&gt;<br />&nbsp;&lt;div id=&quot;column&quot;&gt;<br />&nbsp;&lt;div id=&quot;column1&quot;&gt;这里是第一列&lt;/div&gt;<br />&nbsp;&lt;div id=&quot;column2&quot;&gt;这里是第二列&lt;/div&gt;<br />&nbsp;&lt;div class=&quot;clear&quot;&gt;&lt;/div&gt;<br />&nbsp;&lt;/div&gt;<br />&nbsp;&lt;div id=&quot;column3&quot;&gt;这里是第三列&lt;/div&gt;<br />&nbsp;&lt;div class=&quot;clear&quot;&gt;&lt;/div&gt;<br />&lt;/div&gt;<br />&lt;div id=&quot;footer&quot;&gt;这里是底部一行&lt;/div&gt;</span></p>
<p><strong>CSS:</strong></p>
<p><span class="code">#header{width:100%; height:auto;}<br />#wrap{ width:100%; height:auto;}<br />#column{ float:left; width:60%;}<br />#column1{ float:left; width:30%;}<br />#column2{ float:right; width:30%;}<br />#column3{ float:right; width:40%;}<br />.clear{ clear:both;} <br />#footer{width:100%; height:auto;}</span></p>
<p>PS:这里列出的是常用的例子，而非研究之用，对一每个盒子，我都没有设置margin,padding,boeder等属性，是因为我个人觉得，含有宽度定位的时候，最好不好用到他们，除非必不得已，因为如果不是这样的话，解决浏览器兼容问题，会让你头疼，而且产生一系列CSS代码，我觉得这样的效率和效果都不好！</p>
<p><strong>3.CSS布局高级技巧</strong></p>
<p>margin和padding总是有可能要用到，而产生的问题如何解决呢？由于浏览器解释容器宽度的方法不同：</p>
<p>IE 6.0 Firefox Opera等是<br /><font color="#ff0000">真实宽度=width+padding+border+margin</font><br />IE5.X<br /><font color="#ff0000">真实宽度=width-padding-border-margin</font></p>
<p>很明显，第一种下很完美的布局在第二种情况下后果是很凄惨的！</p>
<p>解决的方法是 <a href="http://www.w3cn.org/article/tips/2006/120.html" target="_blank"><strong>hack</strong></a></p>
<p><span class="code"></span>
<p><strong>具体解释点击下面链接查看</strong></p>
<p><a href="http://www.blueidea.com/tech/site/2006/3170.asp" target="_blank"></a><a href="http://www.blueidea.com/tech/site/2006/3170.asp">www.blueidea.com/tech/site/2006/3170.asp</a><a href="http://www.blueidea.com/tech/site/2006/3170.asp"><br /></a><a class="" href="http://www.jluvip.com/blog/article.asp?id=114" target="_blank">www.jluvip.com/blog/article.asp?id=114</a></p>
<p><strong>列等高技巧</strong></p>
<p>n行n列布局，每列高度（事先并不能确定哪列的高度）的相同，是每个设计师追求的目标，做法有：背景图填充、加JS脚本的<br />方法和容器溢出部分隐藏和列的负底边界和正的内补丁相结合的方法。</p>
<p><strong>背景图填充法：</strong></p>
<p><strong>xhtml:</strong></p>
<p><span class="code">&lt;div id=&quot;wrap&quot;&gt;<br />&lt;div id=&quot;column1&quot;&gt;这是第一列&lt;/div&gt;<br />&lt;div id=&quot;column1&quot;&gt;这是第二列&lt;/div&gt;<br />&lt;div class=&quot;clear&quot;&gt;&lt;/div&gt;<br />&lt;/div&gt;</span></p>
<p><strong>css:</strong></p>
<p><span class="code">#wrap{ width:776px; background:url(bg.gif) repeat-y 300px;}<br />#column1{ float:left; width:300px;}<br />#column2{ float:right; width:476px;}<br />.clear{ clear:both;}</span></p>
<p>就是将一个npx宽的一张图片在外部容器纵向重复，定位到两列交错的位置纵向重复，在视觉上产生了两列高度一样的错觉</p>
<p><strong>JS脚本法：</strong></p>
<p><a href="http://www.blueidea.com/bbs/NewsDetail.asp?id=2453983" target="_blank"></a><a href="http://www.blueidea.com/bbs/NewsDetail.asp?id=2453983">www.blueidea.com/bbs/NewsDetail.asp?id=2453983</a><a href="http://www.blueidea.com/bbs/NewsDetail.asp?id=2453983"><br /></a>代码的原理基本就是这样，读取高度，判断高度，高度相等。</p>
<p><strong>容器溢出部分隐藏和列的负底边界和正的内补丁相结合的方法</strong></p>
<p><strong>这篇文章说的很详细了：</strong></p>
<p><a class="" href="http://www.blueidea.com/tech/web/2006/3210.asp" target="_blank">www.blueidea.com/tech/web/2006/3210.asp</a></p>
<p><strong>还有：</strong></p>
<p><a class="" href="http://www.jluvip.com/blog/article.asp?id=151" target="_blank">www.jluvip.com/blog/article.asp?id=151</a></p>
<p>满屏高度布局（最窄770px最宽1024px经典布局）</p>
<p><a href="http://www.blueidea.com/tech/web/2005/3124.asp">www.blueidea.com/tech/web/2005/3124.asp</a></p>
<p>&nbsp;</p>
</p>
<p>&nbsp;div.content { <br />width:400px; //这个是错误的width，所有浏览器都读到了<br />voice-family: &quot;\&quot;}\&quot;&quot;; //IE5.X/win忽略了&quot;\&quot;}\&quot;&quot;后的内容<br />voice-family:inherit;<br />width:300px; //包括IE6/win在内的部分浏览器读到这句，新的数值(300px)覆盖掉了旧的<br />} <br />html&gt;body .content { //html&gt;body是CSS2的写法<br />width:300px; //支持CSS2该写法的浏览器(非IE5)有幸读到了这一句<br />} </p>
<p>div.content { <br />width:300px !important; //这个是正确的width，大部分支持!important标记的浏览器使用这里的数值<br />width(空格)/**/:400px; //IE6/win不解析这句，所以IE6/win仍然认为width的值是300px；而IE5.X/win读到这句，新的数值(400px)覆盖掉了旧的，因为!important标记对他们不起作用<br />} <br />html&gt;body .content { //html&gt;body是CSS2的写法<br />width:300px; //支持CSS2该写法的浏览器有幸读到了这一句<br />}</p>]]>
</content>
</entry>

<entry>
<title>div+css布局漫谈 (1)</title>
<link rel="alternate" type="text/html" href="http://www.bokee.net/blogmodule/weblogcomment_viewEntry/971946.html"/>
<issued>2007-08-21T09-08-54 CST</issued> 
<created>2007-08-21T09-08-54 CST</created>
<modified>2007-08-21T09-08-54Z</modified>
<id>tag:loveingling.blogchina.com,2005://971946</id>
<author>
<name>loveingling</name>
<url>http://www.bokee.net/blogmodule/weblogcomment_index/loveingling.html</url>
</author>
<dc:subject>ajax开发 </dc:subject>
<content type="text/html" mode="escaped" xml:lang="zh_CN" xml:base="http://www.bokee.net"> 
<![CDATA[<p><strong>1.CSS布局常用的方法：<br />float : none | left | right</strong> </p>
<p><strong>取值：</strong><br />none : 默认值。对象不飘浮 <br />left : 文本流向对象的右边 <br />right : 文本流向对象的左边</p>
<p>它是怎样工作的，看个一行两列的例子</p>
<p><strong>xhtml:</strong></p>
<p><span class="code">&lt;div id=&quot;warp&quot;&gt;<br />&nbsp;&lt;div id=&quot;column1&quot;&gt;这里是第一列&lt;/div&gt;<br />&nbsp;&lt;div id=&quot;column2&quot;&gt;这里是第二列&lt;/div&gt;<br />&nbsp;&lt;div class=&quot;clear&quot;&gt;&lt;/div&gt;<br />&lt;/div&gt;</span></p>
<p>CSS:</p>
<p><span class="code">#wrap{ width:100%; height:auto;}<br />#column1{ float:left; width:40%;}<br />#column2{ float:right; width:60%;}<br />.clear{ clear:both;} </span></p>
<p><strong>position : static | absolute | fixed | relative</strong></p>
<p><strong>取值：</strong></p>
<p>static : 默认值。无特殊定位，对象遵循HTML定位规则 <br />absolute : 将对象从文档流中拖出，使用 left ， right ， top ， bottom 等属性相对于其最接近的一个最有定位设置的父对象进行绝对定位。如果不存在这样的父对象，则依据 body 对象。而其层叠通过 z-index 属性定义 <br />fixed : 未支持。对象定位遵从绝对(absolute)方式。但是要遵守一些规范 <br />relative : 对象不可层叠，但将依据 left ， right ， top ， bottom 等属性在正常文档流中偏移位置</p>
<p>它来实现一行两列的例子</p>
<p><strong>xhtml:</strong></p>
<p><span class="code">&lt;div id=&quot;warp&quot;&gt;<br />&nbsp;&lt;div id=&quot;column1&quot;&gt;这里是第一列&lt;/div&gt;<br />&nbsp;&lt;div id=&quot;column2&quot;&gt;这里是第二列&lt;/div&gt;<br />&lt;/div&gt;</span></p>
<p><strong>CSS:</strong></p>
<p><span class="code">#wrap{ position:relative;/*相对定位*/width:770px;}<br />#column1{ position:absolute; top:0; left:0; width:300px;}<br />#column2{position:absolute; top:0; right:0; width:470px;}</span></p>
<p><strong>他们的区别在哪?</strong></p>
<p>显然，float是相对定位的，会随着浏览器的大小和分辨率的变化而改变，而position就不行了，所以一般情况下还是float布局！</p>
<p><strong>2.CSS常用布局实例</strong></p>
<p><strong>一列<br />单行一列</strong></p>
<p><span class="code">body { margin: 0px;&nbsp;&nbsp; padding: 0px;&nbsp; text-align: center;&nbsp; }<br />#content {&nbsp; margin-left:auto;&nbsp; margin-right:auto;&nbsp; width: 400px;}</span></p>
<p><strong>两行一列</strong></p>
<p><span class="code">body {&nbsp; margin: 0px;&nbsp;&nbsp; padding: 0px;&nbsp;&nbsp; text-align: center;}<br />#content-top { margin-left:auto;&nbsp;&nbsp; margin-right:auto; width: 400px; }<br />#content-end {margin-left:auto; margin-right:auto;&nbsp; width: 400px;&nbsp;}</span></p>
<p><strong>三行一列</strong></p>
<p><span class="code">body {&nbsp; margin: 0px; padding: 0px;&nbsp; text-align: center;&nbsp; }<br />#content-top {&nbsp; margin-left:auto;&nbsp; margin-right:auto;&nbsp; width: 400px;}<br />#content-mid { margin-left:auto; margin-right:auto;&nbsp; width: 400px;}<br />#content-end { margin-left:auto; margin-right:auto; width: 400px;&nbsp; }</span></p>
<p><strong>两列<br />单行两列</strong></p>
<p><span class="code">#bodycenter { width: 700px;margin-right: auto; margin-left: auto;overflow: auto;&nbsp; }<br />#bodycenter #dv1 {float: left;width: 280px;}<br />#bodycenter #dv2 {float: right;width: 410px;}</span></p>
<p><strong>两行两列</strong></p>
<p><span class="code">#header{&nbsp;&nbsp;&nbsp; width: 700px; margin-right: auto;margin-left: auto; overflow: auto;}<br />#bodycenter { width: 700px; margin-right: auto; margin-left: auto; overflow: auto; }<br />#bodycenter #dv1 { float: left; width: 280px;}<br />#bodycenter #dv2 { float: right;width: 410px;}</span></p>
<p><strong>三行两列</strong></p>
<p><span class="code">#header{&nbsp;&nbsp;&nbsp; width: 700px;margin-right: auto; margin-left: auto;&nbsp; }<br />#bodycenter {width: 700px; margin-right: auto; margin-left: auto;&nbsp; }<br />#bodycenter #dv1 {&nbsp; float: left;width: 280px;}<br />#bodycenter #dv2 { float: right;&nbsp; width: 410px;}<br />#footer{&nbsp;&nbsp;&nbsp;&nbsp; width: 700px;&nbsp; margin-right: auto; margin-left: auto;&nbsp; overflow: auto;&nbsp; }</span></p>
<p><strong>三列<br />单行三列<br />绝对定位</strong></p>
<p><span class="code">#left { position: absolute; top: 0px;&nbsp; left: 0px; width: 120px;&nbsp; }<br />#middle {margin: 20px 190px 20px 190px; }<br />#right {position: absolute;top: 0px; right: 0px;&nbsp; width: 120px;}</span></p>
<p><strong>float定位</strong></p>
<p><strong>xhtml:</strong></p>
<p><span class="code">&lt;div id=&quot;warp&quot;&gt;<br />&nbsp;&lt;div id=&quot;column&quot;&gt;<br />&nbsp;&lt;div id=&quot;column1&quot;&gt;这里是第一列&lt;/div&gt;<br />&nbsp;&lt;div id=&quot;column2&quot;&gt;这里是第二列&lt;/div&gt;<br />&nbsp;&lt;div class=&quot;clear&quot;&gt;&lt;/div&gt;<br />&nbsp;&lt;/div&gt;<br />&nbsp;&lt;div id=&quot;column3&quot;&gt;这里是第三列&lt;/div&gt;<br />&nbsp;&lt;div class=&quot;clear&quot;&gt;&lt;/div&gt;<br />&lt;/div&gt;</span></p>
<p><strong>CSS:</strong></p>
<p><span class="code">#wrap{ width:100%; height:auto;}<br />#column{ float:left; width:60%;}<br />#column1{ float:left; width:30%;}<br />#column2{ float:right; width:30%;}<br />#column3{ float:right; width:40%;}<br />.clear{ clear:both;} </span></p>]]>
</content>
</entry>

</feed>

