1

我正在创建一个文件拖放效果，当拖动文件时，边框颜色应该会改变。

#upload-photo {
    height: 150px;
    text-align: center;
    line-height: 150px;
    font-size: 18px;
    border-radius: 3px 3px 3px 3px;
    border-style: dashed;
    border:4px dashed #c0c0c0;
}
.upload-photo-border {
    border:4px solid #999;
}

HTML 代码：

<div id="upload-photo">Drop photo here to upload.</div>

jQuery 代码

.............
    dragOver: function() {
        // user dragging files over #dropzone
                $("#upload-photo").addClass("upload-photo-border");
                $('#upload-photo').css('width', '100px');
    },
..........

添加所需的类后，边框颜色仍然不会改变。不确定我是否做错了什么。

4

2 回答 2

3

这是一个具有特异性的问题。使您的类选择器更具体。例如：

#upload-photo.upload-photo-border{
    border:4px solid #999;
}

作为一般规则，请记住 ID 选择器比类选择器更具体，而类选择器又比标签名称选择器更具体。

此外，选择器中出现的部分越多，它就越具体。

于 2012-11-26T10:37:25.047 回答
2

css id 规则比类规则更强大。你可以这样写

#upload-photo.upload-photo-border {
    border:4px solid #999;
}

或使用 !important

.upload-photo-border {
    border:4px solid #999 !important;
}
于 2012-11-26T10:37:47.687 回答