Создание файла html – Как написать простую HTML-страничку / Полезное / Сайты и биржи фриланса. Обзоры фриланс бирж. Новости. Советы. Фриланс для начинающих. FREELANCE.TODAY

Как создать файл стилей CSS?

Первый практический шаг, который необходимо сделать при работе со стилям CSS, это научиться создавать файл, в котором эти стили будут храниться. Давайте посмотрим, что для этого нужно сделать.

Первым делом нужно разобраться, что вообще собой представляет этот файл. Нужно понимать, что файл стилей CSS – это обычный текстовый файл, точно такой же, какой вы можете создать в любом текстовом редакторе «Блокнот», «Microsoft Word» и.т.д.

Единственное, что отличает файл стилей от других текстовых документов – это его расширение, которое имеет вид *.css.

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

Для тех, кто любит видео:

Все мои уроки по CSS (каскадным таблицам стилей) здесь.

Способ 1. Создание файла CSS меняя расширение текстового файла. 

Откройте любой текстовый редактор, например, редактор «Блокнот», который входит в состав операционной системы Windows. Найти эту программу можно через главное меню Пуск -> Все программы ->Стандартные -> Блокнот.

В главном меню программы выбираем «Файл-Сохранить как».

И сохраняем текстовый файл с расширением *.txt.

Теперь нужно поменять расширение этого файла с *.txt на *.css.

Если у Вас не отображается расширение файлов, вот заметка:

Как включить отображение расширений файлов в Windows.

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

Теперь для создания файла CSS нужно просто переименовать файл, изменив его расширение на css.

После данной операции вы получите файл стилей css.

Способ 2. Создание файла стилей с помощью редакторов кода  (на примере Dreamweaver). 

Многие специализированные программы для редактирвания кода, например Dreamweaver, имеют специальные функции для создания файлов стилей CSS.

Давайте посмотрим, как это можно сделать в редакторе Dreamweaver.

После открытия программы появляется главное меню, в котором можно выбрать создание файла CSS.

После того, как файл будет создан, его можно будет сохранить через главное меню «Файл-сохранить как…».

Аналогичный процесс создания файлов CSS есть и в других редакторов кода.

На сегодня все. Подготовьте все необходимые программы, о которых сегодня говорилось и создайте файл стилей style.css. Завтра мы начнем наполнять его содержимым.

Все мои уроки по CSS (каскадным таблицам стилей) здесь.

Немного о том, как создать файл HTML

Сейчас мы расскажем вам, как создать файл HTML, ведь именно с этого начинается составление сайта. Для того чтобы получить такой документ, можно использовать текстовый редактор или специализированные приложения. Чтобы добиться корректного отображения файла в обозревателе, потребуется соблюдение определенных правил при оформлении кода.

Определение

как создать файл htmlОтвечать на вопрос о том, как создать файл HTML, начнем с определения. Такой материал представляет собой обычный текстовый документ, однако в нем с помощью специальных дескрипторов можно задать расположение элементов содержания страницы относительно отдельных объектов либо окна браузера. При этом просмотреть результат можно посредством интернет-обозревателя.

Для того чтобы отредактировать HTML-код, можно использовать текстовый редактор или подобрать специальные программы, имеющие функции автоматического ввода и подсветки синтаксиса. Отметим, что примером приложения, которое хорошо подходит для эффективной работы с указанными документами, стал Sublime Text.

Во время использования редактора кода выберите в основном меню приложения пункт «Файл», а после этого «Сохранить как...». Далее в возникшем диалоговом окне следует указать директорию, в которой будет сохранен файл HTML, а также его имя и точное расширение. Таким образом, формат легко сменить.

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

Правила

создать файл htmlСуществует ряд правил, без полного соблюдения которых страница Интернета отображается некорректно или не открывается вовсе. Если вы хотите знать, как создать файл HTML без ошибок, следует помнить о нескольких рекомендациях. Тег необязателен, однако его наличие поможет браузеру верно интерпретировать полученный код, а также распознать заданную структуру документа.

В определенных ситуациях причиной некорректного показа веб-страницы является отсутствие либо неправильное написание данного тега. Парный код <html> </html> представляет собой дескриптор. В него заключается содержимое веб-страницы целиком. При этом элементы материала, которые расположены за пределами данного тега, отображаются в виде обычного текста либо блокируются браузером.

