CSS实现带遮罩层可关闭的弹窗效果
实际开发中常常少不了使用弹窗,在学习css3的时候我发现可以通过纯css实现带遮罩层可关闭的弹窗。 使用CSS3实现带遮罩层可关闭的弹窗需要用到 :target伪类,::before 、::after伪元素。 实现弹窗的代码: <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <title>Title</title> <style> /*关闭弹窗*/ .popBox {
实际开发中常常少不了使用弹窗,在学习css3的时候我发现可以通过纯css实现带遮罩层可关闭的弹窗。 使用CSS3实现带遮罩层可关闭的弹窗需要用到 :target伪类,::before 、::after伪元素。 实现弹窗的代码: <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <title>Title</title> <style> /*关闭弹窗*/ .popBox {