笔者在做网站设计网页的时候,经常需要实现这样的效果:把页面显示的元素按分类(或者说按组)来显示。这样说理解起来很费力,上个图就清晰明了了。 这种分块的页面显示,笔者很是喜欢。特别是每一个块状都有围起来border,在块的标题不在块外也不在块内,而嵌在块的border当中。 笔者在以前曾经这样实现过这种效果:2个或3个div。div1作为拥有border的div,div2作为标题,用绝对定位的方法来固定在div1的border中。这种实现当然需要div2设置背景,而且div2的index要高于div1。div3可作为块内内容div。 这种实现方法也不太复杂。但毕竟采用的元素定位使得代价有点大。 其实我们可以采用FIELDSET标签轻松实现上述的效果。那么实现的代码是: 很简洁的代码就可以实现了!而且这个标签兼容各大浏览器。虽然在表现上面有小差别,但并不影响分块,也不会导致元素在不同浏览器下错位。 扩展 转载此文请注明源文出处:http://www.aszx0413.com/blog<fieldset>
<legend>这里面是标题<legend>
这里面是FIELDSET标签内的内容。
这里面是FIELDSET标签内的内容。
</fieldset>
该标签的属性与样式与标准的一样。但在浏览器兼容方面有些差异:在IE6+中块的边框表现为圆角;在Firefox和chrome下都是直角。FF支持CSS3,所以解决FF下的圆角问题很简单:为fieldset标签的样式加上-moz-border-radius:5px即可。
但在chrome下圆角无解。
很多时候我们希望legend标签中的标题居中,用fieldset的text-align是解决不了的。但可以设置legend的属性align=”center”(w3c不赞成使用此属性)。
详细解决方案
Html标签-Fieldset学习与应用
热度:171 发布时间:2012-10-06 17:34:01.0
相关解决方案
- 访问Tomcat的url的时候如何自动调用index.html
- The requested resource (/webtest/servlet/hello.html) is not availabl 帮忙解决解决方法
- JSP 页面乱码 页面起首已设置 contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"
- html js不运行有关问题
- 办公自动化系统——议程管理(用jsp+servlet+js+html+jdbc)怎样实现
- <html:text>property的有关问题
- 关于<html:text>相关的有关问题
- Struts 1.2 html:form的action和form的action区别,还有如果2个都有执行哪个解决方案
- 简单计算器(html+js),该怎么解决
- HTML 小疑点,哪位高手解决 给哪位高手分
- 嵌入JSP中的CSS显示效果和在 HTML 中的不一样.为什么.该怎么解决
- struts1 中<html:checkbox>标签的value值怎么动态赋值
- 新人求问,J2EE方向,html,css,javascript,vml要学到什么程度?解决思路
- :前台和后台开发有啥区别?还有css、html、ajax、js、jquery都有什么区别
- struts <html:file> 怎么让前面的框消失,先谢过了
- =Html.TextAreaFor的文本区域大小如何设置
- 正则表达式 提取 html 标签的内容,该如何解决
- @Html.CkEditor,该怎么处理
- string msg = (string)html.ViewData["Message"];该如何处理
- html password editbox 编码有关问题
- @Html.TextBoxFor(a => a.Title 上边有红线,说异常
- 关于伪静态,怎么配置.html
- MVC中,Html.DropDownListFor怎么绑定数据
- 为何FCKeditor会在自动生成<html>标签呢
- MVC 中得 Html.ActionLink 怎么linkText显示图片标记
- <DOCTYPE html. 这个是有什么用?该如何处理
- asp.net C# 将网页变换为.html 格式
- @Html.ActionLink 基础解决办法
- 怎么引用一个 Html 控件对象
- HTML DOM setTimeout() 跟 setInterval() 的区别 ?———急——