因项目需要,用到了这个以前见过却没有用过的标签,于是搜索了下,看见一篇不错的,分享一下: 实际应用:
一个不常用的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> 下面是上面代码的运行结果:
本文转自:http://fdm0111.blog.163.com/blog/static/81375820074911438563/
相关推荐
jquery fieldset和legend标签代码是一款基于jQuery实现的简单的样式代码。
MyJsp(html的fieldset使用 MyJsp(html的fieldset使用MyJsp(html的fieldset使用MyJsp(html的fieldset使用
HTML中fieldset如何把界面上需要在一块的内容放到一个容器,即分组
第14周-16章节-Python3.5-html的body内标签之fieldset标签和label标签.avi
fieldset标签定义说明.docx
之前HTML没有好好学,导致以前看到控件组样式感觉很新奇,fieldset> 标签将表单内容的一部分打包,生成一组相关表单的字段,接下来对HTML中fieldset标签的使用进行详细解读,感兴趣的朋友可以了解下,或许对你有所帮助
可收放的HTML fieldset。 模仿MSDN的可收放Fieldset 。
FieldSetView是一个Android自定义视图,它模仿HTML中的“ fieldset”标签。 下载 Gradle: 将以下内容添加到您的项目级别build.gradle中: allprojects { repositories { maven { url "https://jitpack.io" } }...
Extjs fieldset两行两列布局
jquery fieldset和legend标签代码是一款基于jQuery实现的简单的样式代码。
<fieldset id="annex1" style="width:800px"> <legend>SubTable 1 SubTable List Field1 Field2 Field3 ...
用Ext自定义一个类似于Fieldset的组件,还有数据绑定昂,跟json数据的交互,和后台交互使用了URLLoader,很强大,之前在网上找了很多,没有找到,后来我师傅给我源码,这里跟大家分享一下,有用到的童鞋们可以参考...
几乎被设计师遗忘了的标签fieldset legend
cmxform-fieldset
* div – 常用块级容易,也是css layout的主要标签 * dl – 定义列表 * fieldset – form控制组 * form – 交互表单 (只能用来容纳其它块元素) * h1 – 大标题 * h2 – 副标题 * h3 – 3级...
响应式Web开发项目教程(HTML5+CSS3+Bootstrap)第2版 第4章 HTML5表单的应用 例4-6 fieldset
Flex3自定义组件类似于Fieldset
表单代码如图,还没有加入样式表,表单没有对齐,比较难看,但是HTML又没有提供表单对齐的标签或功能。 html源代码: <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <...
框架页面 <h1><a href="#">blue brush </a></h1> <p> design by <a href="http://www.mbsky.com/">... <fieldset> </fieldset> <!-- end #search --> </div>
strong……我们在运用这些标签搭建页面结构的时候,是可以将它们无限嵌套的,但是,嵌套也需要有一定规则,不能任由自己的个人习惯胡乱嵌套,那么,html标签的嵌套规则有哪些呢? 一、HTML 标签包括 块级元素(block)...