Уроки Dreamweaver


Задание ширины ячеек

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

Итак, ячейки могут иметь фиксированную или неограниченную ширину ("саморастягивающиеся" по горизонтали ячейки). (К сожалению, не предоставляются такие же средства для управления высотой ячеек.) Только одна ячейка в таблице может быть "саморастягивающейся"; значения ширины остальных ячеек должны быть фиксированы. И это логично.

Изменить значение ширины ячейки можно простым перетаскиванием маркеров размеров на ее границе, когда ячейка выделена. Также можно ввести нужное значение прямо в поле ввода Width редактора свойств. Это справедливо для всех ячеек с фиксированной шириной.

Давайте превратим ячейку с основным содержанием страницы в "саморастягивающуюся". Но как это сделать?

Просто включите переключатель Autostretch в редакторе свойств. При этом Dreamweaver сам добавит в остальные (с фиксированной шириной) ячейки изображения-"распорки", -представляющие собой уже известный вам "одно-пиксельный GIF". Это нужно для того, чтобы выдерживать точные размеры ячеек, не заполненных или не полностью заполненных содержимым. А выбранная вами ячейка станет "саморастягивающейся".

Однако сначала Dreamweaver задаст вам один вопрос. На экране появится диалоговое окно Choose Spacer Image, показанное на рис. 8.22. В нем вы должны выбрать, откуда будет браться изображение-"распорка".

Рис. 8.22. Диалоговое окно Choose Spacer Image

Вы можете выбрать один из трех переключателей:

  • Create a spacer image file — создать файл изображения-"распорки". Этот переключатель следует выбирать, если у вас еще нет изображения-"распорки";
  • Use an existing spacer image file — использовать уже имеющийся файл изображения-"распорки";
  • Don't use spacer images for autostretch tables — не использовать изображения-"распорки" вообще. Этот переключатель следует выбирать, если вы сами собираетесь принять меры против самовольного изменения ширины ячеек Web-обозревателем, например, поместить туда содержимое, заполняющее ячейки целиком. Выбирайте этот переключатель и в том случае, если вы сами собираетесь поместить в ячейки с фиксированной шириной изображение-"распорку". Если же вы не предпримете никаких мер, таблица может быть искажена Web-обозревателем до неузнаваемости, о чем Dreamweaver вас и предупредит.

Сделав свой выбор, нажмите кнопку ОК для создания "саморастягивающейся" ячейки или Cancel — для отказа от этого.

Поскольку у нас нет файла изображения-"распорки", давайте прикажем Dreamweaver создать его. Выберите первый переключатель и нажмите кнопку ОК. После этого на экране появится диалоговое окно Save Spacer Image File As, напоминающее стандартное диалоговое окно сохранения файла Windows. Проверьте, выбран ли в раскрывающемся списке Relative To пункт Document (задание пути и имени файла относительно страницы, а не сайта), и сохраните файл изображения-"распорки" в папке Pics. По умолчанию он будет называться spacer.gif; если хотите, измените его имя, но можно этого и не делать.

После того как вы задали файл изображения-"распорки" (создали, выбрали уже существующий или отказались от него), Dreamweaver станет его использовать, не спрашивая вас. Если вы хотите изменить имя файла изображения-"распорки" или создать его заново, закройте Dreamweaver, выбрав пункт Exit в меню File, запустите его снова и повторите все шаги по созданию "саморастягивающейся" ячейки.

Теперь обратите внимание на строку ширин в верхней части внешней таблицы разметки. Ее части, относящиеся к крайним ячейкам (фиксированные значения ширины), имеют такой вид, как на рис. 8.23; это значит, что внутрь такой ячейки помещено изображение-"распорка". А часть, относящаяся к "саморастягивающейся" ячейке, имеет вид, показанный на рис. 8.24.

Рис. 8.23. Обозначение ячейки с фиксированной шириной и помещенной в нее "распоркой" в строке ширин

Рис. 8.24. Обозначение "саморастягивающейся" ячейки в строке ширин

Чтобы вернуть "саморастягивающейся" ячейке таблицы фиксированную ширину, включите переключатель Fixed редактора свойств и, если нужно, задайте ширину в поле ввода Width.

Есть еще один способ преобразования ячейки из фиксированной в "саморастягивающуюся" и наоборот — воспользоваться меню строки ширин. Получить доступ к этому меню можно, щелкнув мышью точно по значению ширины ячейки (рис. 8.25). Чтобы преобразовать фиксированную ячейку в "саморастягивающуюся", выберите пункт Make Column Autostretch. Чтобы вернуть "саморастягивающейся" ячейке фиксированную ширину, выберите пункт Make Column Fixed Width.

Рис. 8.25. Меню строки ширин

Меню строки ширин также содержит ряд пунктов, позволяющих вам произвести различные манипуляции с изображениями-"распорками". Это пункты:

  • Add Spacer Image — добавление изображения-"распорки" к данной ячейке;
  • Remove All Spacer Images — удаление всех изображений-"распорок" во всех ячейках данной таблицы разметки. Это может понадобиться, если вы вручную помещаете в ячейку содержимое, полностью ее занимающее; таким образом, нужда в искусственной "распорке" отпадает. Например, мы со временем поместим в левую ячейку полосу навигации, и "распорка" станет ненужной;

Нужно ли добавлять изображения-"распорки" в ячейки вручную? На этот вопрос есть только один ответ. Посмотрите, что сделают с вашей таблицей разметки Netscape Navigator и Microsoft Internet Explorer, и решите сами. Старые версии Navigator славятся своим умением уродовать таблицы, так что уделите ему особое внимание. Если таблица выглядит хорошо и без "распорок", лучше без них обойтись. В противном случае, добавьте их. Однако имейте в виду: проверять в Web-обозревателе страницу нужно только после заполнения ее содержимым.

Сделайте центральную ячейку внешней таблицы разметки, где будет отображаться основное содержимое, "саморастягивающейся". Dreamweaver добавит в остальные ячейки изображения-"распорки".