Поддержка сайта

Высокие позиции в поисковой системе, на прямую зависят от развития вашего сайта.

Продвижение сайтов

Эффективность стратегий продвижения подтверждается сотрудничеством с крупными клиентами и отзывами о нашей работе.

Создание сайтов

Мы делаем сайты быстро, недорого и профессионально. От работы с нами, у вас останутся только положительные эмоции.

Свободное расположение элементов на странице

.

Не имея особых указаний, браузер размещает элементы на странице в том порядке, в каком они указаны в исходнике. Так что, если у вас в разметке есть заголовок, за которым следует раздел навигации, затем заголовок второго уровня, три абзаца текста и цитата, то в точности так вы и увидите это на экране. До этого момента все именно так и было, и мы создавали контент сайта, добавляя элементы в том порядке, в каком хотели видеть их на странице. Как применять действительно мощные эффекты CSS: вы можете, например, установить для некоторых элементов определенное место на экране.

Если говорить о работе с макетами, в которых используется CSS, то есть очень много способов решения такой задачи. К сожалению, в этой книге я не могу рассмотреть каждый метод в отдельности. Если вы хотите изучить эту тему углубленно, то прочтите книгу, вышедшую в издательстве SitePoint: HTML Utopia: Designing Without Tables Using CSS2.

Отображение структуры

Вспомним, какие разделы есть на нашем сайте:

Добавьте новое — временное! — правило в таблицу стилей (stylel.ess), устанавливающее границу для каждого элемента. Добавьте его в конец таблицы — таким образом оно переопределит все стили границ, которые вы установили ранее.

chapter4\websitefiles\08_page_structure\stylel.ess (фрагмент)

#header. #sitebranding. #tagline. Navigation. #bodycontent

{

border: lpx solid red:

padding: 2px:

margin-bottom: 2px;

}

Здесь применяются небольшие отступы, а также нижние поля, делающие отображение содержимого нагляднее (ведь, например, разделы si tebrandi ng и tagline находятся внутри header). На рис. 4.25 показано, как документ выглядит в браузере.

Рис. 4.25. Выделение структуры страницы с помощью красных границ

Выглядит немного уродливо. Ничего, скоро будет еще хуже, но ненадолго — пока мы будем перекомпоновывать текст. Это примерно как переставлять в доме мебель: в разгаре процесса вы в панике от царящего вокруг хаоса, но конец все же наступает и воцаряются красота и порядок. Именно так сейчас все и будет на нашем учебном сайте. Итак, начинаем двигать коробки!

.

Читайте так же:
Not found