Исключением выступает <DOCTYPE!>. Если говорить о том, как создать файл HTML, важно знать, что одноименный дескриптор является обязательным для материалов такого типа. При этом такое обозначение нельзя использовать на правах тега более 1-го раза на странице. С помощью особых обозначений <head> и </head> указывается информация относительно документа.

Отметим, что между данными тегами с помощью дескрипторов <title> и </title> следует задавать заголовок веб-страницы. В свою очередь, посредством <link> можно подключить файлы JavaScript или CSS.

Аналогично внутри параметра <head> приводятся тип документа, кодировка, стили, версии оформления в разных браузерах, а также ряд других параметров. Хотя содержимое тега и не отображается браузером, данный дескриптор обязателен.

Основа

файл htmlТег совместно с заключает в себе тело сайта - информацию, которая отображается на экране пользователя. Речь может идти о заголовках, подзаголовках, параграфах и строках текста, изображениях, видео или других объектах мультимедиа. При этом указанный дескриптор обязателен.

Внутри могут быть применены другие элементы: <footer>, <article> или <header>. Хотя они и не влияют непосредственно на отображаемый в браузере результат, однако создают структуру кода HTML, это принято считать хорошим тоном среди web-разработчиков и верстальщиков.

Блокнот под рукой

как создать файл html в блокнотеСейчас мы рассмотрим, как создать файл HTML в "Блокноте". Именно с разработки страниц HTML в этом приложении начинали обучение сайтостроению все веб-программисты. Вы также можете освоить такую несложную науку. Заполнять "Блокнот" информацией следует, основываясь на советах, которые были приведены ранее, то есть изучить значение тегов, расставить их в нужных местах, заполнить содержимым.

Превратить "Блокнот" в HTML-страницу очень просто, как это сделать, мы уже описывали. Таким образом, вы ознакомились с основами процесса, и, возможно, согласитесь, что создать файл HTML не очень сложно.

Как создать html документ 🚩 Веб-программирование

Инструкция

HTML-файл является обычным текстовым документом, в котором с помощью специальных дескрипторов задается расположение элементов контента относительно друг друга или окна браузера. Просмотреть работу файла можно через интернет-обозреватель. Чтобы отредактировать код HTML, можно воспользоваться текстовым редактором или подобрать специальные программы, имеющие такие функции, как автоматический ввод и подсветка синтаксиса. Примером приложения, хорошо подходящего для удобной работы с подобными документами, является Sublime Text 2.

При использовании редактора кода в главном меню программы выберите пункт File («Файл») - Save As... («Сохранить как...»). В открывшемся диалоговом окне вам понадобится указать директорию для сохранения файла, а также имя и расширение. Можно сконвертировать текстовый документ в HTML-страницу, дописав в конце имени расширение html.

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

Тег <DOCTYPE!> хоть и не является обязательным, но его наличие помогает браузеру правильно интерпретировать код и распознать структуру документа. Иногда причиной некорректного отображения веб-страницы является именно отсутствие или неправильное написание этого тега.

Парный <html> </html> является дескриптором, в который заключается все содержимое веб-страницы. Элементы кода, которые находятся за пределами этого тега, отображаются как обычный текст или блокируются браузером, за исключением <DOCTYPE!>. Дескриптор <html> является обязательным и не может быть использован на странице более одного раза.

При помощи <head> </head> указывается основная информация о документе. Между этими тегами с помощью дескрипторов <title> </title> задается заголовок веб-страницы, а посредством <link> подключаются файлы CSS или JavaScript. Таким же образом внутри парного тега <head> указываются стили, кодировка, тип документа, версии оформления для разных браузеров или устройств и некоторые другие параметры. Содержимое тега не отображается в окне браузера, однако дескриптор является обязательным.

Между тегами <body> и </body> заключено тело сайта - информация, которая выводится на экран пользователя. Это могут быть заголовки, подзаголовки, параграфы и строки текста, изображения, видео или другие объекты мультимедиа. Дескриптор является обязательным. Кроме того, внутри него могут быть использованы другие элементы <header>, <article> или <footer>. Они не влияют на отображаемый результат, но создают структуру HTML-кода, что считается хорошим тоном в кругах web-разработчиков или верстальщиков.

Создание ссылок в HTML

ссылки  в html

Приветствую Вас дорогие друзья! В этой статье мы поговорим о HTML ссылках. Это очень важный элемент и Вы, безусловно, должны знать, что это такое и где используются, так как ссылки присутствуют на каждом сайте.

