CSS中可以通過控制元素的display屬性實現彈出窗口的效果。主要用到的有三種方式：
1. 使用position屬性控制元素的位置，然后設置display屬性為none，當需要彈出窗口時設置display屬性為block。
例：
.popup {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: none;
}
.show-popup {
display: block;
}
HTML:這是彈出窗口2. 使用:target偽類實現，給彈出窗口定義一個id，然后使用標簽的href屬性指向該id，在需要彈出窗口時點擊標簽即可。
例：
.popup {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: none;
}
.popup:target {
display: block;
}
HTML：打開彈出窗口這是彈出窗口3. 使用checkbox實現，將checkbox隱藏，用label標簽代替checkbox，當label被選中時顯示彈出框。
例：
.popup {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: none;
}
#popup:checked ~ .popup {
display: block;
}
HTML：這是彈出窗口以上是CSS實現多種彈出窗口的方式，各有優缺點，大家可以根據需要進行選擇。