Лекции.Орг


Поиск:




Категории:

Астрономия
Биология
География
Другие языки
Интернет
Информатика
История
Культура
Литература
Логика
Математика
Медицина
Механика
Охрана труда
Педагогика
Политика
Право
Психология
Религия
Риторика
Социология
Спорт
Строительство
Технология
Транспорт
Физика
Философия
Финансы
Химия
Экология
Экономика
Электроника

 

 

 

 


Форматирование псевдоклассов и псевдоэлементов




Псевдоклассы это - ссылки, first-child и lang:

a: link - свойства обычной ссылки; a: active - свойства активной ссылки;a: visited - свойства посещенной ссылки; a: hover - свойства ссылки при наведении на неё мыши; a: focus - свойство ссылки при фокусе

first-child - выделяет первый элемент среди последующих.

lang - форматирование элементов в зависимости от применения языков на странице.

В каскадных листах стилей при форматировании ссылок применяются те же значения, что и к обычному тексту. При описании других псевдоклассов в CSS перед их значениями указывается символ ">".

К псевдоэлементам в стилях относятся свойства: first-letter - форматирует первый символ для первой строки; first-line - назначается отдельное форматирование первой строки блока текста; after - назначает месторасположения объекта после текущего элемента; before - назначает месторасположения объекта до текущего элемента.

Единицы измерения в CSS

В CSS используeтcя несколько способов для задания размеров: относительный размер в про-центах (%), относительный размер при помощи словесного описания (larger, smaller, xx-small, x-small, small, medium, large, x-large, xx-large), абсолютный размер в типографских единицах - размер может задаваться в пунктах (pt), пиках (pc), пикселях (px), средней ши-риной буквы "m" (em), средней шириной буквы "x" (eх), абсолютный размер в стандартных единицах длины - размер может задаваться в сантиметрах (cm), миллиметрах (mm), дюймах (in), абсолютный в пикселях (px)

Цвет может быть определен одним из трех способов: при помощи названия цвета: yellow, red, green, grey,..; шестнадцатеричным заданием цвета в формате #RRGGBB: #ff0000, #883490, #ffffff,..; десятичным заданием составляющих цвета в формате rgb(red, green, blue): rgb(255,0,0), rgb(100,23,78),..

Приведем несколько примеров описания таблицы стилей:

 

.epigraph {

font-size: 12pt;

font-style: italic;

text-align: right;

color: rgb(127,127,0);

}

p.big {

font-size: 16px;

font-weight: bold;

color: #ff0000;

}

.menu {

font-weight: bold;

font-size: 9pt;

font-family: arial, helvetica, sans-serif;

}

a:hover {

color: #b63a3a;

text-decoration: none;

}

 

Новое в CSS3

border-radius, box-shadow, text-shadow, opacity, border-image, rgba(x,y,z,a), backgroun-size, background:url(), url(), column-count, transition, transform, @font-face, background-clip, animation, @animation-keyframes.

Закруление углов:.radius_border { border-radius: 25px;

-moz-border-radius: 25px;

-webkit-border-radius: 25px;

}

Тень от блока:box_shadow { box-shadow: 5px 5px 2px #000;

-moz-box-shadow: 5px 5px 2px #000;

-webkit-box-shadow: 5px 5px 2px #000;

}

Тень от текста: TEXT.text_shadow { text-shadow: 2px 2px 2px #000;

-moz-text-shadow: 2px 2px 2px #000;

-webkit-text-shadow: 2px 2px 2px #000;

}

Transition:.pic { margin-left: 80%;

-webkit-transform: rotate(-30deg) scale(1.5);

-webkit-transition: all 2s ease-in;

}

Валидация CSS

Валидацией называется проверка CSS-кода на соответствие спецификации CSS. Соответственно, корректный код, не содержащий ошибок, называется валидный, а не удовлетворяющий спецификации —невалидный. Чтобы проверить правильно ли оформлена страницу и лист стилей, можно загрузить их прямо со своего компьютера на сайт валидаторов и получить развернутое сообщение об ошибках. Наиболее удобно делать проверку кода CSS через сайт http://jigsaw.w3.org/css-validator/. С помощью этого сервиса можно указать адрес документа, загрузить файл или проверить набранный текст. Для проверки HTML-кода можно перейти на сайт validator.w3.org

