css中的伪类on,CSS“onclick”伪类不工作

我的目的是显示模式表单，并在用户点击角落处的[x]按钮或在10秒后自动关闭时关闭它。

唯一的问题是当我单击[x]按钮时表单无法关闭。下面的代码有什么问题？

的index.html：

X

Hi, this is modal form.

setTimeout(function() {

$('#openModal').fadeOut('slow'); }, 10000);

的style.css：

.modalDialog:target {

opacity:0;

}

.modalDialog {

position: fixed;

font-family: Arial, Helvetica, sans-serif;

top: 28%;

right: 0;

bottom: 0;

left: 0;

z-index: 99999;

-webkit-transition: opacity 400ms ease-in;

-moz-transition: opacity 400ms ease-in;

transition: opacity 400ms ease-in;

}

.modalDialog > div {

width: 600px;

position: relative;

margin: 10% auto;

padding: 5px 20px 13px 20px;

border-radius: 10px;

background: #fff;

background: -moz-linear-gradient(#fff, #999);

background: -webkit-linear-gradient(#fff, #999);

background: -o-linear-gradient(#fff, #999);

}

.close {

background: #606061;

color: #FFFFFF;

line-height: 25px;

position: absolute;

right: -12px;

text-align: center;

top: -10px;

width: 24px;

text-decoration: none;

font-weight: bold;

-webkit-border-radius: 12px;

-moz-border-radius: 12px;

border-radius: 12px;

-moz-box-shadow: 1px 1px 3px #000;

-webkit-box-shadow: 1px 1px 3px #000;

box-shadow: 1px 1px 3px #000;

}

.close:hover { background: #00d9ff; }