Пример использования свободно позиционируемых элементов
Теперь давайте поместим на страницу начальный текст, содержащий приветствие. Это совсем простая задача. Создадим новый свободный элемент, назовем его content и поместим под заголовком. После этого остается только скопировать в него со старой страницы сам текст приветствия. Результат см. на рис. 11.17.
Точно так же создадим еще один свободный элемент и поместим в него портрет нашего героя. Вновь созданный элемент назовем Photo и поместим его правее текста приветствия. Для портрета зададим достаточно маленькие размеры, чтобы он поместился на небольшом пространстве нашей странички. То, что у вас должно получиться в результате, показано на рис. 11.18.
Следующий элемент – полоса навигации. Но мы с вами не хотим создавать унылую, выровненную по линеечке, словно взвод солдат, замерших по стойке "смирно", полосу навигации. Давайте применим свою фантазию, прибавим к ней изумительные свойства свободно позиционируемых элементов и создадим что-нибудь пооригинальнее. А именно набор гиперссылок, "рассыпанных" по всей странице.
Рис. 11.17. Заголовок и текст приветствия
Рис. 11.18. Заголовок, текст приветствия и портрет
Первая такая гиперссылка будет вести на страницу списка увлечений нашего незабвенного Ивана Ивановича. А именно на страницу Passions.htm. Создадим небольшой новый элемент, назовем его Passionsiink и зададим для него белый фон. После этого введем в него слово Увлечения, выровняем его по центру и превратим в гиперссылку. Результат показан на рис. 11.19.
Рис. 11.19. Заголовок, текст приветствия, портрет и гиперссылка