Свойство пробела между блоками - PullRequest
Новая
       7

Свойство пробела между блоками

3 голосов
/ 03 июля 2010

Предполагается, что свойство CSS "пробел" может влиять на пробелы между элементами блока?

Например, в документе, используемом в качестве примера в « Пробелы в DOM », как показано ниже, между </h1> и <p>:

есть пробел. 
<!-- My document -->
<html>
<head>
  <title>My Document</title>
</head>
<body>
  <h1>Header</h1>
  <p>
    Paragraph
  </p>
</body>
</html>

Этот пробел обычно удаляется; например, спецификация XHTML говорит, что соответствующий пользовательский агент должен соответствовать всем следующим критериям :

В элементах, где 'xml: space' атрибут установлен на «сохранить», пользовательский агент должен оставить все пробелы неповрежденные символы (за исключением ведущих и конечных пробелов символы, которые должны быть удалены). В противном случае пробел обрабатывается согласно следующим правилам:

  • Все пустые окружающие элементы блока должны быть удалены.
  • Начальные и конечные пробелы внутри элемента блока должны быть удален.
  • Символы перевода строки в элементе блока должны быть преобразованы в пробел (кроме случаев, когда атрибут 'xml: space' установлен на «сохранить»).
  • Последовательность символов пробела должна быть уменьшена до одного пробела символ (кроме случаев, когда 'xml: space' для атрибута установлено значение «сохранить»).

У меня следующие вопросы:

  • Если я использую CSS-пробел в <body>, это позволит сохранить пробел между элементами блока (например, между </h1> и <p> )? Или пробелы между блоками всегда удаляются, а свойство пробелов влияет только на пробелы внутри блоков?

  • Спецификация XHTML говорит, что <body> не может напрямую содержать PCDATA (т.е. текст). Означает ли это, что пробел (являющийся разновидностью текста), который является прямым потомком тега <body>, всегда незначителен / игнорируется и не может быть включен через CSS? Если да и пробел между </h1> и <p> в вышеприведенном примере были проигнорированы, поскольку он является прямым потомком <body>, будет / не будет ли этот пробел все еще игнорироваться, если бы <div style="white-space: pre"> был непосредственно внутри <body> и включая все остальные элементы?

  • Модель обработки «пустого пространства» начинается с «Любой текст, который непосредственно содержится внутри элемента блока (не внутри встроенного элемента), должен рассматриваться как анонимный встроенный элемент» , Что я должен понимать о чистых пробелах (пробелах без текста)?

  • Существует ли правило (и если да, где это правило определено) об удалении пробелов внутри встроенных элементов? Например, в следующей последовательности <p>The <strong> lazy </strong> dog.</p> следует ли удалять пробел после тега <strong>? (Спецификация HTML 4 имеет правило об этом для разрывов строк ; мне было интересно, применяется ли это правило и к другим пробелам, не связанным с клювом, и упомянуто ли это правило / определено / разрешено / предположено в любой спецификации XHTML или CSS.)

1 Ответ

1 голос
/ 06 июля 2010

Ваши вопросы наверняка заглянули в мое любопытство.Надеюсь, я смогу пролить на них некоторый свет.

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 100 * * * * * * * * 100 * * * 100 * * *.1011 *SCRIPT

PRE

Это означает, что все остальные элементы контейнера должны были подавлять пробелы вокруг них.Ваша ссылка Mozilla ( «Пробелы в DOM» ) гласит:

В Mozilla все пробелы в текстовом содержимом исходного документа представлены в DOM ...

Это становится очевидным при запуске тестовой страницы с множеством пробелов и разрывов.Просмотр сгенерированного кода (Вы можете сделать это с помощью панели инструментов Web Developer : выберите Просмотр источника - Просмотр сгенерированного источника ) показывает, что «текстовое содержимое» означает всевнутри корневого тега HTML.Итак, другими словами, есть только подавление пробелов в самом внешнем теге (HTML).

Запуск той же страницы в IE8 рассказывает немного другую историю (просмотрите сгенерированный источник, нажав F12 и в Инструментах разработчика нажмите CTRL - G ).Они также не на 100% совместимы, но более совместимы, чем Firefox.Они подавляют не только элемент HTML, но и почти все остальное (как и должно быть).Они прислушиваются к правилу SCRIPT и STYLE elements 'preserve, но все же оставляют разрыв между ними.В теле это заменяло многократные разрывы единственными разрывами.Вложенные DIV теги (и текст их содержимого) в одной строке были разбиты с перерывами.

Короче говоря, и Firefox, и IE8 не соответствуют пользовательским агентам .

И нет, вы не можете подавить пробел между двумя тегами с помощью свойства white-space (вы, вероятно, могли бы сделать это с помощью JavaScript / jQuery, если бы вы действительно этого хотели).Свойство white-space определяет, как обращаться с пробелами в части содержимого элемента (например, white-space: nowrap предотвращает перенос текста).

...