Я еще не встретил в интернете такие сайты, чтобы не имели хотя бы одну ссылку. В первую очередь ссылки используются для связки страниц, то есть для того чтобы пользователь смог перейти с одной страницы на другую.

Также они используются в следующих случаях:

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

Ссылки имеют следующий синтаксис:


<a href="адрес страницы" >Якорь ссылки </a>

Атрибут href является обязательным, в его значение указываем адрес страницы, на которую хотим перейти. Также в его значение мы можем указать путь к изображению или путь, к файлу которого хотим скачать.

Существует 2 типа адресов, это абсолютный адрес и относительный.

Абсолютный адрес это когда указываем адрес какого-то сайта из интернета, вместе с протоколом http. Например:


<a href="https://www.vk.com" >Социальная сеть ВКонтакте </a>

После клика по данной ссылке мы перейдём в социальную сеть ВКонтакте.

Относительный путь это путь относительно текущего файла. Допустим, в папку сайта находится два файла, главная страница index.html и страница о нас about.html. Для того чтобы мы смогли перейти с главной страницы на страницу о нас, в значение атрибута href у ссылки на главной странице нужно написать название файла который отвечает за страницу на которой хотим перейти. В нашем случае мы хотим сделать ссылку для перехода с главной странице на страницу о нас, поэтому в коде главной странице добавляем такую ссылку:


<a href="about.html" > Перейти на страницу О нас </a>

Изображение в качестве якоря ссылки

Вместо якоря ссылки может быть и изображение. Нажимая на изображение, мы перейдём на указанный адрес в значение атрибута ссылки href. Вот пример такой ссылки:

изображение вместо якоря ссылки

HTML код такой ссылки следующий:


<a href="https://ru.wikipedia.org/wiki/Angelina_Jolie" >
    <img src="images/angelinajolie.jpg" alt="Анжелина Джоли" />
</a>

Ссылка на изображение

Если в значение атрибута href указать адрес на какое-нибудь изображение, то при нажатии на данную ссылку, в браузере откроется изображение в полном ее размере.

Посмотрим это на примере. Напишем следующие строки в код странице.


<h2 align="center" > Ссылки </h2>
<p> Для того чтобы посмотреть изображение в браузере, кликните на ее. </p>
<p>
    <a href="images/bugatti.jpeg" >
        <img src="images/bugatti.jpeg" alt="Bugatti" />
    </a>
</p>

Открываем страницу в браузере и смотрим на результат:

просмотр изображения в браузере

После клика на изображение, оно откроется в браузере.

Увеличенное изображение

Ссылка на файл

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

И так для того чтобы это реализовать нужно в значение атрибута ссылки href, указать путь к файлу для скачивания. Например, нужно сделать так чтобы пользователь смог скачать какой-нибудь документ с расширением .docx. Для начала на хостинге сайта создаем папку для файлов, назовем ее, например files. Вставляем в созданную папку нужный файл и в коде страницы пишем следующие строки:


<p>
    <a href="files/document.docx"> Скачать Документ </a>
</p>

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

ссылка на файл

Аналогично можно сделать и с остальными типами файлов.

И на этом все. Из этой статьи Вы узнали следующие:

  • Как создать ссылку на другую страницу.
  • Как сделать изображение ссылкой.
  • Как сделать ссылку на изображение
  • Как создать ссылку на файл.

Теперь Вы сможете сделать все это сами. Без чьей либо помощи.

Похожие статьи:

Видео:

Понравилась статья?

Тогда поделитесь ею с друзьями и подпишитесь на новые интересные статьи.

Поделиться с друзьями:

Подписаться на новые статьи:

Поддержите пожалуйста мой проект!

Следующая статья >>

Если у Вас есть какие-то вопросы или предложения, то можете писать их в комментариях или мне на почту [email protected]. И если Вы заметили какую-то ошибку в статье, то прошу Вас, сообщите мне об этом, и в ближайшее время я всё исправлю.

Добавляйтесь ко мне в друзья в:

Добавляйтесь в мои группы:

Подпишитесь на мои каналы:

Автор статьи: Мунтян Сергей

Копирование материалов с сайта sozdatisite.ru ЗАПРЕЩЕНО!!!

Дата добавления: 2015-12-11 11:50:05

Каркас страницы html. Создаём файл

Каркас страницы html. Создаём файл

Для создания HTML документа необходимо написать каркас страницы. Вам этого делать не придётся. Копируйте готовый код, и читайте, что означают символы в коде.

