CSS在窗体外部隐藏带有单选按钮的div

基础概念

CSS（层叠样式表）是一种用于描述HTML或XML（包括SVG、MathML等各种XML方言）文档样式的样式表语言。通过CSS，可以控制网页元素的布局、颜色、字体等视觉效果。

类型

CSS样式表可以分为三种类型：

内联样式：直接在HTML元素中使用style属性定义样式。
内部样式表：在HTML文档的<head>部分使用<style>标签定义样式。
外部样式表：将CSS代码保存在一个单独的文件中，并通过<link>标签引入到HTML文档中。

应用场景

CSS广泛应用于各种网页设计和开发中，包括但不限于：

网页布局：通过CSS可以控制网页元素的排列方式，如浮动、定位等。
视觉效果：通过CSS可以设置网页元素的颜色、字体、背景等视觉效果。
响应式设计：通过CSS媒体查询可以实现不同设备上的自适应布局。

问题解决

要在窗体外部隐藏带有单选按钮的div，可以使用CSS的display属性将其设置为none。以下是几种实现方式：

内联样式

<div style="display: none;">
  <input type="radio" name="example" value="option1"> Option 1
  <input type="radio" name="example" value="option2"> Option 2
</div>

内部样式表

<!DOCTYPE html>
<html>
<head>
  <style>
    .hidden {
      display: none;
    }
  </style>
</head>
<body>
  <div class="hidden">
    <input type="radio" name="example" value="option1"> Option 1
    <input type="radio" name="example" value="option2"> Option 2
  </div>
</body>
</html>

外部样式表

HTML文件：

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <div class="hidden">
    <input type="radio" name="example" value="option1"> Option 1
    <input type="radio" name="example" value="option2"> Option 2
  </div>
</body>
</html>

CSS文件（styles.css）：