开发者

How to escape quotes in inline styles?

开发者 https://www.devze.com 2023-02-18 18:54 出处:网络
If I have an inline stylesheet, can and I want - for some strange reason - use the same quotes that u used to encapsulate the attribute value in my html code inside the css.

If I have an inline stylesheet, can and I want - for some strange reason - use the same quotes that u used to encapsulate the attribute value in my html code inside the css.

Is one of these correct?

<div style="background: url(\"http://my-url.com/img.jpg\")"></div>


<div style="background: url(&开发者_StackOverflow中文版quot;http://my-url.com/img.jpg&quot;)"></div>

I think the first one is correct and the second one is nonsense. Am I right or not, and why?

edit:

A co worker wrote it the second way, and the problem was that some browsers (included but not necessarily limited to internet explorer 6+7+8) requested the url INCLUDING the " signs which resultet in an 404 request.

edit 2:

okay now its really getting weird. this is the original code copy and pasted from our file.

<div class="cover" style="background-image: url(&quot;http://www.flimmit.com/media/search/filmcovers/105x152/ka/false/kf/false/F7780E.jpg&quot;);">

and this is straight from our error log:

13:09:45 (0.2424) [header] requ_uri        /schauspieler/Kelly+Trump/"http:/www.flimmit.com/media/search/filmcovers/105x152/ka/false/kf/false/F6TYO8.jpg"
Mar 18 13:09:45 (0.0001) [header] server_addr     10.48.195.172
Mar 18 13:09:45 (0.0001) [header] http_user_agent Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0; Trident/4.0; GTB6.6; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; eSobiSubscriber 2.0.4.16; .NET CLR 3.5.30729; .NET CLR 3.0.30729; .NET4.0C; AskTbFF/5.9.1.14019)
Mar 18 13:09:45 (0.0001) [error] 404-Seite wurde aufgerufen
Mar 18 13:09:45 (0.0386) [header] remote_ip       212.95.7.69 - AT
Mar 18 13:09:45 (0.0001) [header] visitor_id      4095543, -
Mar 18 13:09:45 (0.0001) [header] requ_url        http://www.flimmit.com/schauspieler/Kelly+Trump/"http:/www.flimmit.com/media/search/filmcovers/105x152/ka/false/kf/false/F6TYO8.jpg"
Mar 18 13:09:45 (0.0001) [header] http_referer    http://www.flimmit.com/schauspieler/Kelly+Trump/
Mar 18 13:09:45 (0.0000) [header] finished at 0.2816

this was an IE8 client. on IE6 the request uri even has &quot; instead of " in it.

So either we are all wrong or internet explorer is not respecting any standards?


use single quotes and I think it should be round brackets:

<div style="background: url('http://my-url.com/img.jpg')"></div>

The &quot; works too (tested in jsFiddle):

<div style="background: url(&quot;http://my-url.com/img.jpg&quot;)">test</div>


First off, why?

You should be using () instead of '{}'

This way is best:

<div style="background: url('http://my-url.com/img.jpg')"></div>

This way is fine:

<div style="background: url(&quot;http://my-url.com/img.jpg&quot;)"></div>

This also works:

<div style="background: url(http://my-url.com/img.jpg)"></div>

This doesn't work:

<div style="background: url(\"http://my-url.com/img.jpg\")"></div>

Note: Remove the space after url.


The second option is the correct one, as far as escaping is concerned:

<div style="background: url {&quot;http://my-url.com/img.jpg&quot;}"></div>

To escape double-quotes in HTML you use &quot;, whether in attributes or not.

See this jsfiddle (taken from this SO answer).


If you want to use multiple double and single quotation

you can combine double and single quotation together (nested)

style="background-image: url( 'image.jpg' );"

or

style='background-image: url( "image.jpg" );'

and available to be more nested

like (if you're using template for framework (Django))

 style="background-image: url( ' {% static "image.jpg"   %}' ); "
0

精彩评论

暂无评论...
验证码 换一张
取 消