Урок — 7
Создание колонки для меню
Теперь попробуем сделать колонку для меню. Колонка будет располагаться с левой стороны. Придётся немного подкорректировать код шаблона. Для начала посмотрите на рисунок, на котором цифрами обозначены все рисунки шапки шаблона.
А теперь посмотрим общий код шаблона с обозначенными кодами этих рисунков
У нас получается две линии три колонки рисунков. В коде обозначены линии. Поскольку мы будем делать колонку на контентной части шаблона, то обратим внимание на код с текстом контента:
Обратим внимание на такой параметр как colspan=»3″. Colspan объединяет ячейки в одной строке. Белая контентная часть занимала все три ячейки, вот в коде и было прописано colspan=»3″. Теперь нам надо освободить одну ячейку для колонки меню. Для этого вместо colspan=»3″ надо прописать colspan=»2″.
Теперь определяемся с шириной колонки. Поскольку колонка будет слева, то ширина её должна равняться ширине картинок 1 и 4, чтобы шаблон не разъехался.
< img src=»images/index_01.gif» width=»252″ height=»126″ alt=»» >
< img src=»images/index_04.gif» width=»252″ height=»126″ alt=»» >
Отсюда видно, что ширина колонки будет 252 пикселя. Теперь прописываем код ячейки —
где
width — ширина колонки
align=»center» — надпись «Меню сайта» располагается по середине
bgcolor — цвет колонки
Добавим в код еще один атрибут valign=»top», чтобы надпись «Меню сайта» находилась вверху колонки
Теперь добавим этот код в код контентной части, после открывающего тега< tr >
< tr >
< td width=»252″ align=»center» valign=»top» bgcolor=»#1E90FF» >Меню сайта< /td >
< td width=»1000″ height=»698″ colspan=»2″ valign=»top» >На данном сайте вы найдёте
очень много способов заработка в интернете< /td >
< /tr >
А если будете делать колонку справа, то код колонки поставите перед закрывающим тегом < /tr >. Теперь посмотрите как будет выглядеть общий код шаблона:
Общий вид получившегося шаблона:
В итоге получился простенький шаблон. Поняв принцип его создания, можно дальше работать над ним. Это будет зависеть от Ваших знаний и желания. На этом пока остановлюсь, но продолжение будет. В следующих уроках хочу затронуть темы о жестком и резиновом шаблоне сайта, о независимых таблицах, о том как добавить фон в бордюры жесткого сайта. Следите за продолжением.
Читайте в следующих уроках
Статья была полезной?