CSS attr（）URLパスとの連結

Question

url（）フィールドのCSS attr（）セレクタを静的テキストと連結するにはどうすればよいですか？

HTML私が使用します。たとえば

<div image='/Require/static.png'></div> //Example 2 
<div image='static.png'></div> //Example 3, 4, 5 

：

は

//image attribute contains the image name (and prefix location when needed, see example 2) 
div[image]:before { 
    background-image: url('/Image/static.png'); //Works 
    background-image: url(attr(image)); // Works 
    background-image: url('/Image/' attr(image)); //Fails 
    background-image: url('/Image/' #attr(image)); //Fails 
    background-image: url('/Image/' {attr(image)); //Fails 
    } 

だから - それが可能であれば - どのように私はこれを達成することができますか？

Answer 1

2つ以上の文字列のうち、合成値url()を作成することはできません。従来のurl()値の上には、適切なCSS機能（Is there a way to interpolate CSS variables with url()? - カスタムプロパティでもこれを行うことができないことを意味します）がありません。で定義されたurl()の適切なCSS関数バージョンは、文字列。

あなたはcontent宣言で複数の文字列を連結することができますが、that is a feature of the content property、ないCSS内の文字列の。

---

_{url()は、単一の文字列を受け付けているので、これは単一attr()がbrowser support is nonexistent除いて... attr(image url)として、URL値、also new to css-values-3として用いることができることを意味します。}