Иэтэ, кафедра фтэмкинформационные технологии в электроматериаловедении
 Скачать 0.94 Mb.
|
ИЭТЭ, кафедра ФТЭМК Информационные технологии в электроматериаловедении Тихонов Антон Иванович ( tikhonovai@mpei.ru , tikhonovai@mail.ru http://ftemk.mpei.ru/ed/iteor ) 1 2 2 Организационные вопросы ⚫ Встречаемся по пятницам. Преподаватель: Тихонов Антон Иванович, tikhonovai@mpei.ru ⚫ Задача: ⚫ Показать, ⚫ как устроены информационные технологии, ⚫ как их использовать в профессиональной и повседневной деятельности. ⚫ Курс состоит и блоков, по каждому из блоков минизачет. ⚫ Для получения зачета необходимо получить все, повторяю все минизачеты. ⚫ Изложение будет вестись на уровне «… и бабочки тоже так…». 3 3 Что будет в курсе ⚫ Информационные технологии – это в основном не наука, а ремесло: ⚫ Мало «голубых» идей, зато много остроумных ремесленных (технологических) приемов; ⚫ Так как идей мало, то они появляются раз за разом на протяжении десятилетий ⚫ Технологические приемы и их быстрое внедрение – это деньги ⚫ Деньги, технологии и организация – это власть. Эрик Шмидт (Google) о глобальном позиционировании пользователей ⚫ Сетевые технологии ⚫ 2.09.69 – первая передача данных между компьютерами ⚫ Как устроены компьютерные сети ⚫ Основные принципы их построения ⚫ Стек протоколов TCP/IP, уровневая архитектура, weak coupling, шаблоны проектирования ⚫ Характеристика слоев, связанных с ними технологий и протоколов ⚫ Web- приложения ⚫ Безопасность ⚫ Гигиена в повседневных информационных технологиях ⚫ Элементарная криптография ⚫ Публикация в сети ⚫ Сети изменившие мир, революция электронных изданий: человек из существа читающего стал пишущим – лучше не стало ⚫ Html – публикация текста и статической графики, html5 – возможности динамической графики ⚫ Css – стилевое оформление изданий ⚫ JavaScript +jQuery – от простой книги к волшебной сказке Андерсена ⚫ Flash – анимация – «девочка и крокодил» ⚫ Базы данных ⚫ Способ хранить, искать, использовать большие объемы данных ⚫ Основные объекты реляционных баз данных ⚫ SQL- эсперанто баз данных ⚫ Нереляционные базы данных, map/reduce ⚫ Поиск и data mining (если успею) 4 4 ⚫ Все просто: ⚫ Почта – коммутация пакетов – асинхронные службы ⚫ Телефон – коммутация каналов ⚫ Из чего появился Интернет. Управление страной в чрезвычайных условиях. Подход СССР и США ⚫ Конвергенция: сейчас Интернет - это телефон на основе почты (синхронные службы поверх асинхронных). ⚫ Основные принципы: ⚫ Открытость (взаимодействие -все взаимодействует со всем), а для этого должны быть определены интерфейсы. Опережающая стандартизация. Как ведется стандартизация в Интернете. Любое устройство может быть подключено к сети. Нетривиальный принцип, рассказать историю. Все интерфейсы публикуются. RFC ⚫ Слабая связанность, уровневая архитектура – это борьба с комбинаторным взрывом. Велосипед – шаблоны проектирования. ⚫ Встраиваемые уровни, их замена (NetBEUI поверх TCP/IP) ⚫ Вынужденная консервативность: IP v.4, TCP/IP, HTML и HTML 5 Как устроены сети 5 5 Уровневая архитектура Прикладной уровень Транспортный уровень Межсетевой уровень Физический уровень Прикладной уровень Транспортный уровень Межсетевой уровень Физический уровень ⚫ Взаимодействуют только соседние уровни по вертикали ⚫ Абстракция взаимодействия по горизонтали 6 6 Сравнение сетей с коммутацией пакетов и сетей с коммутацией каналов ⚫ Телефон (коммутация каналов): ⚫ Простой клиент, ⚫ Сложная АТС ⚫ Централизация ⚫ Синхронная служба ⚫ Почта: ⚫ Сложный клиент ⚫ Простая сетевая структура ⚫ Децентрализация ⚫ Высокая надежность ⚫ Асинхронная служба 7 7 Возвращаемся к стеку TCP/IP Прикладной уровень Транспортный уровень Межсетевой уровень Физический уровень Прикладной уровень Транспортный уровень Межсетевой уровень Физический уровень ⚫ Начинаем с физического уровня 8 8 Межуровневое взаимодействие ⚫ Уровневая архитектура позволяет поддерживать абстракцию межуровневого взаимодействия ⚫ На самом деле передача при передаче данных данные путешествуют у отправителя с самого верхнего уровня к самому нижнему. При передаче с уровня на уровень осуществляются преобразования: ⚫ разбиение данных на пакеты ⚫ обрамление тел пакетов (полезных данных) служебной информацией (заголовками и трейлерами) ⚫ аналогом тела пакета является текст письма, заголовкам и трейлерам – служебная информация: адрес получателя, обратный адрес, штемпели, расписка о получении письма и т.д. ⚫ Во время путешествия по уровням вниз полезные данные многократно переформировываются и обрастают служебной информацией. ⚫ На стороне получателя происходит обратный процесс: с помощью служебной информации, содержащейся в заголовках и трейлерах данные путешествуют вверх по стеку протоколов. 9 9 Физический уровень ⚫ Основные задачи: ⚫ Передать импульсы на одной стороне, ⚫ Детектировать импульсы на другой, несмотря на шум и дисторсию ⚫ Среды передачи: ⚫ Коаксиальный кабель (история, общая шина, метафора трубы и людей вокруг нее, отличие от телевизионного – история с ПМЗР) ⚫ Витая пара ⚫ STP, UTP, навивка, витая пара и крысы ⚫ Архитектура (звезда – обманка), необходимость дополнительного устройства, заземление STP. Скорости передачи ⚫ Защищенность, бесконтактное снятие данных, обнаружение неисправностей ⚫ Структурированные кабельные сети, сеть это то же ,что и освещение, горячая и холодная вода ⚫ Децентрализация ⚫ Высокая надежность ⚫ Асинхронная служба 10 10 Физический уровень 2 ⚫ Телефонная сеть ⚫ Коммутируемый доступ, ограничения на скорость передачи данных, теорема Котельникова, полоса 4 кГц. Необходимость преобразования аналог-цифра ⚫ Сети xDSL (Интернет+ТВ+охранная сигнализация+телефон 2 линии ⚫ Электрика – обход трансформаторов, взаимодействие связистов и энергетиков ⚫ Использование наложенных сетей 11 11 Физический уровень 3 ⚫ Оптика ⚫ Распространение света по оптоволокну ⚫ Одномодовые и многомодовые кабели ⚫ Необходимость преобразование в электрические сигналы, оптические маршрутизаторы ⚫ Магистральные сети, Ал Гор и интернетизация всей Америки ⚫ Оптика и Сбербанк 12 12 Физический уровень 4 ⚫ Радио ⚫ Радио Ethernet – лицензирование частот, последняя миля ⚫ WiFi IEEE 802.16 a, b, g, n от 1 до 50 Мбит/с, n- до 300 Mбит ⚫ Технологии 5, 6-ого поколения, дележ частот ⚫ Спутниковый Интернет, высотные самолеты, шары, необходимость взаимодействия 13 13 MAC – подуровень доступа к среде передачи данных ⚫ Задача: ⚫ Как организовать одновременный доступ нескольких компьютеров к среде передачи данных ⚫ Подход Token Ring ⚫ Подход Ethernet ⚫ Mac- адрес ⚫ Метафора переговоров через трубу ⚫ Хабы (концентраторы), коммутаторы ⚫ Широковещательный трафик ⚫ Разделение на подсети, как работает мост, коммутатор, как интеллектуальное средства создания подсетей ⚫ До сих пор мы оставались в локальной сети, пока мы не может выйти в Интернет. В Интернете мы будем путешествовать между сетями 14 Ethernet 14 15 Сегментация сетей 15 16 16 Что такое Интернет? ⚫ Интернет - это сеть сетей ⚫ это множество связанных, взаимодействующих между собою локальных сетей ⚫ взаимодействуют они между собою ⚫ Взаимодействие осуществляется с помощью маршрутизаторов – почтовых отделений. Задачи маршрутизаторов: ⚫ Сортировка пакетов писем, выбор и передача следующей почтовой станции в своем окружении. ⚫ Маршрутизатор через некоторое время проверяет, функционируют ли соседи и в зависимости от этого меняют направления передачи данных. Таким образом осуществляется самоорганизация. ⚫ Если маршрутизатор не справляется с наплывом данных, он их отбрасывает. ⚫ Магистральные сети, метросети, сети уровня предприятия, локальные сети. Соответственно имеется иерархия маршрутизации. ⚫ Все это осуществляется на межсетевом уровне, задачей которого является доставка данных из пункта A в пункт B, причем промежуточные пункты (маршрут) выбираются самими маршрутизаторами. ⚫ Таблицы маршрутизации, их построение, протоколы маршрутизации ⚫ Протокол, осуществляющий межсетевое взаимодействие – Internet Protocol (IP) ⚫ IP – не гарантирует доставку данных, его задачей является обеспечение возможности доставки хотя бы чего-нибудь 17 17 Адресация в Интернет (IP v.4) ⚫ На заре создания Интернет никто не думал, что она станет социальным явлением, предполагалось, что число хостов не превысит несколько сотен. ⚫ Адресное пространство было выделено с запасом 4 байта. ⚫ Используется точечная запись: десятичное содержимое байтов разделяется точками, например, 193.233.70.171 ⚫ Вводится понятие хоста – сетевого интерфейса, т.к. у одного компьютера может быть несколько сетевых плат, а на сетевой плате может быть сконфигурировано несколько IP-адресов. Хост однозначно характеризуется IP- адресом ⚫ Структура адресов: ⚫ 1 байт адрес сети, 3 байта адрес хоста (сетевого интерфейса) – сети класса А ⚫ 2 байта адрес сети, два байта адрес хоста – сети класса B, обычно провайдеры, в такой сети может быть больше 65 тыс. хостов ⚫ 3 байта адрес сети, один байт адрес хоста- сеть класса С. В МЭИ 5 сетей класса С. ⚫ Кратко другие классы сетей ⚫ Волшебные адреса: 127.0.0.1 (loopback) – диагностика сетевого интерфейса ⚫ Умалчиваемый шлюз ⚫ Подсети, не имеющие выхода в Интернет, пример, 192.168.ххх.ххх. 18 18 Межсетевой уровень (1) ⚫ Недостаток адресов. ⚫ Переход на Ipv.6 ⚫ Паллиативные решения: DHCP и NAT, объяснить кратко, вернуться на соответственно сетевом и прикладном уровнях ⚫ Виды маршрутизаторов: от коробочки за 1500 рублей, до нескольких миллионов долларов, маршрутизаторы на старых компьютерах. ⚫ Еще раз повторяю функции маршрутизатора: ⚫ Маршрутизатор договаривается с соседями, со своим окружением, ⚫ Отслеживает маршрутную информацию ⚫ Передает по эстафете пакеты 19 19 Межсетевой уровень (2) ⚫ Структура пакетов IP: ⚫ From ⚫ To ⚫ TTL- объяснить, зачем нужен ⚫ Другие протоколы межсетевого уровня, ICMP: ⚫ ping: как работает, показать на примере МЭИ ⚫ tracert, Visual traceroute Подключение: маска сети, умалчиваемый шлюз Иерархия сетей habr.ru 20 20 Транспортный уровень (1) ⚫ Межсетевой уровень доставляет пакеты из A в B, но не гарантирует доставки ⚫ Гарантия доставки осуществляется на транспортном уровне и ли прикладном ⚫ Кроме того межсетевой уровень не гарантирует доставки пакетов в нужном порядке, так что транспортному уровню нужно осуществлять сборку сообщений ⚫ Задачей транспортного уровня является доведение данных для конкретного вычислительного процесса. Какие будут предложения? ⚫ Порты, хорошо известные порты, 80 20, 21,25, 110… 21 21 Транспортный уровень (2) ⚫ Как осуществляется гарантированная доставка на транспортном уровне – TCP ⚫ Соединение – взаимодействие двух сторон ⚫ Нумерация пакетов ⚫ Запуск таймеров ⚫ Квитирирование ⚫ Недостатки TCP – медленный запуск, высокие накладные расходы ⚫ UDP – на деревню дедушки. ⚫ Применение: передача мультимедиа, boot – пример протокола, решающего задачу гарантированной доставки другими методами 22 22 Прикладной уровень (1) ⚫ Прикладной уровень – сотни протоколов и технологий различного назначения и сложности ⚫ Начнем с экономии IP-адресов ⚫ DHCP – IP-адрес во временное пользование, только для тех, кто сейчас в сети. Все нужное для настройки несет в себе. Недостатки – нельзя использовать для серверов, т.к. адреса постоянно меняются. Плати за фиксированный адрес ⚫ NAT – как подключить много компьютеров в к одному IP- адресу. Фактически это обманка, переписывающая заголовки пакетов транспортного уровня. Пояснить на примере. Как обнаружить нахлебников. Пример компьютерного класса, traceroute. NAT 23 Веб-сервер 193.233.67.11 (mpei.ru) NAT 193.233.70.172 ------------------- 192.168.0.1 192.168.0.31 192.168.0.102 192.168.0.251 To:193.233.67.11:80 From: 192.168.0.31:57134 To:193.233.67.11:80 From: 193.233.70.172:21345 To:193.233.172.11:21345 From: 193.233.67.11:43276 193.233.70.172:21345<-> 192.168.0.31:57134 To: 192.168.0.31:57134 From: 193.233.67.11:43276 24 24 ⚫ DNS ⚫ Структура доменного имени, домены первого уровня: начальные имена, национальные домены, корневые сервера: ftemk.mpei.ru<- >193.233.70.172 ⚫ Преобразование доменных имен ⚫ Файл hosts ⚫ Как работает DNS, корневые сервера, два российских корневых сервера, атаки на DNS ⚫ Динамический DNS ⚫ Балансировка нагрузки Прикладной уровень (2) 25 25 Прикладной уровень (3) ⚫ История протоколов прикладного уровня ⚫ telnet ⚫ ftp ⚫ whois ⚫ SMTP, POP3, IMAP – полная имитация почты, история по электромеханику ⚫ Общая беда – проблемы с безопасностью ⚫ Организация взаимодействия: ⚫ Клиент-сервер ⚫ Одноранговое взаимодействие p2p 26 26 Прикладной уровень (4) ⚫ Синхронные и асинхронные службы ⚫ Службы мгновенных сообщений: история ICQ, закрытый протокол, jabber, присутствие на рабочем месте ⚫ P2P – достоинства и недостатки (поиск, управление, безопасность) ⚫ Bittorrent – замечательная идея ⚫ Skype – хорошие идеи в отличном исполнении, звук по dialup, ужасный менеджмент Bittorrent ( Брэм Коэн) 27 Веб-сервер координатор Клиент 1 Клиент 2 Клиент 3 28 28 Прикладной уровень (5) ⚫ HTTP – одна из составляющих тройки, которая изменила мир (60- 70% трафика): ⚫ http ⚫ Html ⚫ Браузер ⚫ Тим Бернерс Ли ⚫ Функционирование HTTP ⚫ Запрос-ответ ⚫ Заголовки (кодировка, кэширование…) ⚫ Сохранение состояния ⚫ cookies ⚫ Как работает web-сервер ⚫ Серверы приложений: прокладки между web-сервером ⚫ Используемые технологии: PHP, asp.net, python – Google, django,ruby on rails ⚫ HTTP 3 – костыль 29 29 Web- приложения ⚫ Клиент-серверная архитектура ⚫ Клиент ⚫ Html + css + javascript+dom ⚫ Ajax- пояснить, зачем ⚫ jQuery ⚫ Html5 – возможности встраивания видео, аудио, интерактивная графика + анимация ⚫ Flash – развитые дизайнерские средства, обширные библиотеки, платформа разработки (flash/flex). Собственная виртуальная машина -проигрыватель flash (1 Мб), к сожалению закончился ⚫ JavaFX – очень интересная платформа, основанная на Java (П. Нотон- история) ⚫ Google Apps – Java – javascript – браузер ⚫ Современная тенденция – все перенести на клиент 30 30 Угрозы ⚫ Отказы оборудования ⚫ Вирусы ⚫ Руткиты ⚫ Шифровальщики, блокирование компьютера ⚫ Социальная инженерия ⚫ Вредоносные приложения. Зомби-сети, рассылка спама, DDos атаки 31 31 Компьютерная гигиена (1) ⚫ LiveCD – посмотреть на разрушения ⚫ Установочный комплект ⚫ Разделять программы и данные, данные на отдельный раздел ⚫ При установке сразу же установить (сконфигурировать): ⚫ Файервол (объяснить, как работает) ⚫ Антивирус ⚫ Средства борьбы с Malware (Search&Destroy) ⚫ Автономный антивирус –CureIt ⚫ Сразу после установки запустить обновления ⚫ Обновления делать регулярно!! Лучше в автоматическом режиме ⚫ Все эксперименты – виртуальные машины (рассказать VMware, VirtualBox 32 32 Компьютерная гигиена (2) ⚫ Рутинная работа ⚫ Слепки Acronis True Image, Norton Ghost ⚫ Еженедельный back up ⚫ Shadow User ⚫ Ежемесячный слепок ⚫ Установка обновлений на систему ⚫ Установка обновлений на антивирус и средство борьбы с Malware ⚫ Не зариться на троянских коней – подготовленные системы – руткиты 33 33 Случилось страшное ⚫ На все наплевать, сделать откат ⚫ Не получилось, загрузись с LiveCD, попытайся понять, что случилось и полечиться, но только под другой операционной системой (может помочь, если на компьютере две системы). ⚫ Не получилось, накатить слепок. ⚫ Ultima Ratio – переустановить систему с нуля. 34 34 Криптография (1) ⚫ Древняя отрасль ⚫ Библия, ⚫ Юлий Цезарь, ⚫ Принципы шифрования: ⚫ Замена ⚫ Подстановка (магический квадрат) ⚫ Типы шифров ⚫ Блочные ⚫ Поточные (шифр Вернама, одноразовые блокноты) ⚫ Брюс Шрайер Прикладная криптография ⚫ Человеческий фактор (Аквариум Суворова) 35 35 Криптография (2) ⚫ О –Ш---------Ш-О (шифрование, расшифрование на одном секретном ключе) ⚫ Гражданская криптография – открытые алгоритмы, пример AES ⚫ Хеш ⚫ Датчики случайных чисел ⚫ Обязательное подмешивания случайных данных, зачем? ⚫ Стойкость шифросистем, вскрытие шифров, аналитика, анализ окружающей информации, криптоаналитика 36 36 Криптография (3) ⚫ Проблема распространения ключей (проблема проблем для открытой сети) ⚫ RSA, несимметричные системы шифрования (Ривс, Шамир, Адельсон) ⚫ Схема шифрования (секретный, открытый ключ) ⚫ Высокие накладные расходы: хеши, ⚫ Электронная подпись, схема ⚫ Инфраструктура открытых ключей (непонятная для русского менталитета схема), Verisign, Майкл Шафлворт, Ubuntu ⚫ Фил Циммерман, сети доверия, PGP International ⚫ Состояние с гражданской криптографией в России 37 Распространение ключей А B Ао Ас Ао Bc Bo Bo 38 Шифрование и цифровая подпись 38 А От Шт Bo От B с B А От Шт ПШт Шт От B Bo Ac Ao B с 39 Цифровые сертификаты ⚫ Цифровой сертификат содержит: ⚫ Имя владельца ⚫ Открытый ключ владельца ⚫ Дата истечения срока действия ⚫ Цифровой сертификат подписывает служба сертификации (СА) ⚫ Цифровой сертификат открыто публикуется на веб-сервере СА, которая гарантирует связь открытого ключа с владельцем сертификата 39 40 Поиск информации в сети ⚫ Поисковые службы: Google, Яндекс, Bing ⚫ Энциклопедии: Википедия, WolframAlfa, Британская энциклопедия ( http://www.britannica.com/ ) ⚫ Специализированные сервисы: http://scirus.com/ - сервис научных публикаций ⚫ Каталоги библиотек: ⚫ Российская государственная библиотека: http://www.rsl.ru/ ⚫ Государственная публичная научно-техническая библиотека: http://www.gpntb.ru/ ⚫ НТБ МЭИ: http://ntb.mpei.ru/ (не только поиск, но и доступ к электронной библиотеке и зарубежным научным журналам ) 40 41 Анализ информации ⚫ Найденную информацию необходимо где- то хранить (One Note, специализированные базы данных) ⚫ Анализ информации – аналитика: информацию из различных источников необходимо сопоставлять! ⚫ Data Mining 41 42 Характеристика HTML ⚫ Основная цель: ⚫ Показать, как осуществляется публикация web-документов ⚫ Познакомить со структурой web-документов ⚫ HTML ⚫ Удачная и простая спецификация ⚫ В настоящее время используется версия 4 ⚫ Бодрый переход на версию 5: ⚫ Структуризация документов ⚫ Встроенные средства аудио/видео ⚫ Встроенные улучшенные средства взаимодействия с пользователем ⚫ На самом деле публикация в web: ⚫ Html – текст, статическая графика ⚫ Css – стилевое оформление ⚫ Javascript – язык программирования ⚫ Dom – программный доступ к объектам документа ⚫ 43 Альтернативные технологии ⚫ Flash ⚫ Решается вопрос с совместимостью (мультиплаформность) ⚫ Мощные средства программирования ⚫ Мощная поддержка мультимедиа ⚫ Мощные среды разработки ⚫ Построение RIA, технология AIR ⚫ Высокие требования к оборудованию ( запрещено на Ipod, IPad) ⚫ Последнее время проблемы с безопасностью ⚫ Silverlight – ответ Microsoft ⚫ Мощные средства программирования VS, Expression Blend ⚫ Ограниченная мультиплатформность ⚫ JavaFX – чисто программистская платформа 44 Редакторы HTML ⚫ Html – текстовой формат ⚫ Текстовые редакторы ⚫ Блокнот ⚫ EditPlus ⚫ PsPad ⚫ Системы разработки ⚫ Dreamweaver ⚫ Visual Studio ⚫ Текстовые процессоры ⚫ Word – очень избыточный html-текст, который трудно сопровождать (Файл|Сохранить как |Веб-страница с фильтром ) ⚫ Open Office 45 Edit+ ⚫ Работать будем с EditPlus ⚫ Запуск и настройка ⚫ Tools|Preferences Fonts Language: Cyrillic ⚫ Создать минимальную HTML-страницу ⚫ File|New|Html page ⚫ Запуск – самая левая иконка на панели инструментов (блокнот с лупой) ⚫ Переход к редактированию –блокнот с карандашом 46 Первый документ Это отображается в браузере 47 Кодировки ⚫ equiv=‘Content-Type’ ⚫ Content=‘text/html’; ⚫ Charset=‘windows-1251’ ⚫ /> ⚫ Структура тега (дескриптора) ⚫ Атрибуты (пары: имя/значение) ⚫ Значения должны быть заключены в в кавычки или апострофы ⚫ Кодировки: ⚫ Koi8r- транслит ⚫ Windows-1251 – кодовые страницы Windows ⚫ Utf-8 –Юникод (включает страславянское письмо и глаголицу) 48 Тег body ⚫ Обрамляет содержимое документа ⚫ Допустимые атрибуты ⚫ Bgcolor=“цвет” – цвет фона ⚫ Text=“цвет”-цвет текста ⚫ Link=“цвет”-цвет гиперссылки ⚫ Alink=“цвет”-цвет активной гиперссылки ⚫ Vlink- ”цвет”-цвет просмотренной гиперссылки ⚫ Цвета: ⚫ Red, navy, darkgray - имена ⚫ #ffffff – белый, #000000-черный, #ff0000 – красный ⚫ Выбор цветов в Edit+, жми на иконку с палитрой 49 Структурирование документов ⚫ Заголовки ⚫ От …до⚫ В спецификации не говорится, как должны отображаться заголовки, но пользователю должно быть понятно, например, в текстовом браузере lynx – цветом ⚫ Показать все заголовки ⚫ Выравнивание в html (атрибут align- устаревший, нужно пользоваться css) ⚫ Значения: center, left, right, justify ⚫ Div – выделение фрагмента ⚫ Span – нужен только для приписывания стилей ⚫ Hr – горизонтальная строка ⚫ Size=“10”-толщина ⚫ Width=“50%” – ширина ⚫ Align=“center”- выравнивание ⚫ Комментарий 50 Абзацы и текстовые элементы ⚫ Тег … ⚫ Выравнивание ⚫ Как браузер отрисовывает элементы: слева направо, сверху вниз, изменение размеров она приводит к перерисовке ⚫ Пробелы сворачиваются до одного, если нужно несколько пробелов, используйте сущность 51 Сущности ⚫ Специальные символы: ⚫ " - кавычка ⚫ &- амперсанд ⚫ <-< (очень нужно, т.к. этот символ зарезервирован для тегов) ⚫ >-> (очень нужно, т.к. этот символ зарезервирован для тегов) ⚫ - неразрывный пробел ⚫ © - знак авторского права ⚫ ® - знак торговой марки ⚫ ° - градус 52 Тег преформатирования, подстрочники, надстрочники ⚫ … ⚫ Отображает текст как есть моноширинным шрифтом ⚫ …-подстрочные индексы ⚫ …-надстрочные индексы ⚫ 53 Теги форматирования ⚫ ..- полужирный ⚫ …-курсив ⚫ …-подчеркивание ⚫ ⚫ …-пишущая машинка ⚫ - оформление текста ⚫ Size=“4”-относительный размер от 1 до 7 ⚫ Face=“”-список гарнитур ⚫ Color=“red” 54 Списки ⚫ Упорядоченный список ⚫
⚫ ⚫ ⚫ Атрибуты: ⚫ Type: ▪ 1- арабские цифры ▪ a,A- латинские буквы ▪ i.I- римские цифры ⚫ Неупорядоченный список ⚫
⚫ ⚫ ⚫ Атрибуты: ⚫ Type: ▪ disc- закрашенный круг ▪ square- квадрат ▪ Circle- окружность ⚫ Смешанные списки (продемонстрировать) 55 Списки определений ⚫
⚫ ⚫ ⚫ 56 Гиперссылки ⚫ Абсолютные гиперссылки ⚫ Протокол://сервер/вирт.путь/вирт.путь/документ#закладка ⚫ Пример абсолютной ссылки: ⚫ http://ftemk.mpei.ru/prj/news.aspx ⚫ Относительные ссылки: ⚫ Текущий документ: ‘#’ ⚫ Ссылки на документы в том же каталоге:03.html ⚫ Ссылки на подкаталоги: subdir/04.html ⚫ Ссылки на вышележащие каталоги, ../superdir/subdir.html ⚫ Кодирование ссылки Активная область ⚫ Закладка ⚫ Тег link: ⚫ Атрибуты: _blank, _self ⚫ Примеры: ⚫ ссылка на закладку в документе. ⚫ Навигационные ссылки в четырех документах: оглавления, предыдущий, следующий 57 Навигация - пример 0.html 1.html 2.html 3.html 58 Изображения ⚫ Грузим архив с изображениями: http://ftemk.mpei.ac.ru/ed/images.zip ⚫ Разворачиваем в личном каталоге подкаталог images ⚫ ⚫ Атрибуты width, height, изменение размеров изображений в ограниченных пределах ⚫ Атрибут alt ⚫ Изображение как активная область гиперссылки 59 Таблицы(1) ⚫ Базовые теги ⚫ ⚫ ⚫ … | -ячейка⚫ Атрибуты тега
|