В предыдущей статье мы создали Директорию сайта, а в этой приступим к написанию страницы, или созданию html документа (файла), что в общем-то одно и тоже.

Каркас страницы по версии HTML 5

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<title>Документ без названия</title>
</head>
<body>
Контент
</body>
</html>

И каркас страницы по версии HTML 4.01 Transitional, являющейся переходной между 4 и 5 версиями, и актуальной до сих пор.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Документ без названия/title>
</head>
<body>

</body>
</html>

Как видите, версия HTML 5 заметно проще своих предшественников.

Кратко рассмотрим, что-же означают все эти слова и символы.

Первая строка HTML 5

<!DOCTYPE HTML>

Первая строка HTML 4.01

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

указывает на тип создаваемого нами документа.

Здесь указано, что создаётся html-документ по версии html 5 или 4.01.

Далее идёт столбик из тегов. Тег — это конструкция языка, которая указывает браузеру, что нужно отображать на экране монитора. Какие-то теги говорят, что нужно отображать заголовок, какие-то абзац и так далее. В каркасе страницы находятся теги называющиеся тегами верхнего уровня.

Первый тег в столбике — это <html>. Обратите внимание на то, что и последний тег тоже

только со слешем (наклонной чертой).  Это классический пример парного тега, где сначала идёт открывающий элемент, а потом закрывающий.

Значит теги бывают парные, и представляют из себя контейнера для html-кода, но бывают и одиночные. Придёт время и мы их так же разберём. Данный тег <html> является контейнером для всей страницы.

Следующий тег, так-же парный — <head>, что в переводе с английского означает голова. Этот контейнер, уже сам находящийся в контейнере html, содержит в себе специальные теги, действие которых не всегда явно видно на мониторе.

Они говорят, в какой кодировке сделана страница, какие скрипты и таблицы стилей должны на ней подключаться, ну и какое название страницы будет отображено во вкладке браузера.

Далее тег <body>(тело) так же парный, то есть так же контейнер внутри контейнера html, и в нём уже будут расположены форматирующие теги, которые будут указывать на расположение абзацев, картинок, ссылок, и вообще всего того, что мы видим на мониторе.

Из примеров видно, что код каркаса в HTML 5, заметно сократился. В теге <!DOCTYPE> нет больше описания версии и типа файла, в <meta> остался только charset, для указания кодировки.

И ещё, при подключении таблиц стилей больше не нужно будет указывать type="text/css" в тегах <link> и <style>

Теперь давайте откроем установленный у нас редактор Notepad++. Так как мы будем пользоваться им очень часто, предлагаю разместить его в меню Пуск. Для этого нужно щёлкнуть по значку Пуск, затем правой клавишей, по открывшейся строчке с блокнотом и карандашом, и в открывшемся меню выбрать Закрепить на панели задач

Затем щёлкнем по его иконке, появившейся в нижней строке монитора, и нам откроется домашняя страница редактора. Щёлкаем по первой вверху иконке (новый), и открываем новый документ, в который и скопируем, или перепишем(как угодно), каркас страницы.

Копируем код каркаса страницы в новый документ в Notepad++

Хочу сразу предупредить, что мельчайшая ошибка  в коде (нет точки, или кавычек и тому подобное), приводит к тому, что код не работает.

После этого, в строке панели управления(вверху), находим пункт Encoding(кодировка), и в открывшемся меню выбираем Преобразовать в UFT-8.

Выбираем кодировку в Notepad++

И чтоб в дальнейшем не волноваться по этому поводу, щёлкнем по пункту Settings(опции), затем по строке Настройки”, в окне настроек – Новый документ, и ставим точку в строке UTF-8. Затем Закрыть

Устанавливаем кодировку в Notepad++ 

После этого, нужно щёлкнуть по третьей иконке слева Сохранить, и в появившемся окне поиска, находим созданную нами на предыдущей странице Директорию сайта.

Открываем папку site, в строчке Имя файла убираем nev1, пишем index.html, и жмём Сохранить.

Сохранение файла каркаса страницы в директории сайта

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

Файл каркаса страницы в Notepad++

Поздравляю! Вы только-что создали файл. Теперь, если зайти в директорию сайта (Пуск-Компьютер-Документы-site), то там Вы увидите такую конструкцию:

Директория сайта

Как видите, файл index.html занял своё место в корне сайта, и в следующих статьях этого урока, мы научимся заполнять его кодом, и просматривать в браузере то, что у нас получилось.

