Презентация на тему "web-программирование"
TRANSCRIPT
WEBпрограммирование
Вартанян ГоттиПодготовил студент 141 группы
Веб-программирование — раздел программирования, ориентированный на разработку веб-приложений (программ, обеспечивающих функционирование динамических сайтов Всемирной паутины). Языки веб-программирования — это языки, которые в основном предназначены для работы с веб-технологиями.
С помощью HTML можно легко создать относительно простой, но красиво оформленный документ.
HTML
CSS используется создателями веб-страниц для задания цветов, шрифтов, расположения отдельных блоков и других аспектов представления внешнего вида этих веб-страниц.
CSS
JavaScript позволяет управлять любым элементом на странице в режиме реального времени.
JAVASCRIPT
МультимедиаПриложения и сайты могут проигрывать аудио и видео без установки дополнительных плагинов вроде Flash-а.
HTML5 — это не продолжатель языка разметки гипертекста, а новая открытая платформа, предназначенная для создания веб-приложений использующих аудио, видео, графику, анимацию и многое другое.
3D, графика и эффектыМожно рисовать прямо на веб-странице используя Canvas API. Технологии WebGL и CSS3 3D позволяют отображать трехмерную графику непосредственно в браузере.
HTML
<!DOCTYPE html>
<body>
<html>
<head><H1>
HTML-документ — это просто текстовый файл с расширением *.html. Давайте попробуем создать наш первый HTML документ, посмотрим на его строение и конечно же на его отображение в браузере..Для этого нам понадобится самый обычный текстовый блокнот и браузер
Сохранив изменения в Блокноте, просто нажмите кнопку F5 ('перезагрузить') в IE, чтобы увидеть эти изменения реализованными в HTML-документе.
Правила CSS пишутся на формальном языке CSS и располагаются в таблицах стилей, то есть таблицы стилей содержат в себе правила CSS. Эти таблицы стилей могут располагаться как в самом веб-документе, внешний вид которого они описывают, так и в отдельных файлах, имеющих формат CSS. (По сути, формат CSS — это обычный текстовый файл. В файле .css не содержится ничего, кроме перечня правил CSS и комментариев к ним.)То есть, эти таблицы стилей могут быть подключены, внедрены в описываемый ими веб-документ четырьмя различными способами:
• когда таблица стилей находится в отдельном файле, она может быть подключена к веб-документу посредством тега <link>, располагающегося в этом документе между тегами <head> и </head>. (Тег <link> будет иметь атрибут href, имеющий значением адрес этой таблицы стилей). Все правила этой таблицы действуют на протяжении всего документа;
CSS
• когда таблица стилей описана в самом документе, она может располагаться в нём между тегами <style> и </style> (которые, в свою очередь, располагаются в этом документе между тегами <head> и </head>). Все правила этой таблицы действуют на протяжении всего документа;
• когда таблица стилей описана в самом документе, она может располагаться в нём в теле какого-то отдельного тега (посредством его атрибута style) этого документа. Все правила этой таблицы действуют только на содержимое этого тега.
10 впечатляющих примеров возможностей и функций CSS3 технологий
1. Закругленные углы
Замечательный эффект закругленных углов для объекта. Причем скруглять углы можно выборочно и с разной степенью округлости.
2. Тень у текста
Используя тень для текста можно легко задать объем или с помощью белой тени создать иллюзию тиснения.
Выпадающее меню
С помощью CSS3 можно создать современное, многоуровневое выпадающее меню с различными эффектами.
4. Диалоговое окошко
А так выглядит диалоговый модуль на основе CSS3 с произвольным текстом сообщения, появляющийся поверх основного контента.
5. Разговорные блоки
Можно оригинально оформить текст с помощью разнообразных разговорных блоков, которые, опять таки, сделаны на основе CSS3
6. Навигация на вкладках
Нажимая на пункт меню, образуется вкладка с текстом, объединенная с самим пунктом меню. Есть множество вариантов оформления.
7. Кнопки
Наконец-то можно отказаться от графических кнопок и сделать разнообразные симпатичные кнопки с помощью CSS3.
8. Галерея картинок
Можно создать оригинальную галерею картинок с необычными эффектами при наведении курсора.
9. Загнутые края ленты
Замечательный эффект, создающий иллюзию завернутой за края ленты. Всегда смотрится очень симпатично.
10. Вертикальный аккордеон
Замечательный эффект, создающий иллюзию завернутой за края ленты. Всегда смотрится очень симпатично.
JavaScript обычно используется как встраиваемый язык для программного доступа к объектам приложений. Наиболее широкое применение находит в браузерах как язык сценариев для придания интерактивности веб-страницам.
Встраивание в веб-страницы
Расположение внутри страницы:Для добавления JavaScript-кода на страницу, можно использовать теги <script></script>, которые рекомендуется, но не обязательно, помещать внутри контейнера <head>. Контейнеров <script> в одном документе может быть сколько угодно.
Область применения• Браузерные операционные системы
Пользовательские скрипты в браузереПользовательские скрипты в браузере — это программы, написанные на JavaScript, выполняемые в браузере пользователя при загрузке страницы. Они позволяют автоматически заполнять формы, переформатировать страницы, скрывать нежелательное содержимое и встраивать желательное для отображения содержимое, изменять поведение клиентской части веб-приложений, добавлять элементы управления на страницу и т. д.
• ВиджетыВиджет — вспомогательная мини-программа, графический модуль которой размещается в рабочем пространстве соответствующей родительской программы (англ.), служащая для украшения рабочего пространства, развлечения, решения отдельных рабочих задач или быстрого получения информации из интернета без помощи веб-браузера.
// LifeIf(You.sad == TRUE) { sad().stop(); beAwesome();}
10 впечатляющих примеров возможностей и функций JavaScript технологий
1. Навигация по картинкам в портфолио2. Впечатляющее динамическое меню3. Полноразмерное слайдшоу4. Анимированная диаграмма5. Появление предпросмотров при наведении6. Анимированные диалоговые окна7. Увеличение картинки при наведении8. Меню с появляющийся картинкой9. Меню со всплывающими картинками10. Эффектная галерея предпросмотров в кругах
Спасибо завнимание