表单进阶(6)-字段集

news2024/9/27 23:22:50

带框的字段集用fieldse ,字段集标头用legent

选中的样式: 圆点用radio,方框用checkbox

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>字段集</title>
    <style>
        /* 单独设置框的样式 */
        fieldset{
            border: 1px solid blue;
            width: 200px;
            height: 200px;
        }

        legend{
            border: 5px solid red;
            text-align: center;
            padding: 10px;
        }
    </style>
</head>
<body>
    <h1>表单进阶-字段集</h1>
    <!-- 带框的字段集用fieldse ,字段集用legent-->
    <fieldset>
        <legend>性别</legend>

        <!--选中的样式: 圆点用radio,方框用checkbox -->
        <input type="radio" name="aa">男
        <br>
        <input type="radio" name="aa">女
    </fieldset>

    <fieldset>
        <legend>爱好</legend>

        <input type="checkbox" name="bb">抽烟
        <br>
        <input type="checkbox" name="bb">喝酒
    </fieldset>
</body>
</html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1507009.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Qt QListwidget与QStackedWidget或QTableWidget实现多界面切换的效果

文章目录 效果图使用QStackedWidget实现使用QTableWidget实现总结 效果图 使用QStackedWidget实现 QStackedWidget提供了一种堆栈式的界面布局方式。功能&#xff1a;QStackedWidget允许开发者在一个固定区域内显示多个子窗口或页面&#xff0c;但同时只显示其中一个子窗口&am…

腾讯云轻量服务器流量用完了怎么办?还能继续用吗?

腾讯云轻量服务器流量用完了怎么办&#xff1f;超额部分的流量另外支付流量费&#xff0c;流量价格为0.8元/GB&#xff0c;会自动扣你的腾讯云余额&#xff0c;如果你的腾讯云账号余额不足&#xff0c;那么你的轻量应用服务器会面临停机&#xff0c;停机后外网无法访问&#xf…

【大厂AI课学习笔记NO.75】人工智能产业的就业岗位分布

见上图&#xff0c;这是详细的人工智能产业的就业岗位分布情况。 就业领域包括物联网、智能芯片、机器学习、深度学习、计算机视觉CV、自然语言处理NLP、智慧语音、机器人、知识图谱等领域。 人工智能作为当今科技革命与产业变革的重要驱动力量&#xff0c;其就业岗位分布广泛…

什么是Python网络爬虫

Python网络爬虫是一种自动化获取网页内容的程序。它可以通过发送HTTP请求&#xff0c;获取网页的HTML代码&#xff0c;并从中提取所需的数据。下面是一个简单的概述&#xff0c;帮助您理解Python网络爬虫的基本原理。 导入所需的库&#xff1a; 在Python中&#xff0c;我们可以…

系统架构设计师精讲班视频教程

本课程将深入探讨系统架构设计原理及实际应用。学员将学习高可用性、扩展性和安全性等方面的设计技巧&#xff0c;掌握微服务架构、云计算和容器化等最新趋势。通过案例分析和项目实践&#xff0c;帮助学员成为系统架构设计领域的专家。 课程大小&#xff1a;7G 课程下载&…

20240310-1-Java后端开发知识体系

Java 基础 知识体系 Questions 1. HashMap 1.8与1.7的区别 1.71.8底层结构数组链表数组链表/红黑树插入方式头插法尾插法计算hash值4次位运算5次异或运算1次位运算1次异或运算扩容、插入先扩容再插入先插入再扩容扩容后位置计算重新hash原位置或原位置旧容量 (1) 扩容因子…

SpringMVC09、Ajax

9、Ajax 9.1、简介 AJAX Asynchronous JavaScript and XML&#xff08;异步的 JavaScript 和 XML&#xff09;。 AJAX 是一种在无需重新加载整个网页的情况下&#xff0c;能够更新部分网页的技术。 Ajax 不是一种新的编程语言&#xff0c;而是一种用于创建更好更快以及交互…

第十五届蓝桥杯模拟考试III_物联网设计与开发

编程题 一、基本要求 使用大赛组委会提供的四梯/国信长天物联网省赛套装&#xff08;基于STM32L071KBU微控制器设计&#xff09;&#xff0c;完成本试题的程序设计与调试。程序编写、调试完成后&#xff0c;选手需提交两个LoRa终端对应的hex文件&#xff0c;LoRa终端A对应的文…

解决轻松解决谷歌浏览器火狐浏览器主页被360导航篡改问题浏览器启动页被篡改为360导航栏等