Глава 4. Язык JavaScript

Введение

Язык JavaScript был разработан в 1995 году компанией Netscape Communication Corporation, известной также как создатель Web-браузера Netscape Navigator. JavaScript — это язык сценариев (скриптов), исполняемых в первую очередь на стороне клиента и позволяющих улучшить внешний вид Web-страниц. JavaScript — это интерпретируемый язык программирования. Это означает, что браузер выполняет каждую строку скрипта последовательно, строка за строкой. Все проведенные изменения вступают в силу сразу после загрузки документа в окне браузера. Интерпретируемые языки программирования позволяют легко перносить приложения на различные платформы. Они имеют также и недостаток —программы на них выполняются медленно.

JavaScript принес на клиентскую Web-страницу динамику и интерактивность. Ближайшей альтернативой JavaScript является технология Flash, содержащая средства для работы с мультимедиа.

К проблемам, часто решаемым на JavaScript можно, например, отнести следующие:

• отображение изменяющихся данных, таких как текущее время или дата;

• программирование переменного содержания в зависимости от браузера пользователя, имени пользователя, текущей даты, или других условий;

• изменение внешнего вида элементов страницы при возникновении события, например щелчка мышью;

• выполнение вычислений на клиентской странице.

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

Использование строки состояния. Строка состояния — это серая панель в нижней части окна браузера. Она позволяет отобразить описание команд меню и кнопок панели инструментов, например, с помощью бегущих строк.

Средства перемещения по документу. JavaScript позволяет создать меню и раскрывающиеся списки для перемещения между различными страницами Web-узла.

Окна с сообщениями и другие элементы. JavaScript позволяет создать окна сообщениий с предупреждением, напоминанием или подтверждением. Если необходимо вывести много информации, с помощью JavaScript создается новое окно браузера

Проверка и изменение форм. Формы позволяют проводить самые различные операции - от заказа товаров в электронных магазинах до получения сведений о популярности узла. JavaScript часто используется для проверки правильности заполнения полей формы.

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

Внедряемые модули. Надстройки браузера, позволяют отображать в документах HTML разные типы данных, например для отображения видео, и аудио информации.

Структура языка

Структурно JavaScript можно представить в виде объединения трёх частей:

• ядро (ECMAScript),

• объектная модель браузера (Browser Object Model или BOM),

• объектная модель документа (Document Object Model или DOM).

Спецификация ECMAScript описывает типы данных, инструкции, ключевые и зарезервированные слова, операторы, объекты, регулярные выражения.

BOM представляется объектом window и объектами: navigator, location, history, frames, screen, а также функциями setTimeout() и setInterval().

Помимо управления окнами, в рамках объектной модели браузера обеспечивается:

• управление фреймами,

• задержка в исполнении кода и зацикливания с задержкой,

• системные диалоги,

• управление адресом открытой страницы,

• управление информацией о браузере,

• управление информацией о параметрах монитора,

• ограниченное управление историей просмотра страниц,

• поддержка работы с HTTP cookie.

Согласно объектной модели документа DOM, документу можно поставить в соответствие дерево объектов, обладающих рядом свойств, которые позволяют производить с ним различные манипуляции:

• получение узлов,

• изменение узлов,

• изменение связей между узлами,

• удаление узлов.





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


Дата добавления: 2016-07-29; Мы поможем в написании ваших работ!; просмотров: 418 | Нарушение авторских прав


Поиск на сайте:

Лучшие изречения:

Ваше время ограничено, не тратьте его, живя чужой жизнью © Стив Джобс
==> читать все изречения...

2196 - | 2141 -


© 2015-2024 lektsii.org - Контакты - Последнее добавление

Ген: 0.011 с.