在CSS源代码中拆分长文字

Question

有没有办法在多行上拆分CSS文字？ 我对内联图像特别感兴趣，例如，此规则可以起作用，但不容易处理

.some-class { 
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAAN...etc...etc...gg==)
}

Answer 1

尝试这个：

.some-class { 
  background-image:url('data:image/png;base64,iVBORw0KGgo\
AAAAN...etc...etc...gg==')
}

环绕宽度的引号要比休息前的反斜杠

我在这里分割了第一行： http : //jsfiddle.net/Xadvz/543/

Answer 2

似乎不适用于http-requests 。

否则使用\\ 。

例：

 .background-image { width: 100px; height: 100px; display: block; background-size: cover; } .first-child { border: 1px solid black; background-image: url('http://lorempixel.com/image_\\ output/animals-qc-100-100-3.jpg'); } .last-child { /*Splitting long literals*/ background-image: url('data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulr\\ SOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7'); 

 <div class="background-image first-child"> <!-- Empty block --> </div> <div class="background-image last-child"> <!-- Empty block --> </div>