今天偶在研究JS代码和HTML控件,忽然,第一次从书本上看到到fieldset和legend,一时之间,还真不知道这两个东东到底是什么;
按照书上所讲的,将整个过程编写完整,一运行网页,立马就看到最终的显示效果了,大体如下图!
哼,还以为是什么值钱的东西呢,原来是这么回事!
说白了,fieldset和legend是网页中使用的控件和标签;
看上图,fieldset是网页中的一个控件,就相当于分组框,或者我们也可以理解为CS结构的程序的选项卡或页框。
而legend是一个标签,配合着fieldset来使用,它是不能单独使用的,用来给fieldset设置一个标题文字。
两者之间关系紧密,legend依赖fieldset而存在,专为其设置标题文字。而fieldset是legend的父体,专为其提供一个区域;我们也可以这样来理解,fieldset标明了网页中的某个区域,而legend用来说明这个区域的性质,即说明文字。
不相信啊,您可以将如下的代码保存成为网页文件,之后运行看看:
<fieldset>
<legend>分组框的标题文字</legend>
<label for="Character">
您选择的选项是:<br />
</label>
<select id="character" name="character">
<option value="www.dzwebs.net" selected="selected">大众计算机学习网</option>
<option value="www.dz37w.com">大众三七网</option>
<option value="#">未开发的大众网</option>
</select><br />
<input id="MyButton" type="button" name="MyButton" value="显示值" />
<br />
</fieldset>
知识扩展:
不知道大家有没有发现,如果我们在网页中应用fieldset和legend,那么,可以很方便的将网页划分出多个区域,并且,每个区域都有明确的界线,很具有层次感,让用户看了,一目了然;
如果再加上CSS,用来控制fieldset和legend的外观,那么,效果就更上一层楼了,俺在此极力推荐大家使用这种差不多为世人所遗忘的但是效果非常好的控件与标签。