При переносе верстки с использованием тегов <font size=”2″>… </font> в свойство CSS font-size, выяснилось, что различные браузеры, воспринимают CSS-свойства xx-small, x-small, small, large…
Набор констант (xx-small, x-small, small, medium, large, x-large, xx-large) задает размер, который называется абсолютным. По правде говоря, они не совсем абсолютны, поскольку зависят от настроек браузера
и операционной системы.
| CSS |
xx-small |
x-small |
small |
medium |
large |
x-large |
xx-large |
|
| HTML |
1 |
|
2 |
3 |
4 |
5 |
6 |
7 |
Действительно, в различных браузерах результаты применения одинакового стиля сильно отличаются: проверить себя можно тут http://rotorweb.ru/typography/css-font-size-conversion-chart.html
| Условное обозначение |
Размер шрифта
в Firefox 3.6, Chrome, Safari 4, px |
Размер шрифта
в Opera 10, IE6,7,8, px |
| xx-small |
9 |
10 |
| small |
12 |
16 |
| large |
18 |
24 |
| xx-large |
32 |
48 |
Опубликовано Июнь 21, 2010 | автор: levik | Комментарий (1) »
Как наложить рисунок поверх флешки, чтобы перекрыть всю её или часть (в зависимости от размера рисунка)?
Размещение абсолютно позиционируемого div с фоновым рисунком и z-index:1000 по идее должно помочь. Ан нет - не так все просто. Флешка почему-то располагается поверх рисунка, хотя по z-index должно быть всё наоборот.
Как включить отображение прозрачности у флешки?
При вставке на страницу прозрачной флешки в местах, где должна быть прозрачность, отображается однородный фон. Почему не определяется прозрачность?
Немного теории
Оказывается, для объектов флеш в html определен параметр wmode, который задает режим внедрения элементов флеш в web-страницу. По умолчанию параметр wmode имеет значение window, который определяет наложение флешки поверх всего html. Таким образом, независимо от значения z-index и позиционирования элементов поверх флешки рисунок отображаться не будет.
Парамтер wmode может принимать и другие значения:
- opaque (англ. непрозрачный), аналогичен режиму window, но позволяет перекрывать флешку HTML-слоями, используя z-index. Как раз то, что нужно! Используем этот режимдля наложения рисунка поверх флешки - вопрос один.
- transparent (англ. прозрачный) в отношении позиционирования флеш-элементов похож на предыдущий - возможность размещения слоев HTML поверх флешки осталась. К тому же, фон флешки может быть прозрачным. Следует отметить, что при вставке флешки в режиме transparent возможно замедление работы браузера!
Переходим к практике
Задавать значения для wmode можно как атрибут для тега embed или object:
<object wmode="opaque" ... />
Либо через тег param:
<object>
<param name="wmode" value="opaque" />
...
</object>
Более подробно с описанием параметра wmode можно ознакомиться на сайте Adobe в разделе справочной системы по Flash.
Опубликовано Май 2, 2010 | автор: levik | Комментарий (1) »
Популярный видеохостинг YouTube.com добавил поддержку видео с использованием формата HTML 5. Основная особенность формата - видео можно просматривать в браузере без использования специальных плееров.
Однако, на сегодняшний день браузеров, которые поддерживают тэги формата HTML5 и видео кодек h.264 (используемый для кодирования видео на YouTube) не так много. Однако, среди них:
- Google Chrome (гугловый браузер смотрит, точнее показывает гугловое видео
)
- Apple Safari (от 4-ой версии и выше)
- Microsoft Internet Explorer с установленным Chrome Frame (тут можно скачать Chrome Frame)
Просмотреть, что из этого получается, можно по ссылке www.youtube.com/html5
Думаю, в скором времени список браузеров, позволяющих воспроизводить видео в формате HTML5 пополнится. Поддержку Flash-плеера пока никто убирать не собирается.
Опубликовано Январь 22, 2010 | автор: levik | Нет комментариев »