css点击出现一个界面 |css 图片撑满

css190321，css

< p>高度，淘宝状态栏css，css灰色图片变正常，怎么在css中加入歌曲，导航栏默认设置css，css 图片撑满 css点击出现一个界面 |css 图片撑满

HTML 代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSS 点击出现一个界面示例</title>
<style type="text/css">
#box {
display: none;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 300px;
height: 200px;
background-color: #fff;
border: 1px solid #ccc;
}
#btn:hover + #box {
display: block;
}
</style>
</head>
<body>
<button id="btn">点击出现</button>
<div id="box">
<p>这是一个通过 CSS 点击出现的界面</p>
</div>
</body>
</html>

在上述代码中，利用 CSS 选择器控制了按钮的 hover 事件，触发显示 box 元素。其中，box 元素最初使用 display: none；属性隐藏起来，display: block；属性则显示出来。

当然，CSS 选择器并不仅限于 hover 事件。除了 a 标签外，也可以使用 label 标签和 radio/checkbox 实现点击出现界面效果。

希望以上内容对您有所帮助，若有不足之处，欢迎指出。