Доклад : Власть народу - относительные размеры шрифтов 


Полнотекстовый поиск по базе:

Главная >> Доклад >> Информатика, программирование


Власть народу - относительные размеры шрифтов




Власть народу - относительные размеры шрифтов

Bojan Mihelac

Относительные размеры шрифтов делают сайты более удобными для чтения - но польза от этого не велика, если посетители сайта не знают, как реально изменять размеры текста. В Internet Explorer, наиболее распространенном на данный момент браузере, эта возможность спрятана в одном из меню второго уровня, из-за чего изменение размера текста становится чересчур сложной задачей для многих пользователей. Эта задача намного упростится, если на страницах сайта присутствуют кнопки, позволяющие быстро изменить размер шрифта.

К сожалению, в большинстве вариантов таких кнопок игнорируются установки пользователя. В данной статье мы приводим решение, которое позволят менять размера текста, и при этом не вступает в противоречие с настройками пользователя.

CSS

В качестве первого шага создадим CSS-файл с основными стилями, в котором будут использоваться относительные размеры шрифтов в сочетании с размером шрифта, установленном на машине пользователя по-умолчанию. Для этого размеры мы будем задавать в процентах или в em-ах.

/* размер шрифта по-умолчанию */

@import url(small.css);

/* Совместимые с Netscape 4 размеры шрифтов */

body, div, p, th, td, li, dd {

font-family: Arial, Helvetica, sans-serif;

font-size: 11px;

}

H2 {

font-size: 130%;

font-weight: bold;

}

H3 {

font-size: 110%;

font-weight: bold;

}

Теперь создадим пять альтернативных стилей, где используются определенные в спецификации CSS абсолютные размеры: "xx-small", "x-small", "small", "medium", и "large". В любом браузере коэффициент масштабирования между ними должен быть 1.2, как это рекомендует стандарт CSS2. Также следует учесть и обойти проблемы масштабирования в IE5 и Opera (более подробно эта тема раскрыта в замечательной статье Тода Фарнера (Todd Fahrner) "Размер имеет значение").

/* пример файла xx-small.css */

body,

body div,

body p,

body th,

body td,

body li,

body dd {

font-size: xx-small;

voice-family: "\"}\"";

voice-family: inherit;

font-size: x-small

}

html>body,

html>body div,

html>body p,

html>body th,

html>body td,

html>body li,

html>body dd {

font-size: x-small

}

Получившиеся файлы можно посмотреть по данным ссылкам: xx-small.css, x-small.css, small.css, medium.css, large.css.

HTML

Теперь давайте создадим HTML-документ и подключим к нему основной и альтернативный CSS-файлы, присвоив альтернативным файлам имена "A--", "A-", "A", "A+" и "A++" в порядке возрастания.

<link rel="stylesheet" href="style.css"

type="text/css" />

<link rel="alternate stylesheet"

type="text/css" href="large.css" title="A++" />

<link rel="alternate stylesheet"

type="text/css" href="medium.css" title="A+" />

<link rel="alternate stylesheet"

type="text/css" href="small.css" title="A" />

<link rel="alternate stylesheet"

type="text/css" href="x-small.css" title="A-" />

<link rel="alternate stylesheet"

type="text/css" href="xx-small.css" title="A--" />

JavaScript

Теперь добавим в нашу HTML-страницу переключатель таблиц стилей, взятый из статьи "Alternative Style: Working With Alternate Style Sheets".

<script

language="JavaScript1.2"

src="styleswitcher.js"

type="text/javascript">

</script>

Сами кнопки реализуем вот так:

<form name="font_select" action="GET">

<input

type="button"

onclick="javascript:fontsizedown();"

value=" font - "/>

<input

type="button"

onclick="javascript:fontsizeup()"

value=" font + "/>

</form>

Вот исходный код переключателя стилей, а вот полностью рабочий пример, протестированный в Mozilla 1.6, Mozilla Firebird 0.7, Opera 7.11, IE 6 Windows, IE 5.2 Mac, и Safari 1.2. Вот и все.

