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

启野的博客

淡淡的雾,淡淡的雨,淡淡的云彩悠悠的游。

 
 
 

日志

 
 

HTML <fieldset> 标签应用一  

2011-03-18 20:45:55|  分类: HTML专区 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
 

HTML

<fieldset> 标签应用一

 

圆角的文本框与直角的文本框博文简介

 

 

HTML <fieldset>标签圆角的文本框

HTML <TABLE>标签表格直角的文本框

HTML <fieldset>标签圆角的文本框与HTML <TABLE>标签表格直角的文本框之间相互变化嵌套形成不同类型的文本框,在这里忽略边框的颜色,因为HTML <fieldset>标签得边框的颜色无法设置。

1、HTML <legend>标签标题栏内加入HTML <TABLE>标签表格

相关设置详细说明

HTML基本代码

示例

 

HTML <fieldset>标签代码

 

<form>

  <fieldset>

    <legend>标题文本</legend>

    文本编辑

  </fieldset>

</form>

 

HTML <TABLE>标签代码

 

<TABLE cellSpacing=0 cellPadding=0 border=1>

<TBODY>

<TR>

<TD>文本编辑</TD></TR>

</TBODY>

</TABLE>

 

cellSpacing=0单元格间距属性

cellPadding=0单元格边距属性

在这里需要设置单线,设置为cellSpacing=0,如你需要自行设置。

 

相关HTML <TABLE>标签表格,参照右下角链接点击查看。

 

 

<form>
  <fieldset>
    <legend><TABLE cellSpacing=0 cellPadding=0 border=1>
<TBODY>
<TR>
<TD>文本编辑</TD></TR></TBODY></TABLE>
</legend>
    文本编辑
  </fieldset>
</form>

 

           

cellSpacing=0时的示例

            
文本编辑
文本编辑

 

cellSpacing=1时的示例

    

文本编辑
文本编辑

 
2、文本编辑框内加入HTML <TABLE>标签表格

相关设置详细说明

HTML基本代码

示例

 

 

同上,只不过插入的位置不同。

 

<form>
  <fieldset>
    <legend>标题文本</legend>
<TABLE cellSpacing=0 cellPadding=0 border=1>
<TBODY>
<TR>
<TD>文本编辑</TD></TR></TBODY></TABLE>
  </fieldset>

 

        

    

           
标题文本
文本编辑

 

 

3、HTML <TABLE>标签表格为HTML <fieldset> 标签圆角的文本框添加背景

相关设置详细说明

HTML基本代码

示例

 

背景颜色属性 Bgcolor=颜色代码

背景图像属性 BACKGROUND=背景图片地址

 

单元格间距属性 cellSpacing=10

单元格边距属性 cellPadding=10

 

添加背景颜色代码:

<TABLE cellSpacing=10 cellPadding=10 width=100% Bgcolor=颜色代码 border=0>
<TBODY>
<TR>
<TD><form>
  <fieldset>
    <legend>标题文本</legend>
    文本编辑
  </fieldset>
</form>
</TD></TR></TBODY></TABLE>

添加背景图片代码:

<TABLE cellSpacing=10 cellPadding=10 width=100% background=背景图片地址 border=0>
<TBODY>
<TR>
<TD><form>
  <fieldset>
    <legend>标题文本</legend>
    文本编辑
  </fieldset>
</form></TD></TR></TBODY></TABLE>

 

 

添加背景颜色示例

标题文本文本编辑

 

添加背景图片示例

 

标题文本文本编辑

 

欢迎光临启野博客!
  评论这张
 
阅读(1556)| 评论(0)
推荐 转载

历史上的今天

评论

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

页脚

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