Если вы сохраните эту страницу в закладках, то в дальнейшем вам не придётся в ручную писать каркас страницы, так как достаточно будет заглянуть сюда и скопировать код.

Желаю творческих успехов.

Короткий отдых
Перемена

Чем отличается мужское общежитие от женского?
В мужском общежитии дурдом, а в женском — домдур

Раньше студенты учились и подрабатывали, а теперь работают и подучиваются.

Создание директории сайта < < < В раздел > > > Шаблон сайта на чистом HTML

Рекомендую: Бесплатные HTML шаблоны на русском от TemplateMonster

Запись опубликована в рубрике HTML основы. Добавьте в закладки постоянную ссылку.

А так же:

Короткий отдых

Контактная информация: Сергей Кутузов; скайп: webded1; адрес: г. Казань, ул. Ново-Девликеевская, дом 108.

© Копирование и переписывание информации с сайта без письменного согласия с администрацией сайта https://sekretymastera.ru запрещено. Авторские права на все тексты, картинки, дизайн, логотип, дизайн сайта https://sekretymastera.ru принадлежат Кутузову Сергею Юрьевичу

Короткий отдых

4

Создание файла CHM средствами HTML Help Workshop |

Поделиться с друзьями

Процесс создания chm значительно облегчает такой инструмент как HTML Help Workshop, разработанный Microsoft. Качаем HTML Help Workshop с сайта Microsoft. Устанавливаем HTML Help Workshop на свой компьютер. Создаем на локальном диске D: папку и называем ее chm. Запускаем HTML Help Workshop, выбираем в контекстном меню «File» -> «New» -> «Project». Откроется окно мастера проекта.

Рис. 1. Первая страница мастера создания справкиРис. 1. Первая страница мастера создания справки

Необходимо указать, где будет храниться проект файла chm. Я указал созданную нами папку.

Рис. 1. Первая страница мастера создания справки

Рис. 2. Окно выбора расположения проекта

На следующем шаге ничего не меняем, так как у нас нет никаких файлов, которые можно было бы уже добавить в проект HTML Help Workshop.

Рис. 1. Первая страница мастера создания справки

Рис. 3. Окно указания какие файлы, необходимые для создания справки уже есть у вас

Нажимаем «Готово». У нас получился пустой проект. Теперь нужно подготовить файлы, без которых невозможно создание chm. Главное – это сами страницы, содержащие справку. Для их создания необходимо выбрать в контекстном меню «File» -> «HTML File», в появившемся окне набрать название страницы, которую будем создавать. Я назвал ее «Intro».

Рис. 1. Первая страница мастера создания справки

Рис. 4. Создание первого файла HTML

После того как вы вбили свое название и нажали «OK», перед вами будет окно, в котором уже есть пустая html страница, если мы сохраним ее в таком виде, то это будет просто пустая html страница c заголовком «Intro». Наберите что-нибудь между тегами <body></body> и сохраните страницу, нажав на изображение дискеты, в папке D:\CHM.

Рис. 1. Первая страница мастера создания справки

Рис. 5. Редактор HTML страниц

Также создайте еще пару страниц, чтоб можно было немного поэкспериментировать. Я создал страницы «FolderIntro.htm» и «Help In Folder.htm»

Рис. 1. Первая страница мастера создания справки

Рис. 6. Файлы в папке проекта

Теперь у нас есть 3 файла, которые необходимо скомпилировать в один файл chm. Но для того, чтобы созданный chm был полноценным важно наличие дерева каталогов и страниц справки, хранящихся внутри файла. Это дерево всегда располагается слева от текста справки. Для создания этого дерева нам нужно перейти на вкладку «Contents» в окне HTML Help Workshop. При нажатии на эту вкладку появится вопрос:

Рис. 1. Первая страница мастера создания справки

Рис. 7. Создание файла контента (в котором хранится древовидная структура справки)

Мы, конечно же, соглашаемся и создаем новый файл контента. Примем то имя файла, которое предложит нам HTML Help Workshop – «Table of Contents.hhc». С левой стороны обращаем внимание на вертикальный ряд кнопок, ими мы будем пользоваться при создании файла контента. Нажмем верхнюю из них – «Contents Properties».

Рис. 1. Первая страница мастера создания справки

Рис. 8. Окно в котором создается дерево контента

