代码改变世界

带表题的表格。很美观哦……HTML标签 fieldset

  沐海  阅读(620)  评论(0编辑  收藏  举报

HTML <fieldset> 标签

定义和用法

fieldset 元素可将表单内的相关元素分组。

<fieldset> 标签将表单内容的一部分打包,生成一组相关表单的字段。

当一组表单元素放到 <fieldset> 标签内时,浏览器会以特殊方式来显示它们,它们可能有特殊的边界、3D 效果,或者甚至可创建一个子表单来处理这些元素。

<fieldset> 标签没有必需的或唯一的属性。

<legend> 标签为 fieldset 元素定义标题。

 

<html>
 
<body>
 <style type="text/css">
        fieldset
        {
            padding: 0;
            margin-top: 0px;
            width: 300px;
            border: 1px solid #A4CDF2;
            background: #fff;
        }
        fieldset legend
        {
            color: #1E7ACE;
            font-weight: bold;
            padding: 3px 20px 3px 20px;
            border: 1px solid #A4CDF2;
            background: #fff;
        }
        .maintable
        {
            position: absolute;
        }
        #show
        {
            position: absolute;
            top: 25px;
            right: 0px;
            z-index: 2;
        }
        .hight
        {
            color: #135294;
            font-weight: bold;
        }
    </style>
<fieldset>
<legend>最开心:</legend>
<form>
<label>学习:<input type="text" /></label></br>
<label>睡觉:<input type="text" /></label>
</form>
</fieldset>
 
<p>如果表单周围没有边框,说明您的浏览器太老了。</p>
 
</body>
</html>
编辑推荐:
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
阅读排行:
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· .NET周刊【3月第1期 2025-03-02】
· 分享 3 个 .NET 开源的文件压缩处理库,助力快速实现文件压缩解压功能!
· [AI/GPT/综述] AI Agent的设计模式综述
记录生活、工作、学习点滴!
E-Mail:mahaisong@hotmail.com 欢迎大家讨论。
沐海博客园,我有一颗,卓越的心!
点击右上角即可分享
微信分享提示