Достоинства и недостатки различных браузеров в работе с CSS2
Понятие отступов для HTML-элементов. Отступы margin и padding, их отличие и применение. Стили cursor:hand и cursor:pointer как расширения CSS2, используемые в браузерах Internet Explorer и Opera. Стиль :hover и его отличия от обычных стилей CSS.
| Рубрика | Программирование, компьютеры и кибернетика |
| Вид | реферат |
| Язык | русский |
| Дата добавления | 06.12.2012 |
| Размер файла | 39,3 K |
Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже
Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.
Размещено на http://www.allbest.ru/
Федеральное агентство по образованию
Государственное образовательное учреждение среднего профессионального образования
Хакасский политехнический колледж
Внеаудиторная работа
по дисциплине: «Программное обеспечение АИС»
На тему: «Достоинства и недостатки различных браузеров в работе с CSS2»
Выполнил: студент гр. АИС-41
Марков И.В.
Проверил преподаватель:
Зараменских А.А.
Абакан 2008
Отображение некоторых примеров работы CSS2 в различных браузерах
стиль браузер отступ css
Что такое margin, padding и в чём их отличие
Это всё виды отступов для HTML-элементов.
При ответе на этот вопрос грех не воспользоваться рисунком, который приводится в спецификации CSS2.
В принципе из этой картинки и так всё понятно, но можно пояснить, что порядок отступов (а по сути margin и padding это отступы) определяется так: margin, border, padding.
Также попутно можно указать, что для того чтобы элемент DHTML (в том числе и элемент body) занимал всё доступное пространство, то он должен определяться со следующим стилем./* какой-то файл с расширением *.css */
dhtml-no-indent
{
margin: 0px 0px 0px 0px;
border: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
Здесь существует одна особенность, которую следует упомянуть, дело в том, что спецификацией явно не указывается, какие отступы определяются по умолчанию для элемента <body>, поэтому производители браузеров на своё усмотрение могут выставлять их при рендеринге HTML. Чем собственно они и не приминули воспользоваться: Браузер Опера по умолчанию выставляет padding-отступы, а браузеры IE и Mozilla - выставляют margin-отступы. Чтобы избежать некорректного отображения в некоторых браузерах рекомендуется явно устанавливать все отступы для этого элемента.
Стиль cursor: hand и cursor: pointer
Стиль hand - это малоизвестное расширение CSS2 (введённое в IE и оставленное для совместимости с предыдущими версиями), которое также поддерживается браузером Opera. В реальности же в стандарте CSS2 нет упоминания “cursor: hand”, вместо него употребляется “cursor: pointer”. Это свойство поддерживается во всех браузерах, которые заявляют о поддержке CSS2 (это в первую очередь браузер Mozilla всех версий, Opera начиная с версии 6, MS Internet Explorer начиная с версии 6.0). ПРИМЕЧАНИЕ
Будьте внимательны, для IE версии ниже 6.0. необходимо указывать стиль hand. Для обхода этого ограничения можно воспользоваться следующим трюком, основанном на том, что по спецификации нераспознанные значения должны пропускаться (правда надо оговорится, что IE нераспознанные значения заменяет на значения по умолчанию, но и это можно обойти). Смотрим код:
style=”cursor: pointer; cursor: hand;”
Такая конструкция работает во всех упомянутых браузерах.
Что такое :hover и его отличия от обычных стилей CSS
hover - это, по определению в спецификации CSS2, динамический псевдо-класс (dynamic pseudo-class) - специальный стиль, который меняет рендеринг элемента, к которому он применён, в ответ на пользовательские действия. Таким пользовательским действием для псевдо-класса :hover является наведение на элемент указателя мышки. ПРЕДУПРЕЖДЕНИЕ
Внимание при указании стилей с псевдо-классом a:hover необходимо соблюдать последовательность объявления.
a:link { color: red; } /* не посещённые ссылки */
a:visited { color: green; } /* посещённые ссылки */
a:hover { color: yellow; } /* пользователь навёл указатель мыши */
a:active { color: gray; } /* активный элемент */
То есть стиль a:hover должен располагаться после стиля a:link и a:visited, потому как будет наблюдаться скрытие перекрывающихся правил (например, в примере это color - цвет шрифта). Основной смысл, что статические правила должны идти в объявлении раньше, чем динамические.
В спецификации CSS2 определено ещё несколько динамических псевдо-классов: :active (правило срабатывает при активизации элемента), :focus (когда элемент находится в фокусе). Кроме того, эти классы могут суммироваться, то есть следующее объявление:
<style>
a:focus {color: red;}
a:focus:hover {color: blue;}
</style>
вполне корректно и, в случае, когда ссылка (элемент <a>) в фокусе (:focus), то при наведении (:hover) она будет менять цвет. ПРИМЕЧАНИЕ
Обратите внимание, что при объявлении стиля для псевдо-класса, обязательно отсутствие пробела между именем элемента (или стиля) и именем псевдо-класса (a:hover:focus).
Я намеренно не стал говорить про динамические псевдо-классы применительно только к элементу <a> (как чаще всего их и применяют), а дело тут в том, что CSS2 не ограничивает применение псевдо-классов только на этот элемент (зато это прекрасно делает браузер IE любых версий). Например, абсолютно корректен с точки зрения спецификации следущий код:/* Стиль будет применяться на любой элемент
<div> */
<style>
div
{
color: black;
}
div:hover
{
color: red;
}
</style>
А также такой:/* Стиль будет применяться на любой элемент c классом
my-style */
<style>
my-style
{
color: black;
}
my-style:hover
{
color: red;
}
</style>
Что и прекрасно подтверждается браузерами Mozilla и Opera.
Примечание:
В браузере IE последние примеры работать не станут.
Размещено на Allbest.ru
Подобные документы
Достоинства, недостатки браузеров и их виды - полноэкранные и с поддержкой мультимедиа. Обзор наиболее популярных браузеров: Internet Explorer, Mozilla, Netscape Navigator, Opera, Firefox и Safari. Распространенность браузеров и их возможности.
доклад [32,2 K], добавлен 21.05.2013Понятие, сущность, виды, назначение и основные возможности браузеров. Общая характеристика наиболее популярных браузеров (Internet Explorer, Mozilla, Netscape Navigator, Opera, Firefox и Safari for Windows XP or Vista), анализ достоинств и недостатков.
контрольная работа [37,6 K], добавлен 21.09.2010Классификация модемов по исполнению и по принципу работы. Сетевая плата: назначение и устройство. Структура канала связи. История создания интернета. Виды и назначение современных компьютерных браузеров: Opera, Mozilla Firefox и Internet Explorer.
презентация [577,7 K], добавлен 14.03.2012Браузер Internet Explorer, его особенности, существующие недостатки. Достоинства Mozilla, уровни обеспечения безопасности. Преимущества работы в Google Chrome, неудобство работы с несколькими поисковиками. Отличительные черты и свойства браузера Рамблер.
презентация [1,2 M], добавлен 26.05.2014Обзор существующих браузеров: Windows Internet Explorer, Mozilla Firefox, Safari, Google Chrome, Opera, Flock, Maxthon. Статистика популярности браузеров - программ, представляющих в удобном для восприятия виде информацию, получаемую из Интернета.
презентация [3,8 M], добавлен 14.10.2013Теоретические основы организации сети Интернет. Internet состоит из более чем 20 тысяч, объединенных между собой, сетей. Обзор программных средств, используемых для работы: Internet Explorer, Outlook Express, Opera, The Bat!, их достоинства и недостатки.
курсовая работа [2,0 M], добавлен 27.01.2011Термин HTML (HiperText Markup Language) и его реализация. Программы просмотра страниц написанных на зыке манипулирования гипертекстами. Характеристика специальных программ – браузеров: Google Chrome, Opera, Mozilla Firefox. Структура HTML-страницы.
контрольная работа [118,8 K], добавлен 05.04.2015Характеристика основних типів web-браузерів: Internet Explorer, Opera, Mozilla Firefox, їх розповсюдження і особливості. Вимоги до оформлення сторінки службового документа, друк арабських і римських цифр, використання числівників. Охорона праці оператора.
дипломная работа [1,1 M], добавлен 02.07.2010Принципы формирования имен в сети Internet, элементы браузера Internet Explorer. Добавление Web-страницы в список избранных. Средства ускорения доступа к часто посещаемым страницам. Способы обеспечения доступа к ресурсам сети Internet в автономном режиме.
лабораторная работа [3,4 M], добавлен 24.05.2015Характеристика основных программ-просмотрщиков, используемых пользователями: Мicrоsоft Internet Explorer и Netscape Navigator. Проблемы воспроизведения на Web-страницах разнообразных видов объектов. Основные принципы работы Мicrоsоft Internet Explorer.
реферат [19,3 K], добавлен 22.11.2009
