css如何写小窗口 |浏览器字体颜色加深css

首先，大家需要在HTML中创建一个按钮，用户点击该按钮时，弹出窗口。

<button id="myButton">点击此处</button>

接下来，大家使用CSS选择器为按钮添加样式。大家希望样式仅适用于该特定按钮，因此大家将使用id选择器。

#myButton {
background-color: grey;
color: white;
border: none;
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
}

现在大家已经为按钮添加了样式，接下来大家需要为小窗口添加样式。大家可以使用伪类选择器”:target”，该选择器可以匹配当前URL中指定的锚点，从而为这个锚点添加样式。

#myWindow:target {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 400px;
height: 400px;
background-color: white;
padding: 20px;
z-index: 1000;
border: 2px solid grey;
box-shadow: 0px 0px 10px black;
}

使用上述CSS样式，大家可以在按钮被点击时，弹出一个大小为400px x 400px的窗口，并在其中展示一些内容。

总之，使用CSS可以轻松地创建小窗口，并增强网站的交互性。通过在HTML中创建按钮并使用CSS选择器为按钮和小窗口添加样式，大家可以在网站上创建强大的交互式功能。