重置Chrome浏览器设置 尝试重置chrome浏览器全部设置。进入Chrome设置页&#xff0c;点击最下方的“高级设置”。 将鼠标滚到最底部&#xff0c;点击“重置设置” 然后关闭浏览器&#xff0c;重新打开即可。 包括ie几乎所有浏览器都可以重置... 重置火狐浏览器设置 设置——主…

VUE+HBuilder的uniapp技术路线开发应用使用总结

使用总结 本来想做一个记录日常数据的应用&#xff0c;主要在Android端使用&#xff0c;后来发现在uniapp中使用sqllite数据库不是像原生中那样简单(所以当前准备去进行另一个路线&#xff0c;就是给我使用的电脑都安装一个portalble的服务端&#xff0c;用来记录数据&#xf…

linux环境下线程的介绍和POSIX线程接口应用实例

目录 概述 1 线程概念 1.1 线程的特性 1.2 线程的运行状态 2 线程API 2.1 pthread的数据类型 2.2 pthread函数的返回值 2.3 POSIX线程接口 2.3.1 创建线程函数pthread_create 2.3.2 终止线程 2.3.3 线程ID 2.3.4 连接已终止线程 2.3.5 线程分离 3 线程VS进程 4 线…

电子电器架构 —— 车载网关路由表和刷写场景

电子电器架构 —— 车载网关路由表和刷写场景 我是穿拖鞋的汉子,魔都中坚持长期主义的汽车电子工程师。 PS:小细节,本文字数5000+,详细描述了网关在车载框架中的具体性能设置。 老规矩,分享一段喜欢的文字,避免自己成为高知识低文化的工程师: 没有人关注你。也无需有…

leetcode 热题 100_搜索二维矩阵

题解一&#xff1a; 二叉搜索树&#xff1a;从矩阵右上角观察&#xff0c;结构类似二叉搜索树&#xff0c;因此可以用类似的解法来做。具体做法是双指针从右上角开始&#xff0c;向左下角逐步搜索&#xff0c;如果当前值比目标值大&#xff0c;则向下移动&#xff0c;如果当前值…

MQ高可用相关设置

文章目录 前言MQ如何保证消息不丢失RabbitMQRocketMQKafkaMQ MQ如何保证顺序消息RabbitMQRocketMQKafka MQ刷盘机制/集群同步RabbitMQRocketMQKafka 广播消息&集群消息RabbitMQRocketMQ MQ集群架构RabbitMQRocketMQKafka 消息重试RabbitMQRockeMqKafka 死信队列RocketMQKaf…

Linux网络套接字之TCP网络程序

(&#xff61;&#xff65;∀&#xff65;)&#xff89;&#xff9e;嗨&#xff01;你好这里是ky233的主页&#xff1a;这里是ky233的主页&#xff0c;欢迎光临~https://blog.csdn.net/ky233?typeblog 点个关注不迷路⌯▾⌯ 目录 一、接口介绍 1.socket 2.listen 3.accept…

conda 设置国内源 windows+linux

默认的conda源连接不好&#xff0c;时好时坏&#xff0c;而且速度很慢&#xff0c;可以使用国内的源 如果没有安装conda&#xff0c;可以参考&#xff1a; miniconda安装&#xff1a;链接 anaconda安装winlinux&#xff1a;链接 windows使用命令提示符&#xff0c;linux使用…

后端八股笔记------Redis

Redis八股 上两种都有可能导致脏数据 所以使用两次删除缓存的技术&#xff0c;延时是因为数据库有主从问题需要更新&#xff0c;无法达到完全的强一致性&#xff0c;只能达到控制一致性。 一般放入缓存中的数据都是读多写少的数据 业务逻辑代码&#x1f447; 写锁&#x1f4…

Linux网络基础2之https

(&#xff61;&#xff65;∀&#xff65;)&#xff89;&#xff9e;嗨&#xff01;你好这里是ky233的主页&#xff1a;这里是ky233的主页&#xff0c;欢迎光临~https://blog.csdn.net/ky233?typeblog 点个关注不迷路⌯▾⌯ http是明文的可以通过一些的工具获取到正文层&#…

【Spring Boot系列】快速上手 Spring Boot

&#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:kwan 的首页,持续学…

【数学建模】传染病模型笔记

传染病的基本数学模型&#xff0c;研究传染病的传播速度、空间范围、传播途径、动力学机理等问题&#xff0c;以指导对传染病的有效地预防和控制。常见的传染病模型按照传染病类型分为 SI、SIR、SIRS、SEIR 模型等&#xff0c;按照传播机理又分为基于常微分方程、偏微分方程、网…