bikeshedding CSS3 свойство альтернативы?
Есть ли альтернатива bikeshedding
CSS3 свойство? Кажется, это пока не поддерживается.
4 ответа
Свойство пробела
В CSS3 white-space
свойство является сокращением для white-space-collapsing
(Похоже bikeshedding
означает, что они еще не знают, как это назвать) и text-wrap
свойства. white-space
свойство является свойством CSS 2.1, поддерживаемым большинством браузеров, и для него есть два значения, которые сворачивают новые строки:
normal
(Начальное значение).nowrap
Но что означают сворачивающиеся символы перевода строки?
Согласно CSS 2.1:
Если для параметра "Пробел" задано значение "Обычный" или "Nowrap", символы перевода строки преобразуются для визуализации в один из следующих символов: пробел, пробел нулевой ширины (U+200B) или отсутствие символа (т.е. не отображается), в соответствии с алгоритмами, специфичными для UA, на основе сценария содержимого.
Согласно CSS 3:
Пробел нулевой ширины до или после последовательности пробелов, содержащей символ новой строки, приводит к сворачиванию всей последовательности пробелов в пробел нулевой ширины.
реальность:
Большинство браузеров преобразуют символы перевода строки в пробел. Так что вы действительно хотите, чтобы установить white-space-collapsing
собственность на discard
не collapse
или collapse
и затем добавьте символ пробела нулевой ширины перед разрывом строки.
Что делать до поддержки браузера
Удалите пробелы из вашего HTML-документа:
<span>A</span>
<span>B</span>
Для того, чтобы:
<span>A</span><span>B</span>
Или же:
<span>A</span><span>
B</span>
Всегда есть самое очевидное исправление: просто удалить пробел в HTML:
http://jsfiddle.net/F3Mdd/1/ - это действительно легко и просто работает. Из этого:
<div>a</div>
<div>a</div>
к этому:
<div>a</div><div>a</div>
Вот более подробный ответ.
Если честно, я всегда просто убираю пробелы...
Другой подход заключается в простом ожидании этой функции CSS3 и удалении пробелов с помощью Javascript до тех пор.
$('[data-bikeshedding="discard"]').each (function () {
var node = $(this);
node.html (node.find ('> *').detach ());
});
Если я вас правильно понимаю, вы имеете в виду text-spacing
имущество.
Насколько я могу судить, поддержки не так много.