登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

梦中人の梦工场

这里有爱的细雨,这里有情的倾诉。这里帮你筑梦,帮你圆梦!

 
 
 

日志

 
 

学习表格设置做图框  

2009-09-23 21:30:25|  分类: 边框制作 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

 

            引用蓝天学习表格设置做图框 ,梦中人补充一部分

表格设置是代码贴图和制作个人主页的主要基础,表格设置标签属性内容有十多个,可以先从7个常用的学起,逐步提高。先看用表格做成的 一张图片,这张图片宽300,高200,蓝色边框,黄色背景,插入一段文字,内容与边框有一定的距离。

表格设置是代码贴图和制作个人主页的主要基础,表格设置标签属性内容有十多个,可以先从7个常用的学起,逐步提高。

代码:

<CENTER><BR>

<TABLE border=10 borderColor=#0000ff cellSpacing=10 cellpadding=20 bgcolor=fff000 width=500 height=300>

<TBODY><TR><TD>

<font style=font:15pt face=黑体 color=0000ff>

表格设置是代码贴图和制作个人主页的主要基础,

表格设置标签属性内容有十多个,可以先从7个常用的学起,逐步提高。

</CENTER></font></TD></TR></TBODY></TABLE>

注解:

第一行是居中代码。

第二和第三行是表格的始标签,包括表格标签名和7个属性内容。

第四行是表格输入内容的行和列的始标签。(行和列构成一个单元格)

第五行是文字设直标签。

第六和第七行输入文字内容。

第八行是以上各个始标签的对应尾标签 。

表格设置标签属性内容说明:

TABLE=标签名。 

border=10 表格边框的厚度及参数。

borderColor=#0000ff 边框颜色及颜色码。

cellSpacing=10 单元格间距及参数。

cellpadding=20 内容与格线的距离及参数。

bgcolor=fff000 表格的背景颜色及及颜色码。

width=400 表格宽度及参数。

height=300 表格高度及参数。

    表格宽度及表格高度的参数,可用绝对值,如300:也可用相对值,如“100%”。高度如果不是特殊需要时, 也可以不加入参数,系统会根据输入的内容自动延伸。

 


 

 

一张用颜色作背景的空白图框代码:

<CENTER>

<TABLE border=10 borderColor=#0000ff cellSpacing=3 cellpadding=20 bgcolor=fff000 width=500 height=350>

<TBODY>

<TR>

<TD>

<br>

<br>

</CENTER></TD></TR></TBODY></TABLE>

 

 

显示结果:

一张用图片作背景的空白图框代码:

<TABLE border=10 borderColor=#0000ff cellSpacing=3 cellpadding=20 cellpadding=20 background=http://sucai.heima.com/sucai/news/bg/47.jpg width=500 height=350>

<TBODY>

<TR>

<TD>

<br>

<br>

</CENTER></TD></TR></TBODY></TABLE>

 

 

显示结果:

用颜色作背景和用图片作背景不同之处,只改变一个属性内容,即:

表格的背景颜色及颜色码。bgcolor=fff000

改为用图片作背景即:

background=http://sucai.heima.com/sucai/news/bg/47.jpg

在单元格内加入内容,可以在<TD>后面加入,例如加入一张图片:<img src="http://img1.bimg.126.net/photo/NuwSRqK-Qvn68X9_FgeuiQ==/327355397915660697.jpg" align=center>

一张用图片作背景再加入一张图片的图框代码:

<TABLE border=10 borderColor=#0000ff cellSpacing=3 cellpadding=20 cellpadding=20 background=http://sucai.heima.com/sucai/news/bg/47.jpg width=500 height=350>

<TBODY>

<TR>

<TD><img src="http://img1.bimg.126.net/photo/NuwSRqK-Qvn68X9_FgeuiQ==/327355397915660697.jpg" align=center> </CENTER></TD></TR></TBODY></TABLE>

 

 

效果:为了图片取中,去掉了换行代码<br>

学习表格设置做图框 - 梦中人  - 梦中人の梦工场

学习表格设置做图框 - 梦中人  - 梦中人の梦工场 学习表格设置做图框 - 梦中人  - 梦中人の梦工场 学习表格设置做图框 - 梦中人  - 梦中人の梦工场

   博客素材和代码汇编    

   博客技巧、素材、和现成精品代码     

   博客实用代码汇编        

   返回我的首页

  评论这张
 
阅读(885)| 评论(0)

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018