css三选一怎么写

CSS三选一是一种布局技术，可以用来在多个元素中进行选择，并将其中一个元素设置为当前状态。这种效果经常用在导航栏、标签页和选项卡中。

下面是一个基本的CSS三选一的代码示例：

 .active {
        background-color: blue;
        color: white;
    } 

在这个示例中，我们创建了一个叫做.active的CSS类，这个类被用来表示当前被选中的元素。我们定义了一个蓝色背景和白色文本颜色，以突出显示当前状态。

接下来，我们将这个.active类应用到我们的HTML代码中。假设我们有一个具有3个选项卡的导航栏，每个选项卡都由一个标签组成。

 <div class="nav">
        <a class="active" href="#">选项卡1</a>
        <a href="#">选项卡2</a>
        <a href="#">选项卡3</a>
    </div> 

在这个示例中，我们应用了.active类到第一个选项卡的标签上，表示它是当前选中的选项卡。如果用户点击了其他选项卡，我们只需要将.active类移动到新的标签上，就能够创建出渐变效果。可以通过JavaScript来实现这个过程，或者通过使用:checked伪类，当用户点击标签时自动切换选中状态。

总之，CSS三选一是一种受欢迎的布局技术，可以用来在多个元素中进行选择，并突出显示当前状态。它可以在很多场景下使用，包括导航栏、标签页和选项卡等。