АННОТАЦИЯ
Данная дипломная работа на тему
«Создание электронного учебника» «Проектирование штампов и оснастки».
Выполнен студентом Качуро Сергей
Вячеславович, под руководством Сабденовой Майко Кадырбаевны.
В настоящее время из-за нехватки
литературы возникла необходимость в создании электронных учебников. Электронные
учебники создаются с использованием Web-страниц.
Web-страницы,
поддерживая технологию мультимедиа, объединяют в себе различные виды
информации: текст, графику. От того, насколько качественно и красиво сделана та
или иная Web-страница,
зависит во многом ее успех в Сети.
Пользователю
приятно посещать те Web-страницы, которые имеют стильное оформление, не
отягощены чрезмерной графикой и анимацией, быстро загружаются и правильно
отображаются в окне Web-браузера.
Электронный учебник будет использован на
кафедре «Обработка металлов давлением» для лабораторных занятий у студентов
специальности ОМД.
Пояснительная записка выполнена на 58 листах.
Графическая часть дипломной работы
состоит из 2 плакатов:
1) Образец титульного листа и титульный
в HTML – коде;
2) Таблица экономической части.
СОДЕРЖАНИЕ
Введение……………….……………………………………………….…...4
1. Общая часть…………..………………….………………………….……5
1.1. Технические требования,
предъявляемые к компьютеру……….......5
1.2. Содержание учебника…..…………………….………...…..………….5
1.3. Создание электронного учебника……………………………...……...5
2. Руководство по использованию
электронного учебника….………....24
3. Безопасность и экологичность проекта……………………………......25
3.1. Требования к помещениям для
эксплуатации ВДТ и ПЭВМ……....21
3.2. Составление схемы оповещения о
чрезвычайных ситуациях
г. Темиртау АО «Миттал Стил Темиртау»…………………………….…26
3.4. Безопасность при
чрезвычайных ситуациях………………….…..…24
3.5 Экологичность……………………………………………………….....29
4. Экономическая часть………………………….……………………..….30
4.1 Расчет потребности
предпроизводственных затрат……………...….30
4.2. Расчет годовых эксплуатационных
затрат использования
программы……………………………..……………………...………..34
4.3. Фонд зарплаты и годовые затраты заказчика до
использования
программы………………………………………………………………….37
4.4. Расчет ожидаемого годового
экономического эффекта от
использования программы...................................………………..….........38
4.5.
Расчет
цены программы……………………………………………..38
4.6.
Расчет основных технико-экономических показателей...………….38
Список использованных источников…..………………………………...40
Приложение…..…………………………………………………..………..41
ВВЕДЕНИЕ
Internet – это
крупнейшая компьютерная сеть в мире. Более 275 млн. человек, проживающих во
всех уголках планеты, ежедневно пользуются ее услугами для доступа к разнообразной
информации, обмена сообщениями электронной почты, участия в деятельности
виртуальных сообществ и дискуссионных групп, совершения покупок и выполнения многих
других насущных операций.
World Wide Web –
это часть Internet, представляющая собою гигантский набор документов,
хранящихся на компьютерах по всему миру. World Wide Web чаще всего называют
сокращенно WWW или просто Web.
Web-страница –
это отдельный документ web, который способен содержать информацию различного
вида – текст, рисунки, фотографии, фрагменты видео- и аудиозаписей.
Web-страницы хранятся на компьютерах, которые носят название web-серверов.
Будучи сохраненной, на диске web-сервера, страница становится доступной для
использования другими людьми. Многие начальные учебные заведения, университеты,
государственные учреждения, компании, организации и отдельные граждане создают,
пополняют и развивают собственные коллекции web-страниц, именуемые web-сайтами.
HTML – это
обычный, текстового вида файл, в котором то, что мы обычно видим на
web-страничках, перемежается невидимым для просмотра из браузера кодом. Вот
этот-то невидимый код и есть язык разметки HTML.
HTML – это не
язык программирования, – он служит лишь для разметки странички, придания
определенного вида тому или иному элементу, будь то таблица, текст или картинки.
Осуществляется
это путем присвоения каждому элементу своих параметров, которые распознает
браузер. Параметры эти могут быть заданы как для одного, так и для группы или
типа элементов. Тип элементов может быть таким: таблицы, ячейки, ссылки, текст
и т.п. То есть что-то, что можно назвать одним термином. Отдельные свойства
можно присваивать и выбранным элементам персонально.
Параметры
отображения элементов задаются при помощи тегов, в которых и задается желаемый
вид того или иного элемента нашей странички.
1. ОБЩАЯ ЧАСТЬ
1.1. Технические
требования, предъявляемые к компьютеру
Компьютер, на
котором будет устанавливаться данный учебник должен обеспечивать следующие
системные требования:
1) На машине
должны быть установлены: операционная система Windows XP Professional версия 2002, Microsoft Front Page;
2) Процессор
Intel(R) Celeron(R) 1.80 GHz;
3) Оперативная
память 224Mb ОЗУ;
4) Монитор;
5) Дисковод;
6) Мышь;
7) Клавиатура.
Минимальные
требования к аппаратному обеспечению:
1)
Windows XP Professional версия
2002, Microsoft Front Page;
2) Оперативная
память 224Mb ОЗУ;
3) Монитор 15.
1.2. Содержание
учебника
В учебнике
рассматриваются принципы построения магистральных, зоновых и местных сетей
связи; приводятся конструкции, характеристики и электрические
параметры кабельных и воздушных линий связи. Излагается теория распространения
электромагнитной энергии по направляющим системам – симметричным и коаксиальным
кабелям, волноводам, световодам, оптическим и сверхпроводящим кабелям, а также
теория взаимных и внешних влияний и меры защиты от них. Освещаются теория и
практика защиты сооружений связи от влияний атмосферного электричества,
высоковольтных линий, радиостанций и электрифицированных железных дорог.
Отдельные главы посвящены проектированию, строительству и эксплуатации
кабельных и воздушных линий связи, а также вопросам надежности кабельных линий
связи. Учебник также содержит лабораторные работы и тесты.
1.3. Создание
электронного учебника
1.3.1. Принцип
наследования тегов
Теги-контейнеры.
Прежде всего,
стоит определить то, как эти теги располагаются. Дело в том, что теги в
большинстве своем состоят из двух частей – это открывающий (он же – содержащий
параметры) и замыкающий, то есть, "конец" тега. Заданные в теге
параметры действуют только между его началом и концом, то есть, только внутри
тега:
<начало 1-го тега>
текст текст текст текст текст текст
текст текст текст текст текст текст текст текст
<начало 2-го тега>
текст текст текст текст текст
текст текст текст текст текст текст текст текст
текст
<начало
3-го тега>
текст
текст текст текст текст текст текст текст
текст текст текст текст текст текст
<Конец
3-го тега>
<Конец 2-го тега>
<Конец 1-го тега>
Вот эти
"отступы" от левого края – они тоже не случайны – они автоматически выставляются
программами, формирующими код HTML для упрощения его восприятия. Достаточно
понимать, что чем дальше от левого края отстоит тег, тем "глубже" он
лежит, тем большее количество "старших" тегов может на него
действовать. В некоторых случаях параметры ранее заданного тега могут
распространяться и на тег, размещенный в нем, то есть на содержимое вложенных
тегов.
Также следует
заметить, что некоторые параметры вложенных тегов могут воздействовать и на
вышестоящие, "старшие" теги. Например, это типично для таблиц,
вложенных одна в другую.
Если у
внутренней таблицы размер задан 100 пикселов, то у внешней не может быть
размера меньше 100 пикселов + толщина рамки. Таким образом, вложенная таблица
как бы "распирает" ту, в которую она вложена. При этом даже если у
нее не задан размер, а количество текста в ней значительно, она будет распирать
"старшую" таблицу на такой размер, который необходим для отображения
соответствующего количества строк текста. Это называется "обратная
связь".
Теги, не
нуждающиеся в закрытии. Это теги переноса – <br>, принудительно перекидывающие
все, что располагается после них, в новую строку. Благодаря этому тегу можно
писать стихи столбиками.
Вот такая
строчка:
текст текст текст текст <br> текст
текст текст <br> текст текст текст
При просмотре ее
из браузера выдаст вам столбик -
текст текст текст
текст текст текст
текст текст текст
Тег этот может
располагаться в коде как в середине текста (пример выше), так и заканчивать
строку:
текст текст текст <br>
текст текст текст
Или же разделять
строки:
текст текст текст
<br>
текст текст текст
Браузеру не
важно положение тега – все отступы и "сдвиги" нужны только для упрощения
понимания и ориентирования в коде. Конечно, количество пробелов внутри кода
увеличивает размер HTML-странички, поэтому злоупотреблять ими не стоит. Но
оттого, что вы выделите, какие-либо теги определенным образом, хуже не станет.
Все пробелы больше одного браузеры просто "не замечают". То есть,
сколько ни ставьте вы пробелов в тексте, браузер отобразит все равно с одним
пробелом:
в коде написано:
текст текст
браузер покажет:
текст текст
Впрочем, если
"ну очень хочется", то пробелов можно наставить принудительно. Делается
это размещением в коде "; " (разумеется, без кавычек!).
;  –
обозначение пробела, неразрывного пробела. То есть в этом месте будет пустое
пространство. Но если простой текст с пробелами браузер может перенести на другую
строку на месте любого пробела, то слова, разделенные ; , он воспримет
как единое целое. Вот потому не стоит злоупотреблять "гибкостью" и
слишком часто использовать обозначение ; . Не стоит использовать его и
для "выравнивания" текста внутри таблицы. Для этого есть более
простые и правильные способы. Не рекомендую употреблять ;  больше
двух-трех раз подряд. Можете считать это правилом, поскольку при большем
количестве символов наверняка проще прописать требуемое выравнивание в тег
нужного элемента. Это будет и проще, и нагляднее, и "чище", в плане
того, что ваши тексты не будут чересчур тяжелыми и долго грузящимися.
1.3.2. Основные
метки
Если мы возьмем
блокнот и откроем им любой файл .htm, внутри мы увидим примерно следующее:
<!DOCTYPE
HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head><title>Заголовок
- то, что будет видно в названии окна браузера</title>
<meta
http-equiv="Content-Type" content="text/html;
charset=windows-1251">
<link
href="путь до файла
.css" rel="stylesheet" type="text/css">
</head>
<body
bgcolor="#FFFFFF" leftmargin="0" topmargin="0"
marginwidth="0" marginheight="0">
это начало более или менее стандартно
для любого файла .htm .html и т.п.
Рассмотрим назначение обязательных
тегов:
<!DOCTYPE
HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> – обозначает
тип документа и формат. Облегчает распознавание другими программами этого
файла. Указывает в начале версию стандарта HTML и язык документа. Рекомендуется
оставлять без изменений или заменить //EN на //RU
<html>…</html>
– эти метки являются первым и последним тегом, который вам придется писать при
создании web-страницы. Метка
<html> должна открывать HTML-документ. Аналогично, метка </html>
должна завершать HTML-документ.
<head>…</head>
– эта пара указывает на начало и конец заголовка. Содержит информацию,
описывающую документ в целом.
<title>…</title>
– все, что находиться между этими метками, толкуется браузером, как название
документа. Internet Explorer, например,
показывает название текущего документа в заголовке окна и печатает его в левом
верхнем углу каждой страницы при выводе ее на принтер. Рекомендуется название
не длиннее 64 символов.
<meta
http-equiv="Содержимое-Тип" content="text/html;
charset=windows-1251"> – тут указываются служебные фичи, вам это
понимать не обязательно, за исключением последнего – "windows-1251" –
это есть указание, в какой кодировке отображать пагу. Рекомендую ставить это
самое 1251, тогда Windows'у видна вполне нормальным читаемым текстом, а не
абракадаброй. Это не трогать, просто запомнить и все.
<body>…</body>
– эта пара меток указывает на начало и конец тела HTML-документа.
Тело, собственно, определяет содержимое документа. Сюда можно вписать, что угодно. Собственно, это то, что вы
хотите показать посетителю.
1.3.3 Шрифты, размеры, списки
Шрифт – это таблицы замены кода видимым изображением.
То есть, собственно шрифтом. Каждая клавиша вашей клавиатуры дает определенный
код, распознаваемый ОС (операционной системой, в большинстве случаев это
Windows или Linux/Unix).
Таким образом, выбрав определенный шрифт, система
заменяет полученный с клавиатуры код на сопоставленное в таблице символов
шрифта изображение буквы или значка. Каждый шрифт – это файл. Файл, содержащий
изображения букв, цифр и символов, назначаемых на каждую кнопку. Установить
шрифт – означает включить в систему файл с дополнительными таблицами сопоставления.
В системах MS Windows обычно используется несколько шрифтов, поставляемых вместе
с системой – это:
Arial Ариал
Courier New Курьер Нью
Comic
Sans Комик Санс
Times New Roman Таймс Нью Роман
Verdana
Вердана
Каждый из этих шрифтов уместен в своем дизайне и
стиле. Наиболее распространен – Ариал. Каждый шрифт – это самостоятельный файл
в папке Windows/fonts/ *.ttf
Поэтому, если вы имеете какой-либо нестандартный шрифт
и хотите его использовать, вам придется:
а) доставить этот файл пользователю, что, учитывая вес
файла в 150-300 кб, не пятисекундная задача, либо
б) ограничиться имеющимися, заменив остальное лишь
графикой, то есть, картинками
Как в HTML придать шрифту тот или иной вид?
Тег, назначающий шрифт – <font>содержимое
тега - то, на что повлияют параметры тега</font>
Обращу ваше внимание на то, что вставляются все
параметры именно в начало тега, а не в конец. В замыкающий тег вообще ничего
никогда не вставляется.
Итак:
размер шрифта - <font size="число от 1 до
6">
текст размера 6
текст размера 5
текст размера 4
текст размера 3
текст размера 2
текст размера 1
В дизайне обычно используются первые четыре размера.
Все, что выше, дурной тон и признак дилетантства, ибо занимает слишком много
места, трудно читается и вообще некрасиво. Правда, и большим размерам найдется
применение. Например, шестым размером можно писать буквицу (первую букву начала
главы):
Текст
текст текст текст текст текст текст текст текст текст текст текст текст текст
текст текст текст текст текст текст текст текст текст текст.
Если правильно подобрать размеры, смотрится вполне приятно.
Кроме прочего, мы можем выбрать и сам шрифт,
используемый для отображения текста. Делается это тегом face="название
шрифта" (пример: face="Comic Sans MS")
Эти два тега – размер и вид шрифта, – можно
расположить в любой последовательности в теге <font> – что
<font size="1"
face="Comic Sans MS">текст</font> что
<font face="Comic Sans MS"
size="1">текст</font>
Главное тут следить, чтобы задаваемые параметры (в
данном случае это имя шрифта и его размер) были выделены кавычками и находились
внутри тега <font> межу font и >
Теперь, для лучшего понимания таких терминов, как
"контейнер", "вложенный тег" и "наследование",
рассмотрим ниже следующий пример:
<font face="Название шрифта"
size="1">
<i>
< font size="4">Заголовок
</font>
текст, текст, текст, текст, текст, текст, текст,
текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст,
текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст,
текст, текст
</i>
< font size="4">Заголовок </font>
текст, текст, текст, текст, текст, текст, текст,
текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст,
текст, текст, текст, текст, текст, текст, текст, текст, текст,
текст, текст, текст, текст
</font>
Как видим из примера, вовсе необязательно каждый раз
писать цвет, размер и имя шрифта. Все эти параметры "наследуются"
младшими тегами, то есть теми, что вложены в другие.
Затем задана наклонность шрифта тегом
<i>…</i>. Контейнер этого тега включает в себя и заголовок (размер
4) и текст.
Так же в работе с текстом помогает и тег, обозначающий
абзацы – это <p>…</p> – все, помещенное в них, отделяется сверху и
снизу пробелом и может иметь собственные параметры абзаца, прописываемые прямо
в теге – <p align="center">текст</p>.
Шрифт так же может быть наклонный, выделенный, и
жирный наклонный. Достигается это тегами:
<i>текст</i>
<b>текст</b>
и их сочетанием – <b><i> текст
</i></b>
Сочетание вида – <b><i>
текст</b></i> в большинстве браузеров вызовет ошибку, в результате
которой ваша страничка может криво отобразиться или не отобразиться вообще:
зависит от устойчивости браузера. Советую писать правильно.
Собственно, вот полный список таких тегов и, заодно,
как это выглядит в браузере:
<b>жирный шрифт</b>
<strong>жирный шрифт</strong> - (аналог
<b></b>)
<i>наклонный шрифт</i> - (курсив)
<em>наклонный шрифт</em> - (аналог
<i></i>)
<u>подчёркнутый шрифт</u>
<s>перечёркнутый шрифт</s>
<strike>перечёркнутый шрифт</strike> (аналог
<s></s>)
<big>текст
отображается больше, чем основной шрифт</big>
<small>текст
отображается меньше, чем основной шрифт</small>
<sub>нижний индекс</sub> и
<sup>верхний индекс</sup>
<code>текст отображается как код или формула (чаще всего
как шрифт Courier)</code>
<tt>текст отображается моноширинным шрифтом (чаще всего
шрифт Courier)</tt>
<kbd>текст отображается моноширинным жирным шрифтом</kbd>
<var>отображение переменных (как правило -
курсив)</var>
<cite>отображение цитат (как правило -
курсив)</cite>
<address>так обозначается адрес (как правило,
курсив) </address>
<blockquote>
Этот тег смещает весь абзац (заключенный в нее текст)
на энный отступ слева.
</blockquote>
Попробуйте использовать и такое:
<blockquote><blockquote>
текст, текст, текст, текст, текст, текст, текст,
текст, текст, текст, текст, текст, текст, текст, текст, текст, текст, текст..
</blockquote></blockquote>
И собственно, тег <br> закрытия не
требует.
Это просто переход к следующей строке, чтобы,
например, писать стихи в столбик:
Тщетны надежды и усилья,
Гранит науки покусать,
Не те уж зубы, руки, крылья,
Ну что ж... тогда хоть полизать...
Кроме прочего, стоило бы упомянуть такие теги, как
<H1></H1>, но, будучи вставлены в текст, "по умолчанию"
они непоправимо изуродуют дизайн. Многие поисковики положительно воспринимают
заголовки, прописанные в этом теге. Причем, чем меньше цифра тега, тем выше
"приоритет" этого заголовка. Всего их 6, с H1 по H6. H6 самый мелкий
и более или менее вписывается в дизайн, а вот H1 норовит растянуться в очень
большие величины – вот такими буквами. Но что же делать? Ведь для увеличения находимости
нам нужен этот тег! При всей его неудобоваримости и нежелании вписываться в
дизайн он приносит неплохое количество "очков" пользы перед поисковиками.
Списки
Вместо того, чтобы нумеровать все вручную, вместо
запарок с выделениями разного рода и калибра, намного проще воспользоваться малоизвестными,
но поддерживаемыми всеми, тегами <UL> и <LI>, как это выглядит:
·
строка 1
·
строка 2
·
строка 3
Код:
<ul>
<LI>строка 1
<LI>строка 2
<LI>строка 3
</ul>
списки могут быть и вложенными, как это выглядит:
·
тема 1
1.
подтема 1
2.
подтема 2
10. подподтема
3. подтема 3
·
тема 2
Код:
<UL>
<LI>тема 1
<OL>
<LI>подтема 1
<LI> подтема 2
<OL start="10">
<LI> подподтема
</OL>
<LI> подтема 3
</OL>
<LI>тема 2
</UL>
Какой тег что означает?
UL - начало списка, /UL - закрытие списка
LI – тег, означающий строку списка. Если величина не
задана (параметром value="число"), то по умолчанию имеет вид точки,
если задано число – отсчитывает, прибавляя в начало каждой новой строчки, следующее число к заданному.
OL – тег начала нумерованного списка. Может принимать
значение не с единицы, а с заданной величины: делается введением параметра
start="число, с которого начать отсчет"
Декорировать списки можно разными значками. Делается
это при помощи параметра type:
как это выглядит: Код:
·
тема 1 <UL>
o
тема 3 <UL
type="circle">
§
тема 4 <UL
type="square">
·
тема 5 <UL
type="disc">
(собственно, этот параметр ставится
"По-умолчанию")
i.
тема 1 <OL
type="i" >
ii.
тема 2 римские
малые
iii.
тема 3
I.
тема 1 <OL
type="I" >
II.
тема 2 римские
заглавные
III.
тема 3
a.
тема 1 <OL
type="a" >
b.
тема 2 английские
малые
c.
тема 3
A.
тема 1 <OL
type="A" >
B.
тема 2 английские
заглавные
C.
тема 3
1.
тема 1 <OL
type="1" >
2.
тема 2 арабские
цифры
3.
тема 3
Но вышеописанные премудрости с точками, кружочками и
квадратиками сработают и если просто установить тег в двойном экземпляре – то
есть <ul><ul><li> содержимое
</ul></ul></li> тогда вместо точки отобразится кружок. А если
<ul> написать три раза, то квадратик.
1.3.4.
Создание гиперссылок
Гиперссылки, они же URL. <a href="адрес"> наименование линка</a>
– так выглядит обыкновенная ссылка в коде. А в браузере мы увидим то, что находится
в контейнере тега, то есть в нашем случае это – "наименование линка".
Иногда очень удобно бывает, чтобы ссылка открылась в
новом окне, а та страничка, с которой мы пошли, осталась неизменной и никуда не
пропала:
<a href="адрес" target="_blank"> открыть в новом
окне </a>
target="_blank" оно пишется через пробел после
href="URL" и закрывается символом «>». Ссылки могут быть также
"прилеплены" и на картинки, то есть, срабатывать при наведении/нажатии
курсора на картинку. Например, <a href="адрес"><img src=”картинка.jpg”>
</a>. Здесь при нажатии на
картинку мы переходим на новую страничку.
1.3.5. Цвета в HTML
Цветовая гамма в
HTML-документе определяют различными атрибутами, основные из которых размещены
внутри метки <body>. Вот их список:
Bgcolor – определяет
цвет фона документа
Vlink – определение
цвета ссылки на документ, который уже был просмотрен ранее
Alink – определение
цвета ссылки в момент, когда на нее указывается курсор мыши и нажата ее правая
кнопка, т.е. непосредственно перед переходом по ссылке.
Пример:
<body bgcolor=”black” vlink=”yellow” alink=”red”>
Тег, задающий
цвет: color=”#FF0000”
Пример: <font
fase=”Comic Sans MS” size=”1” color=”FF0000”>текст</font>
Принцип
обозначения цвета
Цвет можно
задать двумя способами:
а) цифрами, что
будет более точным по оттенкам;
б) английским
словом
способ А. Ставим
#, после чего пишем цифры. Первые две цифры – это насыщенность красным. Вторые
две – насыщенность зеленым. Третьи две – это насыщенность синим цветом.
Почему именно три параметра? Потому что это не что иное, как способ
получения цвета в телевизоре – RGB (Red Green Blue). Ведь изображение в обычном
ЭЛТ мониторе формируется по принципу высвечивания трех точек заданных цветов:
чем ярче точка, тем больше этого цвета в нашем "пикселе" (пиксель –
"точка"). Цифры задавать по 16-ричной системе, т.е. не от 0 до 10, а
от 0 до FF.
0,1,2,3,4,5,6,7,8,9,0А,0B,0C,0D,0E,0F
– это и есть 16-ричный счет. И именно в пределах
этого и можно задавать каждому сегменту свой цвет. То есть минимально это может
быть 00 00 00, что соответствует черному, максимально – это будет FF FF FF, что
соответствует белому. Все промежуточные комбинации – это уже оттенки. Например,
красный цвет – это FF 00 00, зеленый - это 00 FF 00, синий - 00 00 FF.
способ Б. Для
упрощения набора основных цветов в стандарте HTML было позволено замещать
цифирный ряд обычным словом, обозначающим тот или иной цвет в английском языке.
Например, слово написание color=black окрасит выделенное тегом в черный цвет,
green – в зеленый, white – в белый и т.п.
1.3.6. Вставка
графического изображения
Картинки
вставляются тегом <img src="/путь к картинке/название картинки. расширение
картинки">. Тег этот не "контейнерный", посему в закрывающей
части не нуждается. Располагая этот тег внутри классической гиперссылки, мы
можем добиться, чтобы при тычке по картинке осуществлялся переход по ссылке:
<a href="куда переходим при нажатии"> <img
src="картинка.jpg" width="ширина картинки (необязательно)"
height="высота картинки (необязательно)" hspace="7"
vspace="7" border="1" align="left"></a>
То есть картинка – не что иное, как обычная ссылка, в которую вставляется код с
адресом и параметрами картинки.
Все
задействованные в коде теги вам уже без сомнения встречались в предыдущих
главах, за исключением разве что hspace и vspace – эти два тега тоже не
являются обязательными, но при их наличии вокруг картинки образуется отступ в
соответствующее количество пикселей от текста. Согласитесь, это намного проще,
чем вымучивать эти пробелы при помощи таблиц, пробелов и слоев или же вообще
лепить текст впритык к картинке... Вокруг картинки при помощи border="1"
можно соорудить элегантную рамочку, а при необходимости изменить размеры
отображения картинки при помощи все тех же width и height – если указать в них
меньшие размеры, чем реально у картинки, можно вписать ее в любой практически
дизайн. Зачем это нужно? Почему бы не обрезать картинку графическим редактором
– что намного более практично?!
Рассмотрим
минусы занижения размеров картинки при помощи HTML:
-
Картинка
сохраняет свои реальные размеры и, соответственно, вес - даже если вы сделаете
громадную картинку в мегабайт весом, размерами с почтовую марку, грузиться она
будет всеми своими мегабайтами;
-
Картинка
потеряет много деталей, что в некоторых случаях превращает ее в нечто не
понятное.
Теперь плюсы
занижения размеров:
-
картинку
можно вписать в дизайн, пожертвовав парой сантиметров, а при копировании ее на
винт она сохранит свои размеры. Это нужно в редких случаях, когда вы
вывешиваете картинку размерами большими, чем разрешающая способность монитора посетителя.
И картинку в дизайн впишем, и сохранится она на все 2040, на сколько там положено.
1.3.7. Фоновые
изображения в HTML
Фон, это та же
картинка, только загнанная под текст и другие картинки. Фон нельзя выделить
мышкой, в отличие от картинок, выделяемых вместе с текстом. В этом одновременно
его преимущество и недостаток – в некоторых случаях. Фон простирается в пределах
тега таблицы или же всей странички, если указан в теге <body>: <body background= «/картинка
фона. Расширение»>. Первое, конечно, предпочтительнее. Прописываем фон в
пределах таблицы: <td background= «/картинка фона. Расширение»> – фоном
может быть любая картинка. Не стоит делать фон слишком ляписным и ярким, – это
затрудняет прочтение информации, изложенной на web-страничке!
1.3.8. Спецсимволы в HTML
Спецификация HTML предусматривает
набор кодов, соответствующих специальным символам, которые можно включить в
текст web-страницы. Вам
придется воспользоваться многими необычными символами, например, математические
обозначения, которые нельзя ввести с клавиатуры напрямую. При необходимости
вставки специального символа, вы должны указать его числовой или мнемонический
код. Числовой код состоит из знаков амперсанда (&), фунта (#), номера
символа и точки с запятой (;). Мнемонический код включает в себя
знак амперсанда, наименование символа и точку с запятой. Средства
вставки специальных символов полезны, в частности, в тех ситуациях, когда
необходимо использовать в тексте один из "служебных" знаков,
применяемых при проектировании web-страниц, – скажем <, > или &
– которые браузер обрабатывает специальным образом. Пример:
< - < > -
> & - & λ - λ
§ - § ¨ - ¨ ¬
- ± ∑ - ∐
© - © ® - ® ²
- ² ¼ - ¼
« - « » - » ³
- ³ ½ - ½
´ - ´ µ - µ ¶
- ¶ ¾ - ¾
≠ - ≠ ≡ - ≡ ≤
- ≤ ≥ - ≥
Σ - Σ Φ - Φ Ψ
- Ψ Ω - Ω
α - α β - β δ
- δ ζ - ζ
ġ - ġ Ģ - Ģ ģ
- ģ Ĥ - Ĥ
ĵ - ĵ Ķ - Ķ ķ
- ķ ĸ - ĸ
1.3.9. Построение таблиц
Таблицы в HTML
являются одним из самых необходимых элементов и самыми универсальными
средствами форматирования картинок и текста. Итак, код простейшей таблицы 2х2
ячейки:
<table width="200" border="1"
cellspacing="0" cellpadding="0">
Начало таблицы содержит:
width – ширина (у нас 200 пикселей),
border – толщина каемки/бордюра нашей таблицы (у нас 1 пиксель)
cellspasing – расстояние между ячейками,
cellspadding – отступ от границ ячейки внутри нее.
Остальной код:
|
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>4</td>
</tr>
</table>
|
тег
открытия строки
тег ячейки 1
тег ячейки 2
конец строки
начало второй строки
тег ячейки 3
тег ячейки 4
конец второй строки
конец таблицы
|
Вот такая вот табличка:
добавив в код сегмент:
<tr>
<td>3</td>
<td>4</td>
</tr>
мы получим третью строку с двумя столбиками.
Количество
ячеек может располагаться и по-другому – например, так:
|
<table width="200" border="1"
cellpadding="0" cellspacing="0">
<tr>
<td rowspan="2">1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
</tr>
<tr align="center">
<td>4</td>
<td>5</td>
</tr>
</table>
|
Выделение жирным в коде соответствует
закрашенным серым цветом в таблице.Все отличие такого построения таблиц
заключается в появлении параметра rowspan="2", цифра в котором
соответствует количеству "подстрок", т.е. буквально то, сколько строк
слилось в этой ячейке:
|
|
<table width="200" border="1"
cellpadding="0" cellspacing="0">
<tr>
<td>1</td>
<td rowspan="2">3</td>
</tr>
<tr>
<td>2</td>
<tr align="center">
<td>4</td>
<td>5</td>
</tr>
</table>
|
Если в симметричной таблице мы читаем
слева–направо, то тут происходит то же самое, только почему же в коде впереди двойки
стоит ячейка с цифрой 3? Все очень просто – буквально код расшифровывается, как
"ячейка 1", "ячейка 3, состоящая из ДВУХ подстрок", ячейка
2, второй строки. Но физически ячейка 3 принадлежит к ПЕРВОЙ строке! Ведь HTML
читается именно построчно слева–направо. А что будет, если поставить после 3-ки
еще такую же ячейку? 3b например?
|
|
<table width="200" border="1"
cellpadding="0" cellspacing="0">
<tr>
<td>1</td>
<td
rowspan="2">3</td>
<td
rowspan="2">3b</td>
</tr>
<tr>
<td>2</td>
<tr align="center">
<td>4</td>
<td>5</td>
</tr>
</table>
|
В той ячейке тоже достаточно прописать rowspan="2".
А что, если в правой колонке нам надо три ячейки?
|
|
<table width="200" border="1"
cellpadding="0" cellspacing="0">
<tr>
<td>1</td>
<td
rowspan="3">3</td>
<td>3b</td>
</tr>
<tr>
<td
rowspan="2">2</td>
<td>3c</td>
</tr>
<tr>
<td>3d</td>
</tr>
</table>
|
Читаем код: Ячейка 1 (обычная) >
ячейка 3 (состоит из трех слитых воедино строк) > ячейка 3b (тоже обычная);
тут у нас начинается вторая строка. Начинается она с ячейки №2, обозначаемой
как "ячейка, состоящая из двух строк, т.е. слитых по вертикали
ячеек", а ячейки 3с и 3d – совершенно обычные ячейки. Для упрощения
понимания строки в таблице на примере обозначены разными тонами, т.е. каждый
тон соответствует строке. Это немного сложно осознать с наскока, но это весьма
важно – понимать очередность считывания и принцип построения, так что
напрягитесь и постарайтесь. Если же у нас наличествуют ячейки, совмещенные по
горизонтали, то вместо тега rowspan используется тег colspan, естественно, в
той ячейке, которая занимает площадь нескольких.
Так же следует отдельно запомнить, что
параметры, вставляемые в тег открытия строки (<tr>) IE не
воспринимаются!!! Поэтому назначать теги будем только самим ячейкам или всей
таблице сразу. Рассмотрим, как задаются размеры таблиц. Мы можем задать ширину
всей таблицы в целом единой цифрой. Это может быть, как 100% (т.е. от края до
края доступного пространства), так и четкая ширина в пикселях (на примере -
200):
|
В коде это пишется так:
<table width="200" border="1" cellpadding="0"
cellspacing="0">
|
Или так:
<table width="100%" border="1" cellpadding="0"
cellspacing="0">
|
По умолчанию (т.е.
если в значении ширины после цифры не идет знак процента (%), число, указанное
в кавычках, будет расцениваться как пиксели. Главное отличие в том, что если
размер указан жестко, в пикселях, то при сужении окна таблица
"упрется" краями в тег, в который она вложена и не даст ему
«сузиться», если тот имеет ширину, заданную относительно, т.е. в процентах от
доступной ширины. Для большей наглядности рассмотрите пример: ширину
мы задаем, вставляя в тег начала таблицы параметр width="число ширины
(можно в процентах)", так же можно задать и вертикальный размер – height="число
ширины (только в пикселях!)"
Имейте в виду, что сужаемая таблица растягивается по
вертикали. И этим надо пользоваться. Не нужно пытаться подогнать текст под
жестко-фиксированную таблицу. В таблице есть несколько видов выравнивания
содержимого относительно краев таблиц:
|
align="left"
|
align="middle"
|
align="right"
|
|
valign="top"
|
valign="middle"
align="center"
|
valign="bottom"
align="right"
|
В каждой ячейке указан тип примененного в ней
выравнивания, но кроме них существует еще и параметр justify. Это выравнивание
по ширине с обоих краев.
При помощи таблиц можно осуществить самый замысловатый
дизайн, расположить содержимое практически как угодно. Вот пример типичной
организации сайта:
Как видим – таблицы позволяют сделать практически
любой эффект, кроме наложения – в этом у слоев большое преимущество, но о них
позже... Собственно, про таблицы на этом не заканчивается, просто остальные
области относятся скорее к манипуляциям стилями и слоями. Но напоследок уточним
все параметры, какими можно манипулировать в таблицах: выравнивание: width и height
– пишутся последовательно или одиночно. Транскрипция примерно <td
width="число" height="число"> </td>. Параметры
задаются целым числом, либо же целым числом с %, т.е. ="100%" –
выровнять по ширине от стенки до стенки.
|
|
<table
width="100" border="0" height="100"
cellspacing="4" cellpadding="0"
bgcolor="#999999">
<tr bgcolor="#CCCCCC">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#CCCCCC">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#CCCCCC">
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
|
или вот так:
|
|
<table
width="100" border="0" height="100"
cellspacing="4" cellpadding="0" bgcolor="#999999">
<tr bgcolor="#CCCCCC">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#CCCCCC">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#CCCCCC">
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
|
Теперь уточним значение использованных тегов: bgcolor="код
из шести цифр вида #000000" – задает фон ячейке, либо таблице – в
зависимости, куда вставлен этот параметр. bordercolor="#FFFFFF" –
цвет бордюра (рамки).
Ну и про манипуляции с cellspacing и cellpadding не забываем, поварьируйте их размеры.
При помощи таблиц можно даже рисовать – например,
закругленные уголки. Вот как это выглядит в сильно увеличенном варианте:
Такой способ куда экономичнее, чем подставление
картинок – ведь всяко меньшее количество кода HTML, чем в самой маленькой
картинке.
2. РУКОВОДСТВО
ПО ИСПОЛЬЗОВАНИЮ ЭЛЕКТРОННОГО УЧЕБНИКА
Для работы с
электронным учебником необходимо на рабочем столе подвести указатель мыши на
папку «Электронный учебник» и
нажать левой кнопкой мыши. Затем в папке выбрать файл «Электронный
учебник.html» после чего
откроется обложка учебника (См. рис. 2.1):
Рис
2.1.
Обложка
электронного учебника.
Сверху находится
строка «Начать изучение материала» с помощью нажатия левой кнопки мыши откроется
окно меню. Где можно выбрать в строке нужный раздел также нажатием левой кнопки
мыши откроется окно содержание. В котором можно выбрать любую главу нажатием
правой кнопки мыши. При ознакомлении всего электронного учебника следует
закрыть все файлы и
папки.
СПИСОК
ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ
1. Крамер Э. «HTML наглядный
курс WEB-дизайна» Учеб. Пос. – М.: «Вильямс»; 2001г.
2. Попов А. А. «Программирование» – Москва:
«Мир»,1993г.
3. Шульгин Л. Л. «Задачи по программированию. Часть I.
Базовые понятия» – Караганда: «Экоцентр», 1998г.
4. «Справочное пособие по работе с программами для
распознавания текста» – Москва: «Компьютер пресс», 2004г.
5. Симонович С. «Новейший самоучитель работы на
компьютере» – Москва: «ДЕСС КОММ», 2004г.
6. Симонович С.
В. и др. Информатика Базовый курс. - СПб.: 2002.- 640 с.
7. Микшена В.С.,
Еремеева Г.А., Назина Н.Б. и др.; Под ред. Острейковского В.А. Лабораторный
практикум по информатике: учебное пособие для вузов – М.: Высш. Шк., 2003.-376
с.
8. Айтхожаева Е. Ж.. Пользовательские интерфейсы
программных систем – Алматы: Республиканский издательский кабинет, «Каз
ПТИ»,1997г. 87с.
9. Леонтьев Б., Web-дизайн
Тонкости, хитрости и секреты. – М.: Высш. Шк, 1999. – 192с.
10. Навакатикян А. О., Кальцин В. В.. Охрана труда
пользователей компьютерных терминов. – Киев: УГНЦ, 1997г. – 150с.
ПРИЛОЖЕНИЕ
Электронный
учебник Тема: «Проектирование штампов и оснастки».
Рис.П.1. Обложка
электронного учебника.
Титульный лист в
HTML-коде:
<html
xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office"
xmlns:w="urn:schemas-microsoft-com:office:word"
xmlns="#"1.files/image029.gif"> {mso-style-parent:"";
margin:0cm;
margin-bottom:.0001pt;
mso-pagination:widow-orphan;
font-size:12.0pt;
font-family:"Times
New Roman";
mso-fareast-font-family:"Times
New Roman";}
h3
{mso-margin-top-alt:auto;
margin-right:0cm;
mso-margin-bottom-alt:auto;
margin-left:0cm;
mso-pagination:widow-orphan;
mso-outline-level:3;
font-size:13.5pt;
font-family:"Times
New Roman";
font-weight:bold;}
a:link,
span.MsoHyperlink
{mso-ansi-font-size:9.0pt;
mso-bidi-font-size:9.0pt;
font-family:Arial;
mso-ascii-font-family:Arial;
mso-hansi-font-family:Arial;
mso-bidi-font-family:Arial;
color:blue;
mso-text-animation:none;
font-style:normal;
text-decoration:none;
text-underline:none;
text-decoration:none;
text-line-through:none;}
a:visited,
span.MsoHyperlinkFollowed
{mso-ansi-font-size:9.0pt;
mso-bidi-font-size:9.0pt;
font-family:Arial;
mso-ascii-font-family:Arial;
mso-hansi-font-family:Arial;
mso-bidi-font-family:Arial;
color:blue;
mso-text-animation:none;
font-style:normal;
text-decoration:none;
text-underline:none;
text-decoration:none;
text-line-through:none;}
p
{mso-margin-top-alt:auto;
margin-right:0cm;
mso-margin-bottom-alt:auto;
margin-left:0cm;
mso-pagination:widow-orphan;
font-size:12.0pt;
font-family:"Times
New Roman";
mso-fareast-font-family:"Times
New Roman";}
p.bodytext,
li.bodytext, div.bodytext
{mso-style-name:bodytext;
mso-margin-top-alt:auto;
margin-right:0cm;
mso-margin-bottom-alt:auto;
margin-left:0cm;
mso-pagination:widow-orphan;
font-size:12.0pt;
font-family:"Times
New Roman";
mso-fareast-font-family:"Times
New Roman";}
p.menu,
li.menu, div.menu
{mso-style-name:menu;
mso-margin-top-alt:auto;
margin-right:0cm;
mso-margin-bottom-alt:auto;
margin-left:0cm;
mso-pagination:widow-orphan;
font-size:12.0pt;
font-family:"Times
New Roman";
mso-fareast-font-family:"Times
New Roman";}
p.normal,
li.normal, div.normal
{mso-style-name:normal;
mso-margin-top-alt:auto;
margin-right:0cm;
mso-margin-bottom-alt:auto;
margin-left:0cm;
mso-pagination:widow-orphan;
font-size:12.0pt;
font-family:"Times
New Roman";
mso-fareast-font-family:"Times
New Roman";}
span.GramE
{mso-style-name:"";
mso-gram-e:yes;}
@page
Section1
{size:595.3pt
841.9pt;
margin:2.0cm
42.5pt 2.0cm 3.0cm;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;}
div.Section1
{page:Section1;}
-->
</style>
<!--[if
gte mso 10]>
<style>
/*
Style Definitions */
table.MsoNormalTable
{mso-style-name:"Обычная таблица";
mso-tstyle-rowband-size:0;
mso-tstyle-colband-size:0;
mso-style-noshow:yes;
mso-style-parent:"";
mso-padding-alt:0cm
5.4pt 0cm 5.4pt;
mso-para-margin:0cm;
mso-para-margin-bottom:.0001pt;
mso-pagination:widow-orphan;
font-size:10.0pt;
font-family:"Times
New Roman";
mso-ansi-language:#0400;
mso-fareast-language:#0400;
mso-bidi-language:#0400;}
</style>
<![endif]-->
<meta
content="Центр дистанционного образования"
name=description>
<meta
content="Электронные учебники"
name=keywords>
<!--[if
gte mso 9]><xml>
<o:shapedefaults
v:ext="edit" spidmax="4098"/>
</xml><![endif]--><!--[if
gte mso 9]><xml>
<o:shapelayout
v:ext="edit">
<o:idmap
v:ext="edit" data="1"/>
</o:shapelayout></xml><![endif]-->
</head>
<body
bgcolor="#CCCCFF" background="Электронный%20учебник.files/image001.jpg"
lang=RU link=blue vlink=blue>
<!--[if
gte mso 9]><xml>
<v:background
id="_x0000_s1025" o:bwmode="white"
fillcolor="#ccf">
<v:fill
src="Электронный%20учебник.files/image001.jpg"
o:title="Букет"
type="tile"/>
</v:background></xml><![endif]-->
<div>
<div
align=center>
<table>
>
<tr>
<td>
<p>
height=1 id="_x0000_i1025"
src="%20"><o:p></o:p></span></p>
</td>
</tr>
<tr>
<td>
<p>
height=1 id="_x0000_i1026" src="Электронный%20учебник.files/trans.gif"><o:p></o:p></span></p>
</td>
</tr>
</table>
</div>
<p>
<div
align=center>
<table>
>
<tr>
<td>
<p align=center>
color:white'>Электронный учебник<o:p></o:p></span></p>
</td>
</tr>
</table>
</div>
<p>
<div
align=center>
<table>
>
<tr>
<td>
<p>
height=1 id="_x0000_i1027" src="Электронный%20учебник.files/trans.gif"><o:p></o:p></span></p>
</td>
</tr>
<tr>
<td>
<p>
height=1 id="_x0000_i1028" src="Электронный%20учебник.files/trans.gif"><o:p></o:p></span></p>
</td>
</tr>
</table>
</div>
<p>
<!-- Конец
верхней строки заголовка --><!-- Рекламная строка с cсылками на WEB
страничку cde.kstu.kz -->
<p>
<!-- Конец
рекламной строки --><!-- Полоса ссылок на основные разделы электронного
учебника -->
<div
align=center>
<table>
>
<tr>
<td>
<p
align=center>
font-family:Arial;color:white'>Проектирование штампов и оснастки<o:p></o:p></span></p>
</td>
</tr>
<tr>
<td>
<p><span>
id="_x0000_i1029" src="Электронный%20учебник.files/trans.gif"><o:p></o:p></span></p>
</td>
</tr>
</table>
</div>
<p>
<div
align=center>
<table>
>
<tr>
<td>
<p
align=center>
color:white'>..:: | <a href="../Index/Menu.htm"><span>
color:white'>НАЧАТЬ ИЗУЧЕНИЕ МАТЕРИАЛА</span></a><span>
</td>
</tr>
</table>
</div>
<p>
<div
align=center>
<table>
>
0cm
0cm 0cm 0cm'>
<tr>
<td
width="100%">
<p>
width=1 height=1 id="_x0000_i1030" src="Электронный%20учебник.files/trans.gif"><o:p></o:p></span></p>
</td>
</tr>
<tr>
<td
width="100%">
<p>
width=1 height=1 id="_x0000_i1031" src="Электронный%20учебник.files/trans.gif"><o:p></o:p></span></p>
</td>
</tr>
</table>
</div>
<table>
width="98%">
margin-left:6.75pt;mso-table-rspace:9.0pt;margin-right:6.75pt;mso-table-anchor-vertical:
paragraph;mso-table-anchor-horizontal:margin;mso-table-left:left;mso-table-top:
251.3pt;mso-padding-alt:0cm 0cm 0cm
0cm'>
<tr>
<td
width="99%">
<h3
align=center>
9.0pt;mso-element-wrap:around;mso-element-anchor-vertical:paragraph;
mso-element-anchor-horizontal:margin;mso-element-top:251.3pt;mso-height-rule:
exactly'><span>
color:white;mso-ansi-language:EN-US'><!--[if gte vml
1]><v:shapetype id="_x0000_t75"
coordsize="21600,21600" o:spt="75"
o:preferrelative="t" path="m@4@5l@4@11@9@11@9@5xe"
filled="f" stroked="f">
<v:stroke joinstyle="miter"/>
<v:formulas>
<v:f
eqn="if lineDrawn pixelLineWidth 0"/>
<v:f
eqn="sum @0 1 0"/>
<v:f
eqn="sum 0 0 @1"/>
<v:f
eqn="prod @2 1 2"/>
<v:f
eqn="prod @3 21600 pixelWidth"/>
<v:f
eqn="prod @3 21600 pixelHeight"/>
<v:f
eqn="sum @0 0 1"/>
<v:f
eqn="prod @6 1 2"/>
<v:f
eqn="prod @7 21600 pixelWidth"/>
<v:f
eqn="sum @8 21600 0"/>
<v:f
eqn="prod @7 21600 pixelHeight"/>
<v:f
eqn="sum @10 21600 0"/>
</v:formulas>
<v:path
o:extrusionok="f" gradientshapeok="t"
o:connecttype="rect"/>
<o:lock
v:ext="edit" aspectratio="t"/>
</v:shapetype><v:shape id="_x0000_i1032"
type="#_x0000_t75">
height:309.75pt'>
<v:imagedata src="Электронный%20учебник.files/image002.gif"
o:title="image003"/>
</v:shape><![endif]--><![if !vml]><img border=0
height=413
src="Электронный%20учебник.files/image003.gif"
v:shapes="_x0000_i1032"><![endif]><o:p></o:p></span></h3>
</td>
</tr>
<tr>
<td width="99%">
<p>
mso-element-frame-hspace:9.0pt;mso-element-wrap:around;mso-element-anchor-vertical:
paragraph;mso-element-anchor-horizontal:margin;mso-element-top:251.3pt;
mso-height-rule:exactly'><span>
color:white;mso-ansi-language:EN-US'><o:p> </o:p></span></p>
</td>
</tr>
</table>
<p>
style='mso-ansi-language:EN-US'><o:p> </o:p></span></p>
<p>
style='mso-ansi-language:EN-US'><o:p> </o:p></span></p>
<p>
clear=all>
<o:p></o:p></span></p>
<p>
style='mso-ansi-language:EN-US'><o:p> </o:p></span></p>
<!-- Конец
полосы ссылок на основные разделы электронного учебника --></div>
</body>
</html>
Содержание:
Рис.П.2.
Содержание.
Содержание в HTML-коде:
<html
xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office"
xmlns:w="urn:schemas-microsoft-com:office:word"
xmlns="#"1.files/image040.gif"><title>СОДЕРЖАНИЕ</title>
<!--[if gte mso 9]><xml>
<w:WordDocument>
<w:Zoom>75</w:Zoom>
<w:ValidateAgainstSchemas/>
<w:SaveIfXMLInvalid>false</w:SaveIfXMLInvalid>
<w:IgnoreMixedContent>false</w:IgnoreMixedContent>
<w:AlwaysShowPlaceholderText>false</w:AlwaysShowPlaceholderText>
<w:BrowserLevel>MicrosoftInternetExplorer4</w:BrowserLevel>
</w:WordDocument>
</xml><![endif]--><!--[if gte mso
9]><xml>
<w:LatentStyles DefLockedState="false"
LatentStyleCount="156">
</w:LatentStyles>
</xml><![endif]-->
<style>
<!--
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{mso-style-parent:"";
margin:0cm;
margin-bottom:.0001pt;
mso-pagination:widow-orphan;
font-size:12.0pt;
font-family:"Times New Roman";
mso-fareast-font-family:"Times New
Roman";}
a:link, span.MsoHyperlink
{color:blue;
text-decoration:underline;
text-underline:single;}
a:visited, span.MsoHyperlinkFollowed
{color:purple;
text-decoration:underline;
text-underline:single;}
p
{mso-margin-top-alt:auto;
margin-right:0cm;
mso-margin-bottom-alt:auto;
margin-left:0cm;
mso-pagination:widow-orphan;
font-size:12.0pt;
font-family:"Times New Roman";
mso-fareast-font-family:"Times New
Roman";}
p.section1, li.section1, div.section1
{mso-style-name:section1;
mso-margin-top-alt:auto;
margin-right:0cm;
mso-margin-bottom-alt:auto;
margin-left:0cm;
text-align:justify;
mso-pagination:widow-orphan;
font-size:14.0pt;
font-family:"Times New Roman";
mso-fareast-font-family:"Times New
Roman";
mso-ansi-language:UK;}
@page Section1
{size:595.3pt 841.9pt;
margin:2.0cm 42.5pt 2.0cm 3.0cm;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;}
div.Section1
{page:Section1;}
-->
</style>
<!--[if gte mso 10]>
<style>
/* Style Definitions */
table.MsoNormalTable
{mso-style-name:"Обычная таблица";
mso-tstyle-rowband-size:0;
mso-tstyle-colband-size:0;
mso-style-noshow:yes;
mso-style-parent:"";
mso-padding-alt:0cm 5.4pt 0cm 5.4pt;
mso-para-margin:0cm;
mso-para-margin-bottom:.0001pt;
mso-pagination:widow-orphan;
font-size:10.0pt;
font-family:"Times New Roman";
mso-ansi-language:#0400;
mso-fareast-language:#0400;
mso-bidi-language:#0400;}
</style>
<![endif]-->
<meta name=Template content="C:\PROGRAM
FILES\MICROSOFT OFFICE\OFFICE\html.dot">
<!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit"
spidmax="4098"/>
</xml><![endif]--><!--[if
gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit"
data="1"/>
</o:shapelayout></xml><![endif]-->
</head>
<body bgcolor="#CCECFF"
background="Vved.files/image001.jpg"link=blue
vlink=purple>
<!--[if gte mso 9]><xml>
<v:background id="_x0000_s1025"
o:bwmode="white" fillcolor="#ccecff">
<v:fill src="Vved.files/image001.jpg"
o:title="Голубая тисненая бумага"
type="tile"/>
</v:background></xml><![endif]-->
<div>
<p align=center>
style='font-size:14.0pt;font-family:Arial;color:#333399'>СОДЕРЖАНИЕ<span
style='mso-bidi-font-weight:bold'><o:p></o:p></span></span></b></p>
<p align=center>
style='font-size:14.0pt'>1. Лекции по ПШ-1</span></b><b>
normal'><span>
<p><span>
href="tema1/chast1.htm">1.1.<span>
style='mso-bidi-font-weight:bold'>Основные понятия и классификация штампов</span></a></span></span><span
class=MsoHyperlink><b><span>
text-decoration:none;text-underline:none'><o:p></o:p></span></b></span></p>
<p><span>Классификация
штампов по технологическому признаку</a><span>
style='color:windowtext;text-decoration:none;text-underline:none'><o:p></o:p></span></span></span></p>
<p><span>Основные
требования
к штампам</a><o:p></o:p></span></p>
<p><span>
style='mso-spacerun:yes'> </span>Материалы для деталей штампов</a><span
class=MsoHyperlink><o:p></o:p></span></span></p>
<p><span>Крепление
рабочих
частей штампов</a><o:p></o:p></span></p>
<p align=center>
style='font-size:14.0pt'>2. Лекции по ПШ-2<o:p></o:p></span></b></p>
<p><span>Штампы для
резки – разделительные штампы</a> <u><span>
<p><span>
name=f1><span>
style='mso-spacerun:yes'> </span></a><a
href="tema2/chast1.htm#f1"><span
style='mso-bookmark:f1'>2.1.1. Вырубные штампы простого действия</span><span
style='mso-bookmark:f1'></span></a><o:p></o:p></span></p>
<p><span>
lang=EN-US>
style='mso-spacerun:yes'> </span></span><span>
href="tema2/chast1.htm#f2">2.1.2. Вырубные штампы последовательного действия</a><o:p></o:p></span></p>
<p><a name=f3><span>
style='mso-spacerun:yes'>
</span><span
style='mso-spacerun:yes'> </span></span></a><a
href="tema2/chast1.htm#f3"><span
style='mso-bookmark:f3'><span>Вырубные штампы
совмещенного действия</span></span><span>
style='font-size:14.0pt'><o:p></o:p></span></p>
<p><span>
href="tema2/chast2.htm">2.2.<span>Пробивные
штампы</a></span></span><span>
color:windowtext;text-decoration:none;text-underline:none'><o:p></o:p></span></span></p>
<p><span>
text-underline:none'><a
href="tema2/chast3.htm">2.3. Обрезные<i
style='mso-bidi-font-style:normal'> </i>штампы
</a></span></span><span
class=MsoHyperlink><span>
style='mso-spacerun:yes'> </span><o:p></o:p></span></span></p>
<p><span>
text-underline:none'><a
href="tema2/chast4.htm">2.4. Гибочные штампы</a></span></span><span
class=MsoHyperlink><span>
<p><span>
text-underline:none'><a
href="tema2/chast5.htm">2.5. Вытяжные штампы</a></span></span><span
class=MsoHyperlink><span>
<p><span>
text-underline:none'><a
href="tema2/chast6.htm">2.6.<span>
uppercase'> ш</span>тампы для формовочных операций</a><o:p></o:p></span></span></p>
<p><span>
style='mso-spacerun:yes'> </span><a
href="tema2/chast6.htm#l1"><span
style='text-transform:uppercase'>2.6.1. ш</span>тампы для правки и рельефной
формовки</a><span>
<p><span>
lang=EN-US>
style='mso-spacerun:yes'> </span><a
href="tema2/chast6.htm#l2"><span
lang=RU>Отбортовочные и формовочные штампы</span></a></span><span
style='font-size:14.0pt'><o:p></o:p></span></p>
<p><span>
lang=EN-US>
style='mso-spacerun:yes'> </span></span><span>
href="tema2/chast6.htm#l3"><span>ш</span>тампы
для обжима</a><span>
<p><span>
style='mso-spacerun:yes'> </span><a
href="tema2/chast6.htm#l4"><span
style='text-transform:uppercase'>2.6.4. ш</span>тампы для раздачи</a></span><span
lang=EN-US>
<p><span>
text-underline:none'><a
href="tema2/chast7.htm">2.7. Штампы
для мелкосерийного
и
опытного производства</a><o:p></o:p></span></span></p>
<p><span>
style='mso-spacerun:yes'> </span><a
href="tema2/chast7.htm#k1"><span
style='text-transform:uppercase'>2.7.1. у</span>прощенные штампы</a><span
style='text-transform:uppercase'><o:p></o:p></span></span></p>
<p><span>
style='mso-spacerun:yes'> </span><span>
style='mso-spacerun:yes'> </span><a
href="tema2/chast7.htm#k2">2.7.2. Универсальные
штампы
и блоки</a><o:p></o:p></span></p>
<p align=center>
style='font-size:14.0pt'>3. Лекции по ПШ-3<o:p></o:p></span></b></p>
<p><span>
style='mso-spacerun:yes'> </span>Типовые узлы и детали штампов</a><span
class=MsoHyperlink><span>
<p><span>
Проектирование
и расчеты штампов на прочность и жесткость</a> <u><span
style='color:blue'><o:p></o:p></span></u></span></p>
<p><span>
text-underline:none'><a
href="tema3/chast3.htm">3.3. Определение центра
давления штампа</a></span></span><span>
style='font-size:14.0pt'>
<o:p></o:p></span></span></p>
<p><span>
text-underline:none'><a
href="tema3/chast4.htm">3.4. Расчет деталей штампов на
прочность и жесткость</a></span></span><span>
style='font-size:14.0pt'>
</span></span><span>
style='mso-bidi-font-weight:normal'><span>
text-decoration:none;text-underline:none'><o:p></o:p></span></b></span></p>
<p><span>
href="tema3/chast5.htm">3.5. Основы выполнения чертежа штампа</a></span></span><span
class=MsoHyperlink><b>
style='font-size:14.0pt;color:windowtext;mso-ansi-language:EN-US;text-decoration:
none;text-underline:none'><o:p></o:p></span></b></span></p>
<p><span>
style='mso-spacerun:yes'> </span><span>
lang=EN-US>
style='mso-spacerun:yes'> </span></span><span>
href="tema3/chast5.htm#m1">3.5.1. Требования к оборудованию</a><o:p></o:p></span></p>
<p><span>
lang=EN-US>
style='mso-spacerun:yes'> </span></span><span>
14.0pt'><span>
style='font-size:14.0pt;mso-ansi-language:EN-US'><span
style='mso-spacerun:yes'> </span><span>
style='font-size:14.0pt'><a
href="tema3/chast5.htm#m2">3.5.2. Данные для
выполнения
рабочих чертежей
штампов</a><o:p></o:p></span></p>
<p><span>
lang=EN-US>
style='mso-spacerun:yes'> </span><span
style='mso-spacerun:yes'> </span></span><span>
14.0pt'><span>
14.0pt'><a
href="tema3/chast5.htm#m23">3.5.3. Чертежи штампов</a><o:p></o:p></span></p>
<p><span>
lang=EN-US>
style='mso-spacerun:yes'> </span><span>
style='mso-spacerun:yes'> </span></span><span>
style='mso-spacerun:yes'> </span></span><span>
href="tema3/chast5.htm#m4">3.5.4. Общие принципы простановки размеров</a><o:p></o:p></span></p>
<p>
text-indent:-27.6pt'><span>
color:navy'><a
href="../Index/Menu.htm"><span>
none;text-underline:none'><!--[if gte vml
1]><v:shapetype id="_x0000_t136"
coordsize="21600,21600"
o:spt="136" adj="10800"
path="m@7,l@8,m@5,21600l@6,21600e">
<v:formulas>
<v:f eqn="sum #0 0 10800"/>
<v:f eqn="prod #0 2 1"/>
<v:f eqn="sum 21600 0 @1"/>
<v:f eqn="sum 0 0 @2"/>
<v:f eqn="sum 21600 0 @3"/>
<v:f eqn="if @0 @3 0"/>
<v:f eqn="if @0 21600 @1"/>
<v:f eqn="if @0 0 @2"/>
<v:f eqn="if @0 @4 21600"/>
<v:f eqn="mid @5 @6"/>
<v:f eqn="mid @8 @5"/>
<v:f eqn="mid @7 @8"/>
<v:f eqn="mid @6 @7"/>
<v:f eqn="sum @6 0 @5"/>
</v:formulas>
<v:path textpathok="t"
o:connecttype="custom"
o:connectlocs="@9,0;@10,10800;@11,21600;@12,10800"
o:connectangles="270,180,90,0"/>
<v:textpath on="t"
fitshape="t"/>
<v:handles>
<v:h position="#0,bottomRight"
xrange="6629,14971"/>
</v:handles>
<o:lock v:ext="edit" text="t"
shapetype="t"/>
</v:shapetype><v:shape
id="_x0000_i1025" type="#_x0000_t136">
height:41.25pt' stroked="f">
<v:fill color2="#aaa"
type="gradient"/>
<v:shadow on="t"
color="#4d4d4d" opacity="52429f" offset=",3pt"/>
<v:textpath>
trim="t" fitpath="t"
string="НАЗАД"/>
</v:shape><![endif]--><![if
!vml]><img border=0 height=59
src="Vved.files/image002.gif" alt=НАЗАД
v:shapes="_x0000_i1025"><![endif]></span></a></span><span
class=MsoHyperlink><span>
</div>
</body>
</html>