fieldset——一个不常用的HTML标签
来源:互联网 发布:数据网关是什么 编辑:程序博客网 时间:2024/05/18 00:23
一个不常用的HTML标签fieldset,不过我觉得比较有意思,其语法如下:
<fieldset>
<legend>fieldset名称</legend>
<!-- 加入你的内容 -->
</fieldset>
下面是一个代码示例:
<center>
<fieldset style=" width:300px">
<legend>用户登陆</legend>
<form method="post">
帐号:<input ></input>
<br><br>
密码:<input type="password" ></input>
<br><br>
<input type="submit" value="登陆" ></input>
<input type="reset" value="重填" ></input>
</form>
</fieldset>
</center>
代码的实际效果如下:
fieldset 标签 -- 对表单进行分组
- 此标签是成对出现的,以
<fieldset>
开始,以</fieldset>
结束 - 一个表单可以有多个
<fieldset>
,每对<fieldset>
为一组,每组的内容描述可以使用<legend>
说明<form
action
=
"http://www.dreamdu.com/dreamdu.php"
method
=
"post"
enctype
=
"multipart/form-data"
id
=
"dreamduform"
>
<fieldset>
<legend>
用户名与密码:</legend>
<input
name
=
"hiddenField"
type
=
"hidden"
value
=
"hiddenvalue"
/>
<label
for
=
"username"
>
用户名:</label>
<input
type
=
"text"
id
=
"username"
value
=
"www.dreamdu.com"
/>
<label
for
=
"pass"
>
密码:</label>
<input
type
=
"password"
id
=
"pass"
/>
</fieldset>
<fieldset>
<legend>
性别:</legend>
<label
for
=
"boy"
>
男</label>
<input
type
=
"radio"
value
=
"1"
id
=
"sex"
/>
<label
for
=
"girl"
>
女</label>
<input
type
=
"radio"
value
=
"2"
id
=
"sex"
/>
<label
for
=
"sex"
>
保密</label>
<input
type
=
"radio"
value
=
"3"
id
=
"sex"
/>
</fieldset>
<fieldset>
<legend>
我最喜爱的:</legend>
<label
for
=
"computer"
>
计算机</label>
<input
type
=
"checkbox"
value
=
"1"
id
=
"fav"
/>
<label
for
=
"trval"
>
旅游</label>
<input
type
=
"checkbox"
value
=
"2"
id
=
"fav"
/>
<label
for
=
"buy"
>
购物</label>
<input
type
=
"checkbox"
value
=
"3"
id
=
"fav"
/>
</fieldset>
<fieldset>
<legend>
对梦之都的意见:</legend>
<label
for
=
"select"
>
你对梦之都的感觉</label>
<select
size
=
"1"
id
=
"select"
>
<option>
很全面,很好</option>
<option>
一般般吧,还要努力</option>
<option>
有很多问题,不过还可以</option>
</select>
</fieldset>
<fieldset>
<legend>
梦之都编程语言选择:</legend>
<label
for
=
"multipleselect"
>
你想在梦之都学习的编程语言</label>
<select
size
=
"10"
multiple
=
"multiple"
id
=
"multipleselect"
>
<option>
XHTML</option>
<option>
CSS</option>
<option>
JAVASCRIPT</option>
<option>
XML</option>
<option>
PHP</option>
<option>
C#</option>
<option>
JAVA</option>
<option>
C++</option>
<option>
PERL</option>
</select>
</fieldset>
<fieldset>
<legend>
我要在梦之都学:</legend>
<label
for
=
"WebDesign"
>
选择一个你在梦之都最想学的</label>
<select
id
=
"WebDesign"
>
<optgroup
label
=
"client"
>
<option
value
=
"HTML"
>
HTML</option>
<option
value
=
"CSS"
>
CSS</option>
<option
value
=
"javascript"
>
javascript</option>
</optgroup>
<optgroup
label
=
"server"
>
<option
value
=
"PHP"
>
PHP</option>
<option
value
=
"ASP"
>
ASP</option>
<option
value
=
"JSP"
>
JSP</option>
</optgroup>
<optgroup
label
=
"database"
>
<option
value
=
"Access"
>
Access</option>
<option
value
=
"MySQL"
>
MySQL</option>
<option
value
=
"SQLServer"
>
SQLServer</option>
</optgroup>
</select>
</fieldset>
<fieldset>
<legend>
个人化信息:</legend>
<label
for
=
"myimage"
>
个性照片上传</label>
<input
type
=
"file"
id
=
"myimage"
size
=
"35"
maxlength
=
"255"
/>
<label
for
=
"contactus"
>
联系我们</label>
<textarea
cols
=
"50"
rows
=
"10"
id
=
"contactus"
>
dreamer dreamdu[at]163[dot]com</textarea>
</fieldset>
<fieldset>
<legend>
提交:</legend>
<input
type
=
"submit"
value
=
"submit"
id
=
"submit"
/>
<input
type
=
"reset"
value
=
"reset"
id
=
"reset"
/>
</fieldset>
</form>
下面是上面代码的运行结果:
样式一
代码如下:
<fieldset style="width:300;height:150;border:2px groove" align=center></fieldset>
样式二
代码如下:
<fieldset style="width:300;height:150;border:2px red groove" align=center></fieldset>
样式三
代码如下:
<fieldset style="width:300;height:150;border:2px red groove; Background-color:#ff9966" align=center></fieldset>
样式四
代码如下:
<fieldset style="width:300;height:150;border:1px dashed #ff9966" align="center" >
<legend style="border:0px;background-color:white;">
1234
</legend>
</fieldset>
样式五
代码如下:
<fieldset style="width:300;height:150;border:1px dashed red" align="center">
<legend style="width:100px;border:1px dashed #ff9966;background-color:#ff0000;text-align:center;font-family:arial;font-weight:bold">
1234
</legend>
</fieldset>
样式六
代码如下:
<table border=0 cellPadding=0 cellSpacing=0 align="center">
<tr><td bgcolor=#d9d9d9>
<fieldset style="width:300;height:150" align=center></fieldset>
</td><tr>
</table>
0 0
- 一个不常用的HTML标签——fieldset
- 一个不常用的HTML标签——fieldset
- fieldset——一个不常用的HTML标签
- fieldset——一个不常用的HTML标签
- fieldset是一个不常用的HTML标签
- HTML中的一个不常用单非常实用的标签<fieldset>
- Fieldset,一个不常用的HTML标签 (表单分组实现效果,象Winfrom 里的GroupBox 在左上角显示标题.)
- fieldset——一个浮游在边框之上的HTML标签
- HTML <fieldset> 标签的使用
- HTML中 的fieldset标签、legend标签
- [转]容易被忽略的html标签之——<fieldset>
- HTML中的FieldSet标签的使用
- 不常用的HTML标签
- 不常用的HTML标签
- html不常用的标签
- html 不常用的标签
- HTML标签fieldset
- html中的fieldset标签
- vim键盘图
- POJ 3083 Children of the Candy Corn (DFS + BFS)
- List或者arraylist去掉重复数据(对象也可以)
- QT版本为4.7.3的移植(简化版)
- 偏移量为 0x0000000009c000 的位置执行 读取 期间,操作系统已经向 SQL Server 返回了错误 21
- fieldset——一个不常用的HTML标签
- 【DAO】基于apache.commons.dbcp的DAO数据层的代码
- 获取sql语句的执行情况近来我的oracle数据库(9201)运行慢
- mysql如何导出数据
- selenium中常用的关键字总结
- POJ 1321 棋盘问题 (DFS)
- 关于电脑如何选择64位操作系统
- iOS开发学习路径的一些建议
- Introduction to Distributed System Design