русс | укр

Языки программирования

ПаскальСиАссемблерJavaMatlabPhpHtmlJavaScriptCSSC#DelphiТурбо Пролог

Компьютерные сетиСистемное программное обеспечениеИнформационные технологииПрограммирование

Все о программировании


Linux Unix Алгоритмические языки Аналоговые и гибридные вычислительные устройства Архитектура микроконтроллеров Введение в разработку распределенных информационных систем Введение в численные методы Дискретная математика Информационное обслуживание пользователей Информация и моделирование в управлении производством Компьютерная графика Математическое и компьютерное моделирование Моделирование Нейрокомпьютеры Проектирование программ диагностики компьютерных систем и сетей Проектирование системных программ Системы счисления Теория статистики Теория оптимизации Уроки AutoCAD 3D Уроки базы данных Access Уроки Orcad Цифровые автоматы Шпаргалки по компьютеру Шпаргалки по программированию Экспертные системы Элементы теории информации

Как же задавать размер шрифта?


Дата добавления: 2013-12-24; просмотров: 1390; Нарушение авторских прав


Размеры шрифтов

Существует четыре способа того, как задать размер шрифта:

  • В пикселах, например,

body {

font-size: 14px;

}

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

  • В процентах, например,

font-size: 150%;

Размер шрифта, заданный в процентах, определяет высоту шрифта относительно других шрифтов.

body {

font-size: 14px;

h1 {

font-size: 150%;

}

c.369

Учитывая, что font-sizeнаследуемое свойство, при задании размера таким способом проценты будут вычисляться относительно размера шрифта родительского элемента.h1 наследует свойства body, поэтому размер его шрифта будет 150% от размера шрифта элемента <body>.

  • В относительных единицах em.С помощьюem вы задаете масштабный коэффициент.

font-size: 1.2em; (Это означает, что размер шрифта будет масштабирован с коэффициентом 1.2)

Допустим, вы таким образом задаете размер заголовков <h2>. Тогда размер заголовков <h2> будет составлять 1.2 размера шрифта родительского элемента, что в нашем случае означает в 1.2 раза больше, чем 14рх, и примерно равняется 17рх.

  • По ключевым словам. Вы можете определить размер шрифта как xx-small, x-small, small, medium, large, x-large, xx-large, и браузер преобразует эти слова в значения в пикселах.

Обычно размеры шрифтов, которые задаются различными ключевыми словами, соотносятся друг с другом таким образом. Каждый следующий размер примерно на 20% больше предыдущего, а small обычно равен 12 пикселов в высоту. Тем не менее не забывайте, что ключевые слова не всегда одинаково определяются в различных браузерах и пользователи при желании могут их переопределить.

body {

font-size: small;

}

В большинстве браузеров это правило задает размер шрифта в элементе body равным примерно 12 пикселов.



 

Придерживайтесь следующих рекомендаций при определении размера шрифта.

  1. Выберите ключевое слово (рекомендуется small или medium) и укажите его в качестве размера шрифта в правиле для body. Таким образом вы зададите размер шрифта, используемый на вашей странице по умолчанию.
  2. Задайте размеры шрифтов для остальных элементов относительно размера шрифта элемента body, используя либо проценты, либо em (выбор за вами, так как это по сути это два разных способа выполнения одного и того же действия).

Задав размеры шрифтов относительно размера шрифта элемента body, вы действительно легко сможете поменять их на всей веб-странице, просто изменив высоту шрифта для body. Если значение размера шрифта для body равняется small, просто поменяйте его на medium, и размеры шрифтов для всех остальных элементов автоматически пропорционально увеличатся, потому что они заданы относительно размера шрифта элемента body. Кроме того, в таком случае ваши пользователи и сами смогут изменить размер шрифтов на странице.

 

Внимание! Internet Explorer НЕ поддерживает масштабирование текста, если размер шрифта задан в пикселах.

 



<== предыдущая лекция | следующая лекция ==>
Семейства шрифтов | Цвет в CSS


Карта сайта Карта сайта укр


Уроки php mysql Программирование

Онлайн система счисления Калькулятор онлайн обычный Инженерный калькулятор онлайн Замена русских букв на английские для вебмастеров Замена русских букв на английские

Аппаратное и программное обеспечение Графика и компьютерная сфера Интегрированная геоинформационная система Интернет Компьютер Комплектующие компьютера Лекции Методы и средства измерений неэлектрических величин Обслуживание компьютерных и периферийных устройств Операционные системы Параллельное программирование Проектирование электронных средств Периферийные устройства Полезные ресурсы для программистов Программы для программистов Статьи для программистов Cтруктура и организация данных


 


Не нашли то, что искали? Google вам в помощь!

 
 

© life-prog.ru При использовании материалов прямая ссылка на сайт обязательна.

Генерация страницы за: 0.177 сек.