5.35. Установка свойства позиционирования clear
По умолчанию обтекаемый элемент (т.е. элемент, свойству float которого присвоено значение left или right) будет отображен слева или справа от последующего текста в документе. Однако можно отменить размещение элемента рядом с текстом, воспользовавшись свойством clear.
Свойству clear могут быть установлены следующие значения в виде ключевых слов, представленных в таблице 5.15.
Таблица 5.15
Ключевые слова, используемые для свойства clear
Ключевое слово для clear |
Эффект |
left |
Элемент будет отображен ниже (а не рядом) относительно предшествующего обтекаемого элемента, для которого установлено свойство float: left |
right |
Элемент будет отображен ниже (а не рядом) относительно предшествующего обтекаемого элемента, для которого установлено свойство float: right |
both |
Элемент будет отображен ниже (а не рядом) относительно предшествующего обтекаемого элемента, для которого установлено свойство float: left или float: right |
none (по умолчанию) |
Элемент будет отображен рядом с предшествующим обтекаемым элементом |
Например, если добавить следующее правило в таблицу стилей из Листинга 1.11, каждый элемент STANZA будет отображаться ниже предшествующего (обтекаемого) элемента IMAGE, но не рядом с ним, как показано на следующем рисунке.
STANZA (clear: left}
5.36. Вставка элементов html в xml-документы и использование пространства имён
Хоть и можно использовать таблицы каскадных стилей для добавления базовых возможностей форматирования элементов XML в документ, было бы хорошо иметь возможность добавлять стандартные HTML-элементы — такие, как гиперссылки, изображения и формы — чтобы документ выигрывал от применения встроенных в эти элементы функций. К счастью, при отображении документа с помощью присоединенной таблицы стилей, в него можно вставить любой стандартный элемент HTML и заставить браузер отобразить этот элемент с использованием специальных зарезервированных для этой цели имен элементов.
Может показаться, что можно вставить HTML-элемент, просто присвоив XML-элементу такое же имя. Например, чтобы вставить HTML-элемент IMG, нужно просто создать элемент IMG следующим образом:
<IMG SRC="Raven.bmp" />
Рисунок 35. XML-документ, в котором использовано свойство clear
Однако у браузера нет возможности узнать, что это HTML-элемент, а не обычный созданный XML-элемент. Чтобы подобный механизм мог работать, все имена HTML-элементов (а их много) должны быть зарезервированы исключительно для вставки HTML-элементов. Такой подход, однако, противоречил бы духу XML, в соответствии с которым разрешается использовать для элементов любые корректно заданные имена.
К счастью, можно воспользоваться соглашением XML, известным как пространство имен, которое позволяет различать конфликтующие имена. Два разных элемента могут иметь одно и то же имя, если они принадлежат разным пространствам имен.
Идентификатор пространства имен добавляется в начале имени элемента и отделяется от остальной части имени двоеточием (:), как в следующем примере:
my-namespace: MY-ELEMENT
Элемент с именем mу-namespace: MY-ELEMENT и элемент с именем МY-ELEMENT могут существовать в одном и том же документе и считаются различными элементами, поскольку принадлежат отдельным пространствам имен: my-namespace: MY-ELEMENT принадлежит пространству имен my-namespace, а элемент MY-ELEMENT по умолчанию принадлежит к пространству имен документа.
Однако прежде чем можно будет использовать пространство имен, необходимо соответствующим образом объявить его. Хотя есть несколько мест, в которых можно сделать объявление пространства имен, проще всего это сделать внутри начального тега элемента, для которого нужно использовать пространство имен. Например, можно объявить пространство имен my-namespace, как показано на следующем рисунке.
Рисунок 36. Схема объявления пространства имён
При такой форме объявления пространства имен можно использовать пространство имен только внутри элемента, в котором оно объявлено, либо внутри любого из его дочерних элементов.
Если имя XML-элемента совпадает с именем стандартного HTML-элемента (например, IMG, А или HR) и если он принадлежит пространству имен html, Internet Explorer интерпретирует его как HTML-элемент и поместит его на отображаемую страницу. Однако если элемент не принадлежит пространству имен html, Internet Explorer интерпретирует его как обычный XML-элемент.
Пространство имен html является специальным, зарезервированным пространством имен, которое объявляется следующим образом:
xmlns:html=http://www.wЗc.org/TR/REC-html40/'
Вот пример XML-элемента, который указывает Internet Explorer вставить HTML-элемент IMG, для которого источником изображения является файл Romb.bmp:
<html:IMG xmlns:html='http://www.w3c.org/TR/REC-html40/'
src='Romb.bmp'/>
Это корректно сформированный пустой XML-элемент. Его имя включает указание пространства имен, он также имеет два атрибута. Первый атрибут объявляет пространство имен, в то время как второй атрибут является стандартным HTML-атрибутом, который можно включить в начальный тег HTML-элемента IMG.
При вставке HTML-элемента описанным выше способом, XML-документ должен иметь присоединенную таблицу стилей, и его необходимо открыть непосредственно в браузере.
XML-документ, представленный в листинге 1.13, иллюстрирует технику включения HTML в XML-документ. К этому документу присоединена оригинальная версия таблицы стилей, которая содержится в листинге 1.7.
<?xml version=”1.0”?>
<?xml-stylesheet type=”text/css” href=”Ruslud.css”?>
<POEM>
<html:IMG xmlns:html='http://www.w3c.org/TR/REC-html40/' SRC='Romb.bmp' ALIGN='LEFT' />
<TITLE>Руслан и Людмила</TITLE>
<html:Axmlns:html='http://www.wЗc.org/TR/REC-html40/ HREF='http://www.edgar.com'>
Пушкин Александр Сергеевич
</html:A>
<html:HR xmlns:html='http://www.w3c.org/TR/REC-html40/' />
<STANZA>
<VERSE>У лукоморья дуб зелёный;</VERSE>
<VERSE>Златая цепь на дубе том:</VERSE>
<VERSE>И днём и ночью кот учёный</VERSE>
<VERSE>Всё ходит по цепи кругом;</VERSE>
<VERSE>Идёт направо — песнь заводит,</VERSE>
<VERSE>Налево — сказку говорит,</VERSE>
</STANZA>
<html:HR xmlns:html='http://www.w3c.org/TR/REC-html40/' />
<STANZA>
<VERSE>Там чудеса: там леший бродит,</VERSE>
<VERSE>Русалка на ветвях сидит;</VERSE>
<VERSE>Там на неведомых дорожках</VERSE>
<VERSE>Следы невиданных зверей;</VERSE>
<VERSE>Избушка там на курьих ножках</VERSE>
<VERSE>Стоит без окон, без дверей;</VERSE>
</STANZA>
</POEM>
Листинг 1.13
Документ включает три стандартных HTML-элемента.
Он содержит изображение, представленное следующим XML-элемен-том:
<html: IMG xmlns:html='http://www.w3c.org/TR/Rec-html40/'
SRC='Romb.bmp' ALIGN='LEFT’ />
Этот элемент помещает стандартный HTML-элемент IMG (изображение). Атрибут HTML ALIGN='LEFT' делает изображение обтекаемым и размещает его слева от последующего текста документа. Этот метод является альтернативой методу, с которым вы познакомились ранее в разделе 5.34 “Установка свойства позиционирования float”.
Он делает имя автора (которое ранее содержалось в элементе AUTHOR) гиперссылкой с помощью следующего XML-элемента (вместо элемента AUTHOR):
<html:Axmlns:html='http://www.wЗc.orgДR/REC-html40/
HREF='http://www.edgar.com'>
Пушкин Александр Сергеевич
</html:A>
Этот элемент вставляет стандартный элемент HTML А (якорь).
Он вставляет две горизонтальные разделительные линии с использованиемином следующего XML-элемента:
<html:HR xmlns:html='http://www.w3c.org/TR/REC-html40/' />
Этот элемент вставляет стандартный элемент HTML HR (горизонтальная линия). На следующем рисунке показано как Internet Explorer отображает документ.
Рисунок 37. Использование пространства имён