我有一个CSS类Modal它是绝对定位,z-indexed上面的父,并很好地定位与JQuery。我想添加一个插入符号(^)到模态框的顶部,并正在使用:CSS伪选择器之前做这个干净。
图像需要绝对定位和z-index高于模态,但我没有找到任何方法添加适当的类到图像的内容属性:
.Modal:before{ content:url('blackCarrot.png') /* with class ModalCarrot ??*/ } .ModalCarrot{ position:absolute; left:50%; margin-left:-8px; top:-16px; }
解决方法@H_404_10@
http://caniuse.com/#search=:after
:after和:before之前的内容都可以使用,因为它们在除Internet Explorer以外的每个主要浏览器中至少支持5个版本。 Internet Explorer在版本9中提供完全支持,在版本8中提供部分支持。
这是您要找的?
.Modal:after{
content:url('blackCarrot.png'); /* with class ModalCarrot ??*/
position:relative; /*or absolute*/
z-index:100000; /*a number that's more than the modal Box*/
left:-50px;
top:10px;
}
.ModalCarrot{
position:absolute;
left:50%;
margin-left:-8px;
top:-16px;
}
如果没有,你能解释一点更好吗?
或者你可以使用jQuery,比如Joshua说:
$(“。Modal”)。before(“< img src ='blackCarrot.png'class ='ModalCarrot'/>”);
:after和:before之前的内容都可以使用,因为它们在除Internet Explorer以外的每个主要浏览器中至少支持5个版本。 Internet Explorer在版本9中提供完全支持,在版本8中提供部分支持。
这是您要找的?
.Modal:after{ content:url('blackCarrot.png'); /* with class ModalCarrot ??*/ position:relative; /*or absolute*/ z-index:100000; /*a number that's more than the modal Box*/ left:-50px; top:10px; } .ModalCarrot{ position:absolute; left:50%; margin-left:-8px; top:-16px; }
如果没有,你能解释一点更好吗?
或者你可以使用jQuery,比如Joshua说:
$(“。Modal”)。before(“< img src ='blackCarrot.png'class ='ModalCarrot'/>”);