Предупреждение

Не забывайте, в некоторых версиях IE есть баг, из-за которого он начинает странно себя вести, когда перед типом документа DOCTYPE идет декларация XML.

Список литературы

Для подготовки данной работы были использованы материалы с сайта http://www.webmascon.com/

Похожие работы:

  • Проверочный список для веб-стандартов

    Реферат >> Информатика, программирование
    ... com/blog/348/ Власть народу - относительные размеры шрифтов Размер шрифта пусть выбирают сами пользователи ... страницы при увеличении размера шрифта? Проведите простой тест ... есть функция изменения размера шрифта. Теперь увеличьте размер шрифта. Еще раз увеличьте ...
  • Насильственное переселение народов на территории Казахстана

    Дипломная работа >> История
    ... сегодня из депортированных народов относительно достаточно развитую историографию ... с правой стороны латинским шрифтом, а на левой ... , как в отношении размера оплаты труда, обеспечения ... практически неограниченной властью, лишив советский народ свобод, которые ...
  • Атлас Козельского района Калужской области

    Дипломная работа >> География
    ... построения карт, их относительной точности и богатству содержания ... атласы, например, карты народов и несколько карт с ... название раздела выделяется размером шрифта, его рисунок согласуется ... полномочий органов государственной власти и местного самоуправления ...
  • Менеджмент физической культуры и спорта (ФКиС)

    Учебное пособие >> Физкультура и спорт
    ... таблиц размер шрифта меняется на 12; - в шрифте «Courier New» размер шрифта ... власти, органы исполнительной власти субъектов ... воспитанию народов России средствами физической культуры и ... абсолютная и относительная ликвидность; - соотношение краткосрочных активов ...
  • Безопасность книгоиздания для детей

    Дипломная работа >> Журналистика
    ... бумага, шрифт, вес, формат и переплёт. Так, к примеру, размер шрифта оказывают ... знанием и информацией, относительность знаний вследствие их быстрого ... , представляющие интересы народа в структурах законодательной власти. Усовершенствование законодательства, ...
  • Анализ эффективности восприятия печатной рекламы с помощью двухкомпонентной методики оценки

    Курсовая работа >> Маркетинг
    ... политика в частности московских властей, направленная на сокращение ... размер используемого шрифта играет очень важную роль в создании эффекта. Часто относительно мелкий шрифт ... народу», скрывая холодное безличие и реакционность. Однако, такими шрифтами следует ...
  • Автоматизация бухгалтерского учета

    Реферат >> Бухгалтерский учет и аудит
    ... включая первичные. В условиях относительной неопределенности в налоговой сфере предприятие ... считается временем расцвета демок­ратии, т.е. власти народа. В это время все свободные ... выбрать гарниту­ру (начертание) шрифта, его размер и стиль (жирный, курсив ...
  • Оформление управленческих документов

    Курсовая работа >> Менеджмент
    ... разными шрифтами от 6 до 24 кегля. Размер шрифта выбирается ... лица, подписавшего документ, относительно самой длинной строки. ... характер, создаются органами власти, коммерческими и государственными ... изучения языка и фольклора народов Севера. ПРИКАЗЫВАЮ 2. ...
  • Основы делопроизводства

    Учебное пособие >> Бухгалтерский учет и аудит
    ... публиковаться на языках народов Российской Федерации. ... ПК используют определенный размер шрифта. Текст документа оформляют ... , подписавшего документ, относительно самой длинной строки, ... органов исполнительной власти и государственной власти, утвержденными ...
  • FrontPage

    Реферат >> Информатика, программирование
    ... …………………………………………………………………………………………….8 Изменение размера шрифта………………………………………………………………….9 Смена шрифта………………………………………………………………………………...9 Изменение ... В вашей власти расположить его каким ... стоит либо относительный URL изображения, ... , сколько народу не посетило ...