Which type of quotes we should use in css background url (“…”)? Single, double or no quote needed? [duplicate]

Question

This question already has an answer here:

• Is quoting the value of url() really necessary? 7 answers

this

background:url(http://url);

this

background:url("http://url");

or this

background:url('http://url');

Answer 1

The URL bits of all three of your examples are valid CSS, according to the CSS specification.

Note that the spec identifies some characters in a URL which will need to be escaped with a backslash if present in an unquoted URI, such as parentheses, commas, white space characters, single quotes (') and double quotes ("). For this reason, you might find it better to use single or double quotes around your URLs.

Note that you need to write your full CSS property in the format:

background: url( http://example.com );

Answer 2

I don't think any are right. It should be one of these:

background: url(http://url)

background: url("http://url")

background: url('http://url')

Note the colon, instead of curly braces.

Answer 3

It is your choice, according to W3:

The format of a URI value is 'url(' followed by optional white space followed by an optional single quote (') or double quote (") character followed by the URI itself, followed by an optional single quote (') or double quote (") character followed by optional white space followed by ')'. The two quote characters must be the same.

Answer 4

I use the one without quotes. I remember reading something by Zeldman that said it was the least likely to cause problems with legacy browsers. I believe the browser he mentioned was ancient, like Netscape 2 or something. Nowadays, it wouldn't matter which style you use.

Answer 5

It seems any of the quoted or non quoted are acceptable (http://www.w3.org/TR/css3-background/)

BUT these below are only used IF you are referencing resource outside of your domain.

background: url(http://url)
background: url("http://url")
background: url('http://url')

IF you are on the same domain: (The "HTTP://" is not required, as previously mentioned)

background: url(/path/to/file)
background: url("/path/to/file")
background: url('/path/to/file')