1. Определите сайт
1. Создайте папку в любом корневом каталоге (здесь мы предполагаем, что это диск E), например, назовите ее MyWeb.
***Примечание: Все файлы, используемые на сайте, должны иметь английские названия.
2. Откройте Dreamweaver, выберите «Сайт — Новый сайт», чтобы открыть диалоговое окно. Введите имя веб-сайта в поле «Имя сайта» (доступен китайский язык) и выберите только что созданную папку (E:web) в локальной корневой папке. Затем подтвердите.
***Примечание. Когда вы снова откроете Dreamweaver, вы автоматически обнаружите только что созданный сайт. Если сайтов несколько, их можно выбрать в меню «Сайт – Открыть сайт».
2. Создайте страницу
1. В пустом месте локальной папки E:MyWeb щелкните правой кнопкой мыши и выберите «Новый файл», чтобы создать страницу. Имя файла по умолчанию — untitled.htm. htm означает, что этот файл веб-страницы является статическим HTML-файлом. Переименуйте его в index.htm.
***Имя первой страницы сайта обычно — index.htm или index.html. Названия остальных страниц вы можете выбрать самостоятельно.
2. Дважды щелкните index.htm, чтобы войти в режим редактирования страницы. Введите имя веб-страницы в поле заголовка, щелкните правой кнопкой мыши и выберите «Свойства страницы», чтобы открыть окно «Свойства страницы». Здесь вы можете установить заголовок, цвет фона или заднего изображения веб-сайта, а также цвет гиперссылки (обычно достаточно цвета по умолчанию), а все остальное оставить по умолчанию.
3． В это время курсор находится в левом верхнем углу, и вы можете ввести предложение, например «Добро пожаловать на мою домашнюю страницу». Выделите текст, используйте меню «Окно/Свойства», чтобы открыть панель свойств, выберите размер текста равный 6, затем отцентрируйте текст, а затем используйте несколько возвратов каретки перед текстом, чтобы расположить его в середине. страница.
4. Чтобы выбрать шрифт, выберите последний элемент в списке «Шрифт: Редактировать список шрифтов». Затем выберите знак + в диалоговом окне, затем выберите шрифт, который необходимо добавить в список шрифтов в столбце «Доступные шрифты», и нажмите кнопку посередине, чтобы добавить его.
***Наиболее часто используемые китайские иероглифы на веб-страницах — это шрифты Song. Не добавляйте в список для использования специальные шрифты, поскольку другие не смогут их увидеть, если они не установлены на их компьютерах. Если вам нужно его использовать, превратите его в картинку, прежде чем использовать.
***Способ ввода пробелов на веб-странице — это настройка метода ввода на полную ширину.
***Способ переноса строк на веб-странице: Shift+Enter. Просто нажмите Enter, чтобы изменить абзацы.
3. Добавление изображений на страницу
1. В пустом месте локальной папки E:MyWeb щелкните правой кнопкой мыши и выберите «Новая папка». Будет создана папка, в которой будут помещаться изображения. Вы можете переименовать ее в tu или pic. или Изображения в порядке.
2. С помощью меню «Окно/Объект» откройте панель объекта, нажмите «Вставить изображение» и в диалоговом окне выберите изображение, которое необходимо вставить. Если появится диалоговое окно: «Хотите скопировать этот файл в корневую папку?», необходимо выбрать «Да», а затем сохранить его в только что созданную папку.
3. Выберите изображение и откройте панель свойств, где вы можете назвать изображение, сбросить высоту и ширину изображения и перетащить точки по углам изображения, чтобы изменить размер. Удерживая клавишу Shift, перетащите угловые точки, чтобы растянуть изображение, сохранив соотношение сторон. Чтобы восстановить исходный размер, нажмите кнопку «Изменить размер» в правом нижнем углу.
4. «Ссылка» позволяет напрямую ввести адрес здесь. «Замена» — описание рисунка, то есть текст, отображаемый при наведении курсора мыши на рисунок; «Граница» — ширина границы рисунка, а «Выравнивание» — способ выравнивания.
4. Добавьте гиперссылку
1. Добавьте ссылку в текст.
Например, введите «Моя статья» на странице, затем выберите ее, откройте панель свойств и в поле «Ссылка» выберите страницу, на которую она хочет создать ссылку. В следующем «целевом» поле мы обычно используем self, чтобы открыть новое окно вместо текущего окна, или выбираем пустое, чтобы открыть новое окно;
2. Добавьте ссылку на изображение так же, как ссылку на текст выше. Вставьте изображение, а затем выберите его в поле ссылки на панели свойств.
****Изображения могут создавать различные множественные ссылки. Вот как:
Под пунктом «Карта» на панели свойств есть какая-то графика. Например, нажмите на квадрат, курсор изменится на крест, и нарисуйте синюю прямоугольную активную зону. В это время вы можете установить ссылку. адрес этой горячей зоны на панели свойств, отобразится указатель мыши. Аналогично, настроив хот-спот с помощью круга, вы можете установить и другие ссылки на изображение.
3. Добавьте ссылку на электронную почту. Выберите текст или изображение, к которому вы хотите добавить ссылку на электронную почту, откройте панель свойств и введите адрес электронной почты в поле «Ссылка». Формат следующий: mailto: адрес электронной почты. Обратите внимание, что между ними нет пробелов.
4. Если ссылка ведет на файл, который не открывается браузером, например exe, Zip и т.п., то при нажатии зрителем на ссылку будет реализована функция загрузки файла или онлайн-воспроизведения.
5. Использование таблиц
1. Нажмите «Вставка/Таблица», чтобы открыть панель таблиц для настроек. Количество строк, столбцов, ширина, границ и т. д., «заполнение ячейки» — это расстояние между внутренней частью ячейки и содержимым; «интервал между ячейками» — это расстояние между ячейками, единица измерения — пиксели.
2. После вставки таблицы щелкните границу таблицы, чтобы выделить всю таблицу. Затем вы можете выполнить различные настройки на панели свойств ниже.
3. Переместите курсор на одну из ячеек, и панель свойств, которую вы видите сейчас, станет панелью свойств ячейки. Вы также можете выполнять различные операции над ячейками. Например, цвет фона, фоновое изображение, граница, объединение, разделение и т. д.
6. Прочие операции с таблицами
– Принцип изготовления тонколинейных таблиц:
1. Выделите всю таблицу и установите для нее черный фон (это цвет строк таблицы).
2. Выделите все ячейки и установите для них белый фон.
2. Автоматическое форматирование таблиц. 1. Сначала создайте таблицу, а затем выберите ее.
2. В меню выберите «Команда/Формат таблицы». То есть вы можете выбрать несколько предустановленных стилей таблиц.
Sany Pixel Divider 1. Вставьте таблицу с 1 строкой и 1 столбцом, шириной 200 пикселей и границей и полем 0.
2. Выберите таблицу, установите высоту таблицы 1 пиксель и задайте цвет фона (то есть желаемый цвет линии).
3. Перейдите в окно кода и дизайна и удалите код.
7. Используйте таблицы для создания полной страницы
— верхней части веб-страницы (обычно включая значки, рекламные объявления и меню навигации).
1. Создайте таблицу с 1 строкой и 2 столбцами, шириной 760 пикселей и границей и полем 0.
2. Выберите таблицу, установите выравнивание по центру и цвет фона #3366CC.
3. Поместите курсор в левую ячейку, установите его горизонтальное расположение на выравнивание по левому краю, а вертикальное — на выравнивание по верху, а затем вставьте изображение. Обычно сюда вставляется значок веб-сайта, то есть логотип.
4. Поместите курсор в ячейку справа, установите его ширину 500, выровняйте горизонтальное расположение по центру, вертикальное расположение по середине, а затем вставьте изображение, обычно рекламу веб-страницы, то есть баннер.
5. Поместите курсор после только что заполненной таблицы и нажмите «Вставить/Таблицу», чтобы создать таблицу с 1 строкой и 1 столбцом, шириной 760 пикселей и границей и полем 0.
6. Выберите только что созданную таблицу, установите выравнивание по центру и цвет фона #005173.
7. Вставьте несколько изображений в таблицу одно за другим в виде меню панели навигации.
2. Средняя часть веб-страницы (список столбцов слева, новости сайта посередине, список столбцов справа)
1. После таблицы панели навигации нажмите «Вставить/Таблица», чтобы создать таблицу с 1 строкой и 3 столбцами, шириной 760 пикселей и границей и полем 0. И установите режим расположения на выравнивание по центру и цвет фона на #FFFFFFFF.
2. Поместите курсор в левую ячейку, установите его ширину 18%, выровняйте по центру по горизонтали и по верху по вертикали, затем вставьте изображение и панель навигации.
3. Поместите курсор после только что вставленного изображения, нажмите «Вставить/Таблицу» и вставьте таблицу из 12 строк и 1 столбца шириной 90%. Установите расстояние между ячейками равное 1, а цвет фона — #CCCCCC.
4. Поместите курсор в первую ячейку таблицы, установите его высоту 20 и цвет фона #FFFFFF. Вставить/Изображение: вставляет небольшую точку перед текстом навигации. Аналогично задайте остальные 11 ячеек, чтобы список классификации столбцов слева был завершен.
5. Поместите курсор в среднюю ячейку основной таблицы, установите его ширину 66 %, выровняйте по центру по горизонтали и по верху по вертикали, затем вставьте /image, чтобы вставить панель навигации.
6. Поместите курсор после изображения, нажмите «Вставить/Таблица» и вставьте таблицу с 4 строками и 1 столбцом шириной 95%. Установите расстояние между ячейками равное 1, а цвет фона — #CCCCCC.
7. Поместите курсор в первую ячейку таблицы, перетащите мышь, чтобы выделить все 4 ячейки, установите высоту 60 и цвет фона #FFFFFF.
8. Поместите курсор в ячейку в правой части основной таблицы, установите ее ширину 16 %, выровняйте по горизонтали по центру и выровняйте вертикально по верху, используйте «Вставка/Изображение» и вставьте панель навигации.
9. Поместите курсор после изображения, нажмите «Вставить/Таблица» и вставьте таблицу из 7 строк и 1 столбца шириной 90%. Установите интервал равным 1, а цвет фона — #CCCCCC.
10. Удерживая клавишу Ctrl, щелкните мышью ячейки 1, 3, 5 и 7 только что вставленной таблицы, а затем установите их высоту на 55 и цвет фона на #FFFFFF.
11. Выделите ячейки 2, 4 и 6, установите их высоту 6 и цвет фона #FFFFFF.
12. Перейдите в окно исходного кода и удалите пробелы « » в ячейках 2, 4 и 6.
Нижняя часть трех веб-страниц (обычно включает информацию об авторских правах и другой соответствующий контент)
1. Поместите курсор на основную таблицу и нажмите «Вставить/Таблицу», чтобы создать таблицу с 2 строками и 2 столбцами, шириной 760 пикселей и границей и полем 0.
2. Выберите таблицу, установите выравнивание по центру и цвет фона #3366CC.
3. Поместите курсор в левую ячейку строки 1 таблицы, установите его ширину на 50 %, горизонтальное расположение — на значение по умолчанию, вертикальное расположение — на базовую линию, цвет фона — #FFFFFF, а затем введите информацию об авторских правах. Цвет содержимого может быть следующим. что вы хотите.
4. Поместите курсор в правую ячейку первой строки таблицы, нажмите «Вставить/Изображение», вставьте округленное изображение, введите после него слово «Email» и установите его размер и цвет на 1 и #FFFFFF.
5. Вставить/Формировать объект/Текстовое поле, вставить текстовое поле, ширина может быть произвольной.
6. Insert/Image, вставка изображения GO.
7. Установите свойства страницы. Откройте меню «Редактировать/Свойства страницы», введите заголовок в столбце «Заголовок», выберите фоновое изображение и установите верхнюю границу на 0.
*** Разбивка всей веб-страницы на разные части и объединение их в разные таблицы также может ускорить чтение страницы браузером. ; Поскольку браузер отображает содержимое после прочтения всей таблицы, лучше не помещать всю таблицу в рамку.
8. Используйте таблицу макета для создания полной страницы.
1. Нажмите «Вставка/Макет», и кнопка просмотра макета внутри переключится в состояние просмотра макета (по умолчанию используется стандартный вид). Вы также можете использовать «Просмотр/Табличный вид/Просмотр макета» в меню для входа.
2. Сначала нажмите кнопку «Нарисовать таблицу макета», а затем создайте таблицу макета на странице, например рисунок.
3. Как и в предыдущем примере, нарисуйте большую таблицу вверху, затем в середине и внизу веб-страницы.
4. Снова нажмите кнопку «Нарисовать ячейку макета», а затем нарисуйте ячейку макета в уже нарисованной таблице макета.
5. Вернитесь к стандартному виду, вставьте в разделенные таблицы небольшие вложенные таблицы, доработайте страницу и завершите оформление всей страницы.
**** Будьте осторожны, помещая всю страницу в большую таблицу макета, поскольку скорость просмотра такой веб-страницы будет очень низкой. Несколько таблиц макета следует разделить по макету и содержанию страницы, а затем вставить в них ячейки макета.
9. Использование слоев
1. Нажмите «Вставить/Слой». Вы также можете нажать на значок и перетащить мышь, чтобы создать слой.
3. Выберите созданный слой и посмотрите на панель свойств. Просто используйте «Номер слоя» и «Метка» по умолчанию. «Номер слоя» необходим для программирования, но сейчас мы его обычно не используем. «Сверху» — расстояние от верхней границы страницы; «Слева» — расстояние от левой границы. «Ось Z» — это порядок слоев: большие числа располагаются поверх меньших чисел.
****Если цвет не установлен, слой будет прозрачным.
4. Нажмите на маленькое поле в верхнем левом углу среднего слоя, чтобы перетащить слой. Размер также можно отрегулировать.
5. В столбце «переполнение», когда текст превышает размер слоя, видимый (лишняя часть все равно отображается), скрытый (лишняя часть скрыта), прокрутка (полоса прокрутки отображается независимо от того, отображается ли она) превышено), авто (есть Полоса прокрутки появляется только при превышении).
6. Нажмите меню «Окно/Другие/Слой», и появится окно управления слоями. Там вы можете изменить имя слоя и значение оси Z или щелкнуть значок глаза, чтобы сделать слой видимым или невидимым. Также есть возможность предотвратить перекрытие.
7. Выравнивание слоев. Удерживая клавишу Shift, выберите несколько слоев одновременно. Затем используйте «Изменить/Выровнять», используя параметры здесь.
8. Слой вложения. ⑴Сначала вставьте слой в документ. ⑵ Поместите курсор внутри слоя, а затем продолжайте вставлять слой, чтобы получить вложенный слой. ⑶Внутренний слой называется дочерним, а внешний — родительским. Порядок их оси Z одинаков. Когда вы перетаскиваете родительский слой, дочерние слои также будут перемещаться относительно друг друга. При перемещении дочернего слоя родительский слой не перемещается вместе с ним.
10. Понимание временной шкалы
1. Нажмите «Вставить/Слой» в меню, чтобы вставить слой.
2. Вставьте в слой изображение, например изображение самолета. (Изображение здесь также может быть небольшим анимированным изображением в формате .gif)
3. Нажмите «Окно/Другие/Временная шкала» в меню, чтобы открыть окно «Временная шкала».
4. Выберите слой, созданный на странице, нажмите и удерживайте мышкой маленький значок прямоугольника в верхнем левом углу слоя и перетащите слой на первый кадр временной шкалы. В это время автоматически создается временная шкала длиной 15 кадров.
5. Выберите кадр 1 на временной шкале, перетащите слой на странице в левый верхний угол страницы, где начинается анимация.
6. Выберите кадр 15 на временной шкале и перетащите его на любую длину, например на 30 кадров.
7. Выделите 30-й кадр и перетащите слой в правый нижний угол страницы. В это время в окне отображается траектория движения слоя от 1-го кадра до 30-го кадра. (В этот момент движение является прямой линией)
8. Вы можете нажать на 15-й кадр, щелкнуть правой кнопкой мыши и выбрать «Добавить ключевой кадр». Выделив 15-й кадр, перетащите слой в среднюю и нижнюю часть страницы.
9. Отметьте пункт «Автовоспроизведение».
11. Создание вращающейся доски объявлений
1. Вставьте слой на страницу, а затем установите фон для слоя в качестве рамки доски объявлений.
2. Затем вставьте вложенный слой в созданный слой и переместите вложенный слой ниже родительского слоя.
3. Введите текст во вложенный слой и отцентрируйте его.
4. Откройте панель «Таймлайн» и добавьте на панель подслой как объект.
5. Создайте путь вверх для дочернего слоя и переместите его над родительским слоем.
6. Перетащите последний ключевой кадр, чтобы увеличить время анимации, а затем отметьте «Автовоспроизведение» и «Цикл».
7. Выберите родительский слой и установите для свойства «переполнение» значение «скрытый» на панели его свойств.
12. Использование Flash-анимации на странице
1. Нажмите кнопку Flash в разделе «Вставка», чтобы вставить анимацию на страницу. Вы также можете выбрать меню «Вставка/Медиа/Флэш», чтобы завершить этот шаг.
2. Выберите вставленную анимацию и посмотрите на панель свойств. Здесь вы можете установить его ширину и высоту или изменить размер путем перетаскивания.
3. Вы можете нажать «Воспроизвести» здесь, чтобы просмотреть анимацию.
13. Сделать вставленную флеш-анимацию прозрачной
1. Когда на веб-странице уже есть фон или вы хотите вставить флеш-анимацию на картинку, а сама флеш-анимация также имеет цвет фона, поэтому это повлияет на внешний вид , то нам нужно сделать анимацию прозрачной.
2. Например, вставьте изображение на страницу.
3. Вставьте слой в изображение и вставьте в него нужную флеш-анимацию.
4. Выберите флеш-анимацию и нажмите кнопку «Параметры» на панели свойств.
5. Введите «wmode» в левом поле «Параметры». Введите «прозрачный» в поле «Значение» справа.
14. Воспроизведение звука на странице
1. Если после заполнения всей страницы вы хотите добавить на страницу фоновую музыку, обратите внимание, что фоновая музыка обычно представляет собой файл *.midi. Такие звуковые файлы очень малы и их легко загрузить. быстро Другие форматы в качестве фоновой музыки не подходят.
2. В дополнение ко всем таблицам на странице (обратите внимание, что в это время на панели выбора меток в левом нижнем углу окна редактирования отображается только этот элемент, или нажмите на левый нижний угол, чтобы убедиться, что это поведение добавлено на всю страницу). Нажмите кнопку «+» в окне поведения (или используйте меню «Окно/Поведение», чтобы открыть окно поведения).
3. Выберите «Воспроизвести звук» во всплывающем меню. Открывает диалоговое окно.
4. Используйте «Обзор» в этом диалоговом окне, чтобы выбрать звук, который вы хотите воспроизвести, и подтвердите.
5. В это время на панели поведения автоматически отображается событие как загрузка, а действие как воспроизведение звука. Нажмите на эту строку, и посередине появится кнопка. Нажмите кнопку, чтобы установить событие, при котором будет воспроизводиться этот звук. Вы можете выбрать «Показать события»/«IE5.0.
6. Обычно мы используем Onload (когда страница загружена), OnClick (щелкните мышкой), OnMouseOver (наведите указатель мыши на объект), OnUnload (когда страница закрыта) и т.д.
7. Такое поведение также можно настроить для изображений и текстовых ссылок. Прежде чем воспроизводить звук по текстовой ссылке, сначала добавьте к тексту пустую ссылку, то есть выделите текст и введите символ «#» в поле ссылки.
15. Всплывающее окно
1. Сначала создайте страницу (например, a.htm), которая будет отображаться в небольшом окне. Поскольку всплывающее окно не может быть слишком большим, содержимое должно быть меньше.
2. Откройте созданную страницу, выведите курсор за пределы всех моих таблиц на странице, нажмите кнопку «+» в окне поведения и во всплывающем меню выберите «Открыть окно браузера».
3. Введите соответствующие настройки в диалоговом окне. Отображаемый URL-адрес — a.htm. Ширина и высота окна определяются вами в пикселях. При необходимости проверьте все параметры в свойствах.
4. После завершения настроек нажмите «ОК». В это время поведение открытия окна просмотра будет отображаться в окне поведения. Условие триггера — «Загрузка». Если это не требуется, установите его самостоятельно.
5. Такое поведение также можно настроить для изображений и текстовых ссылок. .
6. Вы можете использовать этот метод для выражения приветствия посетителю при открытии, объявления на сайте, прощания при выходе и т.д.
16. Управление информацией в строке состояния
1. Откройте страницу и выберите изображение.
2. Нажмите кнопку «+» в окне поведения и выберите «Задать текст/Задать текст строки состояния».
3. В столбце «Сообщение» диалогового окна введите слова, которые необходимо отобразить, например введение к этой картинке.
4. Вы можете установить условие срабатывания поведения OnMouseOver (мышь перемещается по объекту), чтобы при наведении курсора мыши на это изображение в строке состояния появлялась соответствующая информация.
5. Если вам нужно, чтобы это сообщение исчезло после удаления мыши, используйте это поведение еще раз, в столбце «Сообщение» ничего не записывайте, а затем измените условие триггера на OnMouseOut (мышь удалена).
6. Это поведение также можно настроить для фрагмента текста. Или вы можете установить его на всю страницу.
17. Всплывающая информация
1. Откройте созданную страницу и нажмите на элемент в левом нижнем углу. Нажмите кнопку «+» в окне поведения и во всплывающем меню выберите пункт «Всплывающая информация».
2. Введите сообщение, которое хотите отобразить, в столбце «Сообщение» в окне настроек.
3. Если условие триггера установлено на Onload (при загрузке страницы), его можно использовать как приветственное сообщение для открытия страницы. Если установлено значение OnUnload (когда страница закрыта), его можно использовать в качестве прощального сообщения, когда пользователь закрывает страницу.
4. Вы также можете установить всплывающее сообщение на определенный абзац текста. Например, если вы не хотите, чтобы другие копировали фрагмент текста, выделите весь текст. Обратите внимание, что <P> отображается в левом нижнем углу, который представляет собой абзац.
5. Затем сделайте то же самое и введите в сообщение такие утверждения, как авторские права. Просто установите условие триггера OnBeforeCopy (срабатывает при нажатии правой кнопки) или OnCopy (срабатывает при нажатии правой кнопки для копирования).
18. Кнопка динамического изображения
1. Подготовьте два изображения одинакового размера. Распространенный метод заключается в использовании одного в качестве фотографии в оттенках серого, а другого в качестве цветной фотографии. Или один с вогнутыми кнопками и один с приподнятыми кнопками.
2. Пример. Вставьте таблицу с 3 строками и 1 столбцом и установите ширину 180 пикселей.
3. Поместите курсор на первую строку и вставьте изображение в оттенках серого.
4. Введите адрес для ссылки в столбце «Ссылка» на панели свойств и добавьте имя к изображению, например tu1.
5. Нажмите кнопку «+» в окне поведения и во всплывающем меню выберите «Поменять изображение».
6. В это время изображение, подлежащее обмену, отображается в столбце «Изображение», а затем замененное изображение выбирается в столбце «Исходный файл храма».
7. Ниже есть два параметра: «Предварительная загрузка изображения» и «Восстановить изображение при ускользании мыши», оба из которых должны быть выбраны.
8. Таким же образом создайте две другие динамические кнопки.
19. Верстка страниц с фреймами
состоит из двух основных частей — наборов фреймов и отдельных фреймов.
1. Щелкните вставленный фрейм, чтобы отобразить 13 определенных стилей фреймов. В качестве примера возьмем структуру «верхний-средний-нижний».
2. Нажмите на значок структуры фрейма «Верх-Средний-Низ». В это время на страницу вставляются два фрейма, верхний и нижний, разделяющие всю страницу на три части. Вводим «верхний» сверху, «средний» посередине и «нижний» снизу.
3. Сначала сохраните его. Нажмите «Файл/Сохранить все» в меню. На этом этапе сначала сохраните файл набора фреймов, и вы можете самостоятельно изменить имя, например kuangjia.htm. Остальные страницы набора фреймов будут сохранены отдельно. При сохранении соответствующей страницы эта часть будет обведена пунктирной линией, чтобы вышеуказанную часть можно было сохранить как shang.htm. Нижняя часть сохраняется как xia.htm. Средняя часть сохраняется как zhong.htm.
4. На данный момент мы сохранили четыре страницы, а именно набор фреймов и верхнюю, среднюю и нижнюю страницы, составляющие набор фреймов. Таким образом, на самом деле этот фрейм состоит из четырех страниц, поэтому использование фрейма замедлит скорость просмотра пользователем.
5. Нажмите «Окно/Другие/Рамки», чтобы открыть панель фреймов. Нажмите здесь на рамку, чтобы выбрать ее. При выборе кадра на соответствующем кадре в окне редактирования появляется пунктирная линия.
6. Например: выберите верхний кадр выше, и свойства вышеуказанного кадра отобразятся на панели свойств. Также выберите среднюю рамку и нижнюю рамку, и вы также можете установить их свойства отдельно.
7. В окне редактирования поместите указатель мыши на границу между двумя кадрами. Курсор примет форму стрелки вверх и вниз. В это время щелкните границу, чтобы выбрать весь набор кадров.
8. В это время на панели свойств появятся свойства всей группы кадров. Здесь вы можете установить, есть ли у набора фреймов границы, ширина и цвет и т. д. Но самое главное, что здесь можно задать размер каждого кадра в установленном здесь кадре.
9. Выберите верхнюю рамку на правом значке панели свойств, установите ее поведение на 80 пикселей, а границу на 0.
10. Выберите кадр ниже и установите высоту линии на 30 пикселей, а границу на 0.
11. Выберите средний кадр, установите высоту строки на 1 и относительные единицы измерения. (Относительное означает: пропорция текущей строки относительно других строк. Установка значения 1 означает занятие всего оставшегося пространства окна просмотра, кроме верхней и нижней части.
12. Пример: поместите курсор на topFrame, щелкните правой кнопкой мыши и выберите «Свойства страницы», а затем установите цвет фона #FF6600. Затем вставьте/таблицу, вставьте таблицу с 1 строкой и 2 столбцами, а поле границы равно 0. Установите ширину первой ячейки 116 пикселей, а затем вставьте изображение. Установите горизонтальное выравнивание второй ячейки по центру и вертикальное выравнивание по нижнему краю, а затем последовательно введите слова «Лев», «Козерог» и «Близнецы».
13. Поместите курсор в основной кадр среднего фрейма, щелкните правой кнопкой мыши и выберите «Свойства страницы», а также установите цвет фона #FFFFCC. Затем вставьте большое изображение.
14. Поместите курсор в нижний фрейм, щелкните правой кнопкой мыши и выберите «Свойства страницы», чтобы установить фоновое изображение.
15. Создайте три дополнительные страницы, на которые будут ссылаться «Лев», «Козерог» и «Близнецы».
16. Выберите «Лео», в свойствах укажите страницу, на которую будет осуществляться ссылка, а затем в «Цели» выберите «мейнфрейм», то есть контент будет отображаться в среднем фрейме.
17. Также установите ссылки для «Козерога» и «Близнецов».
20. Меню перехода
1. Нажмите «Вставить/Сформировать объект/Меню перехода» в главном меню. Вы также можете использовать значок меню перехода в «Вставке/Форме», чтобы открыть окно настройки меню перехода.
2. Сначала введите слова «Пожалуйста, выберите соответствующий веб-сайт» в столбце «Текст». Затем нажмите кнопку «+» в окне. В настоящее время в меню есть дополнительная опция. Эта опция не имеет ссылки и используется только как текст описания для меню перехода.
3. Введите желаемый веб-сайт в текстовом столбце, например «Sina», а затем введите адрес ссылки на веб-сайт http://www.sina.com.cn в столбце «При выборе перейдите по URL». , пункт меню В столбце есть еще одна опция, эта опция соответствует адресу ссылки сети.
4. Тем же методом добавьте в меню другие параметры и соответствующие ссылки. Вы также можете использовать кнопки «вверх» и «вниз», чтобы настроить их порядок.
5. Не выбирайте опцию «Вставить кнопку перехода после меню» в окне настроек. Выберите пункт «Выбрать первый элемент после изменения URL-адреса», чтобы после использования меню перехода для перехода на определенную страницу, если вы вернетесь на страницу меню перехода, меню перехода на странице все равно будет отображать первый элемент по содержание по умолчанию.
6. Нажмите «ОК» после завершения настроек.
****Поскольку меню перехода представляет собой форму, сначала вставляется форма (красная пунктирная область), а затем в форму вставляется раскрывающееся меню.
7. Если вы хотите изменить параметры, вы можете выбрать раскрывающееся меню на странице. В это время нажмите «Значение списка» на панели свойств, чтобы изменить различное содержимое.
8. Когда выбрано меню перехода, поведение также отображается в окне поведения. Дважды щелкните поведение, чтобы войти в окно настроек и сбросить его.
9. Если первый элемент в «Элементах меню» представляет собой ссылку, а не подсказку, как указано выше, выберите «Вставить кнопку перехода после меню» в «Параметры». Добавьте кнопку «Перейти».
21. Использование плагинов (расширение функций Dreamweaver)
1. Сначала загрузите необходимые плагины. В качестве примера можно привести окно браузера Animate. Это плагин, который динамически меняет размер окна. Откройте диспетчер расширений Dreamweaver и установите загруженный плагин.
2. Запустите Dreamweaver, на созданной странице щелкните правой кнопкой мыши нижний левый угол <body>, затем нажмите кнопку «+» в окне поведения, выберите «Анимировать окно браузера», а затем выполните соответствующие настройки. Здесь высота и ширина устанавливаются равными 0 перед открытием окна и заполняют экран после открытия. Условие триггера — onLoad.
22. Прокручивающиеся субтитры
1. Поместите курсор в то место, куда вы хотите вставить прокручивающиеся субтитры.
2. Нажмите «Селектор тегов» на панели вставки.
3. Выберите тег выделения и нажмите кнопку «Вставить». Затем закройте «Селектор тегов».
4. Переключитесь в режим просмотра кода. Поместите точку вставки курсора между двумя тегами выделения.
5. Выберите «Окно»/«Инспектор тегов». В Инспекторе тегов можно настроить различные способы использования тегов.
6. Нажмите стрелку раскрывающегося списка в правой части элемента настройки поведения и выберите метод перемещения содержимого прокручиваемых субтитров. Три варианта имеют следующие значения: Альтернативный: контент перемещается в противоположных направлениях. Прокрутка: содержимое прокручивается в одном направлении. Слайд: содержимое перестает прокручиваться, когда оно касается границы субтитров.
7. Атрибут направления задает направление прокрутки содержимого субтитров. Четыре варианта означают: вниз: движение вниз. Влево: двигаться влево. Вправо: Двигайтесь вправо. Вверх: движение вверх.
8. Атрибут Scrollamount задает скорость прокрутки субтитров. Обычно устанавливается на 1.
9. Атрибут ScrollDelay устанавливает время паузы при прокрутке содержимого субтитров в миллисекундах. Если вы хотите, чтобы прокрутка выглядела плавной, значение должно быть как можно меньшим. В примере установлено значение 1 миллисекунда.
10. Атрибут width задает ширину прокручивающихся субтитров. Это произвольное значение, например, равное 300.
11. Событие onMouseOver устанавливает действие, когда мышь перемещается для прокрутки субтитров, и часто устанавливается для остановки прокрутки. Событие onMouseOut устанавливает действие, когда мышь покидает прокручиваемые субтитры, и часто настроено на начало прокрутки. Эти два пункта нельзя выбрать, их можно ввести только вручную. Введите «this.stop();» после onMouseOver и введите «this.start();» после onMouseOut.
12. Атрибут style задает стиль содержимого субтитров. В примере, чтобы установить размер текста субтитров, вам также необходимо вручную ввести «font:12px;».
13. Атрибут цикла задает количество прокруток содержимого субтитров. Значение по умолчанию не ограничено. «-1» также бесконечно.
14. Все коды: изменяющееся содержимое субтитров.
23. Создание таблицы стилей CSS
. 1. Введите текст на веб-странице.
2. Откройте панель «Стиль CSS» или используйте «Стиль окна/CSS», чтобы открыть ее.
3. В нижней части панели расположены четыре кнопки: «Добавить стиль», «Новый стиль», «Редактировать стиль» и «Удалить стиль».
4. Нажмите «Новый стиль», чтобы открыть диалоговое окно. Введите имя и обратите внимание, что перед именем стоит точка. Например, назовите его .zi (китайские имена недопустимы). Тип: Создайте собственный стиль, определенный в: Только в этом документе.
5. В это время откройте другое диалоговое окно, выберите «Тип» в категории слева, а затем установите шрифт «Song Dynasty» справа, размер 14 пикселей и любой цвет. Тогда ОК.
6. Выделите текст на странице, а затем нажмите Style.zi в окне. На данный момент к этому тексту применяется стиль CSS.
7. Если вы хотите изменить только что определенный стиль CSS, вы можете щелкнуть по нему, а затем нажать кнопку «Редактировать стиль» ниже.
24. Создание таблицы стилей динамической ссылки
1. Щелкните диалоговое окно «Новый стиль CSS», выберите «Только для этого документа» в столбце «Определено в», а затем выберите «Использовать селектор CSS» в столбце «Тип».
2. Когда тип листа стиля выбирает «Использовать селектор CSS», имя раскрывающегося меню изменяется на «Селектор», указывая на то, что входной содержимое является селектором CSS. динамическая ссылка.
A: Ссылка - нормальное состояние гиперссылки;
A: Hover - состояние, когда курсор перемещается в гиперссылку;
3. Затем установите эти состояния отдельно. (апельсин).
4. Используйте тот же метод, чтобы установить A: Посещение, установить его без подключения и установить цвет на #ffff00 (желтый).
5. Затем установите A: Hover, установите его подчеркнутую и установите цвет на #ff6600 (оранжевый).
6. Нет необходимости устанавливать A: Active, он будет автоматически зависеть от: Hover.
7. Введите предложение на веб -странице и установите его ссылку на «#» на панели свойств. Вот и все.
**** ПРИМЕЧАНИЕ. Он должен быть установлен в порядке: ссылка, a: посещение, a: Hover и A: Active, в противном случае ожидаемый эффект не произойдет.
Если нам нужно два или более эффектов ссылки на странице, мы можем использовать следующий метод:
1. Нажмите кнопку «Новый стиль», выберите «Использовать селектор CSS» для типа стиля, непосредственно введите A.Link2: ссылка в столбце «Селектор», а затем установите A.Link2: ссылка на красный без подчеркивания.
2. Продолжайте определять следующие два стиля. Введите имена напрямую и установите их на A.Link2: посещение, без подключения в фиолетовом. a.link2: парить, синий и подчеркнутый.
3. В настоящее время в опции «Стиль CSS» есть пользовательский стиль с именем Link2.
4. Введите абзац на странице, добавьте к нему ссылку #, выберите ссылку, а затем нажмите Link2 Style2 в окне листа стиля, чтобы применить этот стиль к ссылке.
5. Один и тот же метод можно использовать для создания разных форматов ссылок на одной странице.
**** Чтобы поддерживать определенный стиль, не рекомендуется создавать слишком много стилей ссылок на одной странице.
25. Лист внешнего стиля
*** Примените один и тот же лист стилей на разных страницах.
1. Создайте новый лист стилей, дайте ему имя, затем выберите «Создать пользовательский стиль» для типа и выберите «Файл нового стиля» для определения.
2. После подтверждения откройте окно, чтобы сохранить лист внешнего стиля. Тогда просто сохраните его на местном сайте.
3. В настоящее время вы можете видеть, что в окне листа стиля был добавлен новый лист стиля, а суффикс файла - CSS.
4. Если лист внутреннего стиля на текущей странице хочет быть экспортированным в файл листа внешнего стиля для использования другими страницами, вы можете щелкнуть по сердечному значке в верхнем правом углу окна листа стиля и выбрать «Лист стиля экспорта» I.
5. Когда другие страницы должны использовать листы внешнего стиля, вы можете нажать первую кнопку «Подключить лист стиля» в окне листа стиля, чтобы открыть окно, затем выберите файл листа внешнего стиля, выберите «Ссылка» в Add As и Подтвердить может.
26. Другое CSS
**** Фон в CSS - установить текстовый фон, фоновое изображение таблицы и т. Д.
**** Блоки в CSS См. Установку интервала текста, выравнивание, индекс, надпись, расположение и т. Д. Текста.
**** Ящик в CSS относится к настройке пустого расстояния между изображениями и содержимым текста, а также методом смешивания изображений и текста.
**** Граница в CSS относится к благоустройству текстовой области, кнопок и т. Д.
**** Список в CSS относится к установке стиля элементов списка. То есть, похожий на очередь абзац.
**** позиционирование в CSS относится к установке относительного и абсолютного позиционирования изображений на странице.
**** Расширение в CSS, курсор может быть установлен в стиль курсора, который можно установить на руку (тип рук), Crosshair (Cross Type), Text («I» тип), ожидание (тип ожидания), по умолчанию (Тип по умолчанию), помощь (тип справки) и типы стрел в различных направлениях.
**** Расширения в CSS, фильтры в ИТ, могут использоваться для создания эффектов фильтра CSS, то есть для обработки прозрачности, сияния и т. Д. Изображений. Тем не менее, эффект не очень очевиден.
27. Создайте онлайн -фотоальбом
1. Во -первых, установите программное обеспечение Fireworksmx.
2. Обработайте фотографии, которые вам необходимы, чтобы поместить в Интернет, обработать их в одинаковый размер и поместите их в папку.
3. Нажмите «Команда/создать альбом веб -сайта» в меню, чтобы открыть окно «Настройки».
4. Введите название альбома, информацию об субтитров и другую информацию (вы также можете изменить его позже). «Папка исходного изображения», выберите папку, где вы только что сохранили фото.
5. «Папка назначения», нажмите кнопку «Обзор», чтобы выбрать текущий каталог сайта. (Сохраните все фотографии на сайте)
6. Вы можете выбрать элемент «Размер миниатюра» в соответствии с вашими потребностями и элемент «Показать имя».
7. Ячейка «столбца» - это количество изображений, отображаемых в каждой строке.
8. Обычно выбирайте «более высокое качество» для следующих двух «форматов».
9. Выберите опцию «Создайте страницу навигации для каждой картинки». ХОРОШО.
28. Индивидуальная функция перехода веб -страницы
**** Переход веб -страницы относится к различным эффектам обновления, которые страница представляет, когда зритель входит или покидает веб -страницу, такую как прокрутка, жалюзи и т. Д. Веб -страница будет выглядеть более динамичной, но вы также должны обратить на нее внимание в меру, в противном случае слишком причудливые изменения могут легко вызвать отвращение зрителей. шаг:
1. Откройте страницу, нажмите «Вставка/тег/мета» в меню, и появится диалоговое окно «Мета».
2. Выберите HTTP-эквивалентную опцию в раскрывающемся списке параметров свойств в диалоговом окне и введите страницу в поле «Значение», чтобы указать, что при входе на веб-страницу будет эффект перехода веб-страницы.
3. SEPECTTRANS (продолжительность = 4, переход = 2) в блоке содержимого. усадка.
4. После ввода нажмите OK, чтобы сохранить. Таким образом, когда мы нажимаем на гиперссылку, чтобы ввести эту страницу, мы видим эффект.
эффектов
для выбора.
Коробка сокращается 0 Растворяется 12
Расширение, похожее на коробку 1, сжимается влево и направо к середине 13
Круг сокращается 2, а середина расширяется влево и вправо 14
Расширить круг 3 и сжиматься вверх и вниз к середине 15
Стереть 4, расширяйте среднюю вверх и вниз 16
Стереть 5 развернуть в нижнюю слева в шагах 17
Стереть 6 влево расширяйте 18 в верхнюю слева по ступенькам
Стереть справа 7 расширяется в нижнем правом правом на шагах 19
Вертикальные жалюзи 8, похожие на лестницу, в верхнем правом правом
Горизонтальные жалюзи 9 Случайные горизонтальные линии 21
Горизонтальная шахматная доска 10 случайных вертикальных линий 22
Вертикальный стиль шахматной доски 11 случайных 23
двадцати девять, библиотечные приложения
**** Некоторое контент на веб-сайте необходимо использовать неоднократно, например, значок веб-сайта, сделанный самим собой, и т. Д. В настоящее время этот компонент сохраняется в библиотеке. может быть вызван в любое время.
1. Откройте страницу и выберите компонент, который необходимо сохранить, например, значок.
2. Нажмите на окно/ресурсы меню, чтобы открыть окно ресурса. Затем выберите кнопку образца нижней книги, чтобы открыть панель библиотеки.
3. Нажмите новую кнопку ниже, чтобы сохранить значок, выбранную в библиотеку.
4.
30. Используйте шаблоны, чтобы быстро заполнить сайт (домашняя страница или внутренняя страница)
1. Во -первых, спланируйте веб -сайт, который вы хотите сделать, и разработать содержание каждой ссылки. Например, мой сайт:
Ссылки на домашней странице: веб -версия, анимированная версия, пожалуйста, оставьте сообщение обо мне, свяжитесь со мной, желать бутылки. Классная комната
Ссылки на анимированной версии такие же, как в веб -версии.
Ниже приведены ссылки на различные статьи или страницы курса. Например, «поиск правды в классе» ссылается на страницу, полную названий планов урока, а затем из каждого названия плана урока, она ссылается на страницу, где размещен план урока. То же самое относится и к другим.
2. Загрузите шаблон веб -страницы, который более подходит для вашего собственного планирования и фаворита. Другое - это обычно папка с именем изображений, и это то, что мы называем местом, где размещаются картинки.
3. Определите сайт, а затем скопируйте эти два файла (папки) в папку сайта.
4. Дважды щелкните файл index.htm, чтобы ввести состояние редактирования домашней страницы. Затем вы можете изменить страницу в соответствии с вашими потребностями. Это завершает домашнюю страницу.
31. Сохраните существующие веб -страницы в качестве шаблонов
****, используемых при большом количестве повторяющихся страниц на веб -сайте. (Обязательно определите сайт, прежде чем создать новый шаблон и использовать его)
1. Выберите страницу и нажмите «Файл/Сохранить» как шаблон, чтобы сохранить текущую страницу в качестве шаблона. Открывается окно «Сохранить шаблон», дает шаблону имя, а затем сохраните его.
2. В настоящее время вы можете обнаружить, что на сайте автоматически создается папка с именованными шаблонами, а в этом каталоге хранятся шаблоны, которые мы сохраняют. Его расширение .dwt
3. Этот шаблон не может быть изменен, пока он в настоящее время используется. Таким образом, вам нужно установить редактируемую область шаблона.
4. Например, на текущей странице шаблона вам необходимо сделать среднюю часть страницы редактируемой, чтобы вы могли добавить в него контент при использовании шаблона. Выберите ячейку таблицы в середине страницы (удерживайте клавишу CTRL и нажмите в ячейку) и нажмите «Вставка/объект шаблона/редактируемая область в главном меню». Откроется диалоговое окно, где вы можете дать шаблону имя и нажать OK.
5. Редактируемая область, определенная в это время, сформулирована голубой линией, а в верхнем левом углу есть название области. Сохраните и закройте файл шаблона.
6. Нажмите «Файл/новый» в главном меню и нажмите кнопку «Шаблон» выше в окне «Новая страница».
7. В настоящее время на данный момент указанные сайты указаны в столбце «Шаблон для». Выберите шаблон, и вы можете предварительно просмотреть его в столбце «Предварительный просмотр». Затем нажмите кнопку «Создать», чтобы создать новую страницу.
8. На новой странице, которая появляется, за исключением редактируемой области, другие детали не могут быть изменены.
32. Загрузите свой собственный веб -сайт
1. Подайте заявку на пространство веб -сайта, а затем загрузите его в Интернет. В настоящее время нет свободного пространства.
2. После нажатия применить применить форму, запрашивающую регистрацию, которая обычно включает в себя имя пользователя, пароль, электронную почту, контактный номер, провинция, имя домашней страницы, категория домашней страницы, введение на домашнюю страницу и т. Д.
3. После заполнения всего вы получите следующие элементы: ① Имя пользователя (просто заполнен) ② Пароль (просто заполнен) ③ Адрес загрузки FTP ④ Адрес домашней страницы (иногда вышеуказанные элементы отправляются на заполненный адрес электронной почты)
4. Загрузите и установите программное обеспечение для загрузки FTP, вы можете использовать CuteFTP (Kunshan Window/Software можно загрузить, бесплатно)
5. Откройте программное обеспечение CuteFTP и нажмите «Файл/менеджер сайта» в главном меню.
6. Заполните адрес загрузки FTP, имя пользователя FTP -сайта и пароль сайта FTP в открытии диалогового окна, а затем нажмите «Подключиться к серверу сайта». (Он будет автоматически подключаться, во второй раз, когда вы откроете его, не нужно снова заполнять его)
7. После завершения подключения на странице появится кадр. ) справа один, и загрузка завершена.
33. Чтобы продвигать ваш сайт,
как дать другим знать адрес веб -сайта?
1. Используйте специальное программное обеспечение, чтобы войти в систему в основные поисковые системы.
2. Ручное вход в систему. Например, Open Baidu ( www.baidu.com ), и есть ссылка «Вход на веб -сайт» ниже. Включите в поисковую систему Baidu, чтобы другие могли искать ваш сайт. То же самое относится и к входу на другие веб -сайты.