Тема 2 Создание новой Web-страницы
PS!!! Разработка темы по самоучителю Дронова В.А."Macromedia Dreamweaver 8"
Пусть это будет небольшая страница гипотетического студента Василия Васильевича Васильева
Ввод и форматирование текста
1. Текст набирается с помощью клавиатуры , при этом Dreamweaver самостоятельно разобьет текст на строки.
2. Чтобы создать новый абзац, нужно нажать клавишу <Enter>.
3. Если же надо просто перенести текст на другую строку (вставить так называемый разрыв строк), то достаточно нажать комбинацию клавиш <Shift>+<Enter>.
"Сайт студента Васильева В. В. Здравствуйте! Здравствуйте! Здравствуйте! Будем знакомиться. Я - студент Васильев Василий Васильевич, для друзей -просто Василий. Я учусь в институте, а в свободное время занимаюсь Web-дизайном. На своем сайте, созданном в пакете Macromedia Dreamweaver 8, вы можете найти следующее: список моих увлечений; статьи, найденные мной в Интернете; студенческий юмор; сведения обо мне. Все права на материалы, размещенные на этом сайте, принадлежат мне Васильеву В. В."
4. Разобьем следующий текст на абзацы, у нас должно получиться так:
"Сайт студента Васильева В. В. Здравствуйте! Здравствуйте! Здравствуйте! Будем знакомиться. Я - студент Васильев Василий Васильевич, для друзей -просто Василий. Я учусь в институте, а в свободное время занимаюсь Web-дизайном. На своем сайте, созданном в пакете Macromedia Dreamweaver 8, вы можете найти следующее: список моих увлечений; статьи, найденные мной в Интернете; студенческий юмор; сведения обо мне. Все права на материалы, размещенные на этом сайте, принадлежат мне Васильеву В. В."
5. Закончили с текстом? Теперь давайте взглянем на инструментарий документа, точнее, на находящееся в нем небольшое текстовое поле В это поле вводится так называемое название Weв-страницы. Это название отображается в строке заголовка окна Web-обозревателя, когда он отображает страницу.
• Дадим нашей первой Web-странице название "Сайт студента Васильева В. В.", для чего введем его в показанное на рис. поле ввода и нажмем клавишу <Enter>.

Вот так, не написав ни строчки HTML-кода, мы получили правильно оформленную Web-страницу.
Форматирование абзацев
Прежде всего, сделаем нашей странице нормальный "кричащий" заголовок, как у газеты. В первой строке как раз набрано Сайт студента Васильева В. В . —это прекрасный кандидат в заголовки.
1. Чтобы превратить обычный абзац в заголовок, нужно воспользоваться панелью Properties (редактором свойств) Нам нужно озаглавить всю Web-страницу, поэтому используем заголовок первого уровня.
• Поставим текстовый курсор на строку Сайт студента Васильева В. В . и выберем в раскрывающемся списке Format пункт Heading 1.
или контекстное меню окна документа:
2. Теперь давайте выровняем заголовок по центру. В этом нам помогут кнопки выравнивания, расположенные в редакторе свойств (Properties):
3. Разобьем следующий текст на абзацы, у нас должно получиться так:
Здравствуйте! Здравствуйте! Здравствуйте!
Будем знакомиться. Я - студент Васильев Василий Васильевич, для друзей -просто Василий. Я учусь в институте, а в свободное время занимаюсь Web-дизайном.
На своем сайте, созданном в пакете Macromedia Dreamweaver 8, вы можете найти следующее:
список моих увлечений;
статьи, найденные мной в Интернете;
студенческий юмор;
сведения обо мне.
Все права на материалы, размещенные на этом сайте, принадлежат мне Васильеву В. В.
4. Теперь выделим последнюю строку со сведениями об авторских правах:
• Можно поставить текстовый курсор в ее начало и нажать клавишу <Enter>, чтобы вставить между этой строкой и остальным текстом дополнительную пустую строку.
• А можно поступить по-другому.
- Взгляните на кнопки, показанные на рис

- Эти кнопки позволяют установить или убрать отступ слева у абзаца. Левая кнопка уменьшает (убирает) отступ, а правая — увеличивает.
- Давайте поставим курсор мыши на последнюю строку текста и нажмем кнопку увеличения отступа..
Вы можете еще раз нажать эту кнопку для увеличения отступа или левую кнопку, чтобы уменьшить отступ.
5. Теперь обратим внимание на список разделов нашего будущего сайта. И вспомним, что "обычные" текстовые редакторы поддерживают создание нумерованных и маркированных списков. Пункты нумерованных (упорядоченных) списков, как вы знаете, обозначаются порядковыми номерами, а пункты маркированных (неупорядоченных) списков — какими-либо значками. Давайте и мы создадим такой список.
• Первое, что нам будет нужно сделать, — это выделить все строки, которые станут пунктами создаваемого списка. У нас их четыре.
• Для того чтобы преобразовать выделенные строки в список, воспользуемся кнопками-переключателями редактора свойств.
- Левая кнопка создает из выделенных абзацев маркированный список,
- а правая — нумерованный.
Если же обе кнопки "отключены", пункт списка, на котором стоит текстовый курсор, превращается в обычный абзац.
• Нажмем левую кнопку и список будет создан.
или
• Если текстовый курсор стоит на любом пункте списка, становится доступной кнопка List Item редактора свойств.
- Если ее нажать, на экране появится диалоговое окно List Properties,с помощью которого мы можем задать некоторые параметры списка.
• Раскрывающийся список List Type позволяет задать тип списка. Здесь доступны следующие позиции:
- Bulleted List — маркированный список;
- Numbered List — нумерованный список;
- Directory List— список папок, визуально похож на маркированный список;
- Menu List — список-меню, визуально опять же похоже на маркированный список.
Если выбран первый или второй пункт, становятся доступными другие элементы управления.
или • Раскрывающийся список Style позволяет задать стиль маркера или нумерации списка. Если выбран маркированный список, доступны следующие значения:
- Bullet — кружок с заливкой;
- Square — квадратик;
- [Default] — маркер по умолчанию, обычно кружок с заливкой.
• Если же выбран нумерованный список, доступны:
- Number — арабские цифры;
- Roman Small— малые римские цифры;
- Roman Large— большие римские цифры;
- Alphabet Small— малые латинские буквы;
- Alphabet Large— большие латинские буквы;
- [Default] — нумерация по умолчанию, обычно арабские цифры.
• Кроме того, если выбран нумерованный список, доступно поле ввода Start Count, где вы сможете ввести номер, с которого начнется нумерация строк списка.
• Все эти настройки относились к списку в целом.
В нижней половине окна расположена группа элементов управления List Item, затрагивающая только ту строку списка, на которой находится текстовый курсор.
В эту группу входят:
• раскрывающийся список New Style
итог :
• поле ввода Reset Count To, аналогичные раскрывающемуся списку Style и полю ввода Start Count верхней части окна.
• Закончив настройку свойств, нажмите кнопку ОК для сохранения установок или Cancel — для отказа от них.
Вы можете немного "поиграться" с этими дополнительными настройками, чтобы узнать их получше. Лишняя практика никогда не повредит.
Примечание
Списки задаются парными тегами:
- <ul> (маркированный),
- <оl> (нумерованный),
- <DIR> (список папок) и
- <MENU> (меню).
Между этими тегами помещаются отдельные строки, задаваемые тегом <li>. Удивительно, но у тега <li> нет пары!
Итог:
Сайт студента Васильева В. В.
Здравствуйте! Здравствуйте! Здравствуйте!
Будем знакомиться. Я - студент Васильев Василий Васильевич, для
друзей - просто Василий. Я учусь в институте, а в свободное время занимаюсь
Web- дизайном.
На своем сайте, созданном в пакете Macromedia Dreamweaver 8, вы можете найти
следующее:
- список моих увлечений;
- статьи, найденные мной в Интернете;
- студенческий юмор;
- сведения обо мне.
|