Основы работы с XHTML и CSS
Общая форма тега
| <img src="url" alt="text"/> |
| Листинг 5.1. Общая форма тега <img/> |
| Закрыть окно |
| <p><img src="yoda.jpg" alt="Изображение Йода"/></p> |
| Листинг 5.2. Вывод изображение, находящегося в том же каталоге, что и страница Web |
| Закрыть окно |
| <p><img src="Media/yoda.jpg" alt="Изображение Йода"/></p> |
| Листинг 5.3. Вывод изображения из подкаталога Media, расположенного в каталоге текущей страницы |
| Закрыть окно |
| <p> <img src="Earth.gif" alt="Изображение Земли" style="float:right; margin-left:25px"/> ... окружающий текст с переносом по словам ... </p> |
| Листинг 5.4. Код для смещения изображения на странице вправо |
| Закрыть окно |
| <p>Это изображение с заголовком, где изображение смещается влево, а заголовок обтекает его справа.</p> <div> <img src="book.gif" alt="Изображение книги" style="float:left; margin-right:10px; margin-bottom:10px"/> <b>Figure 1.</b><br/> <i>The Passion of the Western Mind</i>. </div> <p>Этот следующий далее параграф также обтекает изображение справа, так как он записывается далее в строке ниже заголовка.</p> |
| Листинг 5.5. Код для плавающего изображения с обтекающим его текстовым параграфом |
| Закрыть окно |
| <p>Это изображение с заголовком, где изображение смещается влево, а заголовок обтекает его справа. </p> <div> <img src="book.gif" alt="Изображение книги" style="float:left; margin-right:10px; margin-bottom:10px"/> <b>Figure 1.</b><br/> <i>The Passion of the Western Mindv/i>. </div> <p style="clear:left">Этот параграф выводится ниже изображения, а не обтекает его ниже заголовка.</p> |
| Листинг 5.6. Код вывода параграфа текста, использующего свойство clear для левого поля |
| Закрыть окно |
| filter:filtername (property=value [, property=value]...) |
| Листинг 5.7. Общая форма применения фильтров |
| Закрыть окно |