Появится такое вот окошко «Table of Contents Properties», можете в будущем поиграться с настройками стилей и видов, но сейчас мы не будем тут ничего менять, закроем окно. Рассмотрим кнопки немного ниже, чем кнока «Contents Properties», первая (с изображением папки) – создает каталог внутри файла chm, в который можно помещать страницы, вторая (с изображением исписанного листа бумаги) – создает страницу внутри файла chm, третья (карандаш) – редактирует страницу или каталог внутри файла chm, четвертая – удаляет страницу или каталог из списка страниц внутри файла chm. Еще ниже, расположены кнопки, которые позволяют перемещать страницы и каталоги вверх и вниз по списку, также передвигать правее и левее. Предпоследняя кнопка для просмотра HTML кода страницы и последняя, чтоб сохранить всю эту беду.

Итак, давайте приступим к созданию дерева каталогов. Нажмем на кнопку с изображением листика, перед нами появится окно, в котором заполняем поле «Entry title» (у меня набрано Intro). Нажимаем кнопку «Add…», появляется окно «Path or URL», набираем в поле «File or URL» название нашей первой созданной html страницы. Так как страница хранится в той же папке, что и сам проект – D:\CHM, то нет необходимости указывать полный путь к файлу.

Рис. 1. Первая страница мастера создания справки

Рис. 9. Добавление страницы в таблицу контента

Рис. 1. Первая страница мастера создания справки

Рис. 10. Добавление страницы в проект

Затем нажимаем «OK» в обоих окошках. Теперь нажимаем на кнопку с изображением папки. Появится окно, которое интересуется вставить ли каталог в начало таблицы контента. Мы согласимся, а потом, если надо, изменим.

Рис. 1. Первая страница мастера создания справки

Рис. 11. Указание расположения записи в дереве контента

Здесь появляется такое же окошко, как и при добавлении отдельной страницы, то есть надо дать название каталогу и указать, какой html файл будет отображаться при выделении этого каталога. После того, как каталог настроен, выделяем этот каталог и нажимаем на кнопку с изображением страницы. На вопрос о том вставить ли страницу в начало, мы отвечаем «Нет». И, таким образом, после настройки этой страницы она будет помещена внутрь только что созданного каталога. Теперь можно переместить каталог ниже, нажав на кнопку со стрелкой, направленной вниз.

Рис. 1. Первая страница мастера создания справки

Рис. 12. Что-то похожее на дерево контента

Сохраним таблицу контента.

Теперь создадим «Индекс» для файла chm. Для этого перейдем на вкладку «Index» и согласимся создать новый индексный файл «index.hhk». В появившемся окне нажимаем на кнопку с изображением ключа, набираем в поле «Keyword» ключевое слово, при поиске которого по индексу (когда файл справки будет уже создан) будет открываться определенная страница. После того, как указали ключевое слово, также как и при создании таблицы контента, нужно указать файл, который будет соответствовать этому ключевому слову.

Рис. 1. Первая страница мастера создания справки

Рис. 13. Окно создания индекса

После того как созданы таблица контента, индекс и сами html файлы можно приступить к непосредственно настройке файла chm. Для этого переходим на вкладку «Project», и тут нажимаем на самую верхнюю в вертикальном ряду кнопку. Настраиваем все как на скриншотах.

Рис. 1. Первая страница мастера создания справки

Рис. 14. Настройка проекта вкладка General

Рис. 1. Первая страница мастера создания справки

Рис. 15. Настройка проекта вкладка Files

На вкладке «Files» видно, что необходимо указать какие файлы мы используем как Contents file и Index file, а также Full text search stop list file. Первые два файла мы создали ранее, а последний создадим, нажав кнопку «Browse…» и указав имя «search». После этого нажимаем «OK».

Для создания поиска по файлу chm необходимо на вкладке «Compiler» поставить галку «Compile full-text search information».

Теперь жмем на кнопку с изображением папки (вторая сверху), в появившемся окне нажимаем кнопку «Add…», выделяем все html файлы, которые хотим добавить в справку и нажимаем «Открыть». Все файлы будут добавлены в файл справки. Теперь у нас должна быть такая картина.

Рис. 1. Первая страница мастера создания справки

Рис. 16. Добавления файлов HTML

Остается только скомпилировать файл chm. Нажимаем на самую нижнюю кнопку в вертикальном ряду кнопок.

Рис. 1. Первая страница мастера создания справки

Рис. 17. Компиляция

Появляется лог, того что проделано. Открываем папку D:\CHM, и видим там готовый файл «MyProject.chm». На этом создание chm завершено.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *