我正在寻找设置背景图像(或甚至通过伪元素渲染图像:之前或之前)到一个rel属性的值,它将是一个URL,但只有在某些情况下(这是一个云文件列表).例如:
HTML:
<div class="icon ${fileExtension}" rel="${fileURL}"></div>
如果我可以做这样的事情会很棒:
CSS:
.icon.png,.icon.jpg,.icon.jpeg,.icon.bmp,.icon.gif { background-image: attr(rel,url); }
…但显然这不起作用,如果我没有错误,attr()CSS函数只能在伪元素块内部工作.
我知道有办法使用条件JSP甚至jQuery逻辑,但是我想通过CSS3找出一个整洁的方式,因为我现在只关心现代浏览器.
此外,我不想明确地将背景图像设置为URL或创建< img>元素,因为默认情况下,如果文件不是支持的图像,我宁愿显示一组预定的图标.