Межстрочный интервал html тег. Что такое межстрочный интервал

Чтобы изменить расстояние между строками в HTML , вам не нужно забивать шпоны. Вам нужно всего лишь к объекту, в котором вы хотите это расстояние отрегулировать, например, к абзацу текста (тег ) или к блочному элементу (

), применить CSS-свойство line-height . Свойство может применяться ко всем тегам HTML .

Значение у line-height можно задавать в процентах, множителем, единицами измерения (пиксели (px), пункты (pt), пайки (pc) и т.д.), а также оно может принимать значение normal и inherit.

При normal расстояние между строками вычисляется браузером автоматически по своим соображениям, при inherit - наследуется значение родительского элемента, т.е. тега, в который данный тег вложен.

Черкнем несколько строк на HTML.

Вот так выглядит в браузере расстояние между строками в абзаце со значением 1 (т.е. одинарный интерлиньяж) и 70% у заголовка (заметьте что при расчете в % за 100% берется высота шрифта):

Если мы зададим line-height для тега

, окутывающего и заголовок, и абзац, а у них, соответственно, это свойство уберем, то получится:

Если мы поставим line-height = 0.4, получится экспонат отрицательного интерлиньяжа:

Зачем же вообще с расстоянием между строками что-то делают? Из-за вредности? От нечего делать?

Правильно подобранное расстояние между строками может повысить читабельность текста, а это очень важный аспект в веб-дизайне, в книгопечатании и во всем, что связано с текстом. Согласитесь, что когда мы во втором примере увеличили расстояние между строками, текст стало приятнее читать, не так ли? Но это совсем не значит, что чем больше интерлиньяж, тем выше удобочитаемость текста. После какого-то определенного момента строки начинают слишком далеко стоять друг от друга, глазу становится труднее переходить от одной к другой, и при чтении возникает дискомфорт. Помните о золотой середине.

Интерлиньяж

Множество людей, включая дизайнеров, думают, что типографика – это только выбор гарнитуры, размера шрифта и того, должен ли он быть нормальным или полужирным. Для большинства людей на этом все и заканчивается. Но для получения хорошей типографики нужно гораздо больше и как правило это детали, которые дизайнеры часто игнорируют.
Эти детали дают дизайнеру полный контроль, позволяет ему создавать прекрасные и последовательные с точки зрения типографики решения в дизайне. Хотя все это применимо для различных типов носителей, в этой статье мы сосредоточимся на том, как их применить к веб-дизайну с использованием CSS. Вот 8 простых путей с помощью CSS улучшить типографику и, следовательно, общее удобство дизайна.

1. Размеры

Размер наборной строки. Для глаза читателя, длинные или короткие строки утомительны. Длинные – разрушают ритм, так как читателю трудно найти следующую строку текста. Единственная ситуация, в которой приемлемы короткие строки – малое количество текста. Для наилучшей читабельности длина строки должна быть между 40 и 80 символами, включая пробелы. Для дизайна с одной колонки текста 65 символов – идеальны.

Простой способ вычислить длину строки – использовать метод Роберта Брингхарста (Robert Bringhurst’s), который умножает размер шрифта на 30. То есть, если размер шрифта 10px, умножая его на 30 получим 300px или, приблизительно, 65 символов в строке. Код будет выглядеть приблизительно как:
p {
font-size: 10px;
max-width: 300px;
}
Я использую px так как это значительно упрощает расчеты, но можно использовать и em.

2. Интерлиньяж

Интерлиньяж это пространство между строками текста в теле заметки и оно играет большую роль для читабельности. Правильное разделение строк, позволяет читателю проще следить за строкой и улучшает внешний вид текста. Интерлиньяж так же изменяет типографический цвет текста, который является плотностью или же тоном композиции.
На интерлиньяж влияет множество факторов: гарнитура, размер шрифта, его полнота, обстоятельства(?) , длина строки, расстояние между словами и т.д. Чем длиннее строка, тем больше интерлиньяж. Чем больше размер шрифта, тем меньше интерлиньяж. Хорошее правило – устанавливать интерлиньяж на 2-5pt больше, чем размер шрифта , в зависимости от гарнитуры. Так что если шрифт 12pt, то для веб интерлиньяж должен быть в 15pt или 16pt.

Определение верного интерлиньяжа требует определенной ловкости, но ниже приведен пример того, на что должен быть похож ваш код:
body {

font-size: 12px;
line-height: 16px;
}

3. Обработка кавычек

Обработка кавычек должна проводиться на полях текста. Если кавычки сливаются с текстом, то они разрывают левое поле и нарушают рифму блока текста. Обработка кавычек не нарушает выравнивания по левому краю и баланса и поэтому – улучшает читабельность.

Это легко достигается с помощью CSS, используя элемент blockquote:
blockquote {
text-indent: -0.8em;
font-size: 12px;
}

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

4. Вертикальный ритм

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

Для того что бы поддерживать вертикальный ритм с помощью CSS, нужно, что бы расстояние между элементами и межстрочное расстояние (интерлиньяж) был равен размеру сетки базовых линий. Допустим, вы используете 15px сетку базовых линий , подразумевая, что между каждой линией сетки 15px. Интерлиньяж будет 15px и расстояние между параграфами тоже будет 15px. Вот пример:
body {
font-family: Helvetica, sans-serif;
font-size: 12px;
line-height: 15px;
}

P {
margin-bottom: 15px;
}

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

5. Верхние и нижние висячие строки

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

К несчастью, нет простого способа предотвратить висячие строки с помощью CSS. Один из способов от них избавится был описан выше, еще один - jQWidon’t , плагин для jQuery, который размещает неразрывные пробелы между последними двумя словами элемента.

6. Выделение

Важно выделять слова не отвлекая читателя . Курсивное начертание часто рассматривается как идеальная форма выделения. Некоторые другие распространенные формы выделения: полужирное начертание, заглавные буквы, капитель, размер шрифта, цвет, подчеркивание или другая гарнитура. Не важно, какой вы воспользуетесь, постарайтесь использовать только одну. Такие комбинации как капитель – полужирное – курсивное начертание отвлекают и смотрятся неуклюже.

Вот несколько способов выделения с помощью CSS:
span {
font-style: italic;
}

H1 {
font-weight: bold;
}

H2 {
text-transform: uppercase;
}

B {
font-variant: small-caps;
}
Имейте в виду, что font-variant работает только в случае, если шрифт поддерживает капитель.

Чтобы уменьшить междустрочные интервалы, в ворде имеется масса функциональных возможностей. Используйте их, и «расчешите» свой текстовый документ.

При работе с текстовыми документами большого объема может возникать много мелких помарок, которые затем портят внешний вид текста. Чтобы это исправить, может потребоваться узнать, как уменьшить расстояние между строк. Это неложная процедура, выполнить которую в ворд 2007 и 2010 сможет даже человек, мало разбирающийся в форматировании текста.

Способы удаления интервалов

Сначала посмотрите, не установлен ли между строчками лишний символ абзаца. Чтобы проверить это, есть два варианта: визуальный или программный.

  1. С первым все понятно – вам нужно просто посмотреть, нет ли где лишнего абзаца;
  2. В случае с программным вариантом подразумевается использование встроенной функции Ворда. Она может показать знаки, которые в обычном тексте не видны. О ней поговорим подробнее.

Функция неотображаемых символов

Неодинаковые интервалы между строками и абзацами лучше всего удалять с использованием данного средства диагностики. Это ускоряет время редактирования текста в ворде 2007 и ворде 2010.

Чтобы найти интервалы, на панели управления на вкладке «Главная» найдите раздел «Абзац». Затем нажмите кнопку с таким значком «¶». Это значок отображаемых символов. Активировав функцию, вы увидите, как между пробелами появилась точка. Будут видны и другие символы, в том числе знаки абзаца. Это очень полезная опция. Она не меняет текст в печатном формате, зато позволяет более тщательно изучить текст перед отправкой на печать.

Если расстояние между строк слишком большое, возможно, между ними стоят интервалы. Откройте вкладку «Главная» и в меню «Стили» установите значение «Без интервалов». Если данная опция не видна, значит, она не отображается на панели задач. Чтобы ее открыть, щелкните по кнопке со стрелкой и выберите необходимый пункт.

Если необходимо уменьшить расстояние между строками в середине абзаца, выделите необходимый фрагмент. Чтобы сделать это, не обязательно использовать левую клавишу мыши, как многие привыкли. Достаточно удерживать клавишу «Shift» и передвигать курсор стрелками «вправо»/«влево». Если необходимо выделить весь текст, на вкладке «Главная» откройте меню «Редактирование» и щелкните по кнопке «Выделить все».

Выделив необходимый фрагмент на вкладке «Разметка страницы», выберите пункт с маленьким значком стрелки. Можно сделать по-другому: кликнуть правой клавишей мышки по тексту и из открывшегося меню выбрать раздел «Абзац» (это можно сделать в любой из версий ворда: 2003, 2007, 2010).

Появится окно, в котором перейдите в пункт «Отступы и интервалы». В пункте «Интервал» укажите нужный тип интервала (одинарный, минимум). Можно также выбрать режим «множитель» или «точно», тогда необходимо будет указать значение. Для ввода значения используйте функциональные кнопки «вверх»/ «вниз» прямо в окне или введите его с помощью клавиатуры. Для применения настроек нажмите «ОК». Теперь расстояние между строками будет везде одинаковым.

Описание интервалов

При работе с межстрочным интервалом в ворде 2007 и 2010 вам могут пригодиться следующие знания:

  • «Одинарный» интервал аналогичен самому большому шрифту, который был использован в выделенном фрагменте текста;
  • «Полуторный» – это расстояние, которое превосходит предыдущий интервал в полтора раза;
  • «Двойной» – соответственно, превышает показатели одинарного интервала в 2 раза. То есть, размер шрифта будет в два раза больше, чем максимальный шрифт в выделенном фрагменте;
  • «Минимум» – это минимальное значение. В интервале остается столько места, чтобы в нем могла поместиться буква, соответствующая шрифту в тексте;
  • «Точно» – вы можете сами настроить значение интервала;
  • «Множитель» – данное расстояние пропорционально определенному коэффициенту. В соответствии с ним интервал будет уменьшаться или увеличиваться. Например, если вы задали множитель 1,4, то расстояние между строк увеличится на 40%.

Удаление интервалов между строк в ворде 2007 и 2010 – рутиная процедура, выполнить которую может даже человек, только что установивший Ворд на свой компьютер. Используя настройку интервалов, вы быстро отредактируете документ в соответствии со своими потребностями. А при помощи функции неотображаемых символов вы сможете уменьшить расстояния между строк.

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

Лишние абзацы

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

Чтобы сократить время на поиски данных нюансов, можно воспользоваться визуализацией Эта функция активируется при нажатии на значок, который находится на панели инструментов. Располагается она во вкладке "Главная" и обозначается значком «¶». Нажав ее, вы сможете увидеть все Абзац в этом случае отображается также символом «¶».

Теперь вам остается лишь найти лишние абзацы и удалить их. Это был первый способ, но не последний, поэтому переходим ко второму.

Проблема с интервалом

Следующий способ, как уменьшить - это изменение стиля на стиль "Без интервалов". Однако данный способ рекомендуется использовать лишь в том случае, если промежуток очень большой и ярко выраженный. Дело в том, что такой способ может в корне изменить все форматирование вашего документа, тем самым испортив работу.

Итак, для того чтобы убрать большие интервалы между строк, вам необходимо перейти во вкладку "Главная" и там найти раздел, который называется "Стили". В ней необходимо выбрать стиль "Без интервалов". При отстутствии его на панели, разверните раздел соответствующей кнопкой.

Если у вас последняя версия "Ворда", то данные манипуляции необходимо проделывать во вкладке "Дизайн", в разделе "Форматирование документа". Инструмент называется "Интервал между абзацами".

Проводим полную настройку: открываем "Абзац"

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

Для начала вам нужно выделить ту область текста, которую вы собираетесь изменять. После этого войдите во вкладку "Главная", а в ней, в разделе "Абзац", нажмите на пиктограмму со стрелочкой, направленной в правый нижний угол. Сама пиктограмма расположена в правом нижнем углу раздела.

Проводим полную настройку: выставляем значение

Как только вы это сделаете, перед вами появится окно настроек "Абзац". В нем сразу обратите внимание на раздел "Интервал". Именно в нем и проводятся все нужные нам настройки. Вы можете изменить интервал между абзацами и между строк самого абзаца. Чтобы выполнить первое, используйте счетчик рядом со словами "Перед:" и "После:".

В том случае, когда вы хотите полностью убрать интервал, ставьте "0". Если же вы хотите убрать интервал между самими строками, то используйте выпадающий список справа. Вы можете использовать пресеты (одинарный, 1,5 строки, двойной, минимум, точно и множитель) или же ввести значение вручную в поле "значение:".

Вот вы и прошли, так сказать, в Word обучение по теме, как уменьшать интервал между строк.

При чем мы разберем с вами свойства, которые помогут форматировать не только интервалы между строками текста, а еще и расстояние между ячейками таблиц. А теперь давайте приступим к самому интересному!

Поднимем руки над клавиатурой и да раздвинем строки!

На всякий случай начну главу с пояснения «что такое межстрочный интервал».

Расстояние между строками в параграфе называется межстрочным интервалом. Также иногда используют и современный термин – интерлиньяж.

Для форматирования данного параметра каскадными стилевыми таблицами нужно знать всего лишь одно свойство – line-height .

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

line-height предусматривает два встроенных ключевых слова:

  • normal – вычисление расстояния между строками абзацев происходит автоматически;
  • inherit – наследуется форматирование объекта-родителя.

Помимо этого, можно самим устанавливать размер отступов. В свойстве поддерживаются любые существующие в css единицы измерений. Таким образом, вы можете указать интервал в процентах, пунктах, пикселах, em-ах и других.

Однако обычно указывается просто тип отступа в виде цифры. Например, line-height: 1.5 ; оповещает , что в контенте выбран полуторный межстрочный интервал.

Думаю, особо любопытные задались вопросом: «Как же работает такой механизм?». Ответ очень прост: при помощи умножения. Интерлиньяж устанавливается, начиная от базовой линии. Если значение свойства указывается цифрой, то она распознается как множитель, на который и идет умножение базового значения.

А теперь хочу привести небольшой пример. При помощи я создал заголовок и обычный нумерованный список.

Пример 1

А теперь пришло время таблиц!

Для таблиц также можно использовать свойство css line- height . Оно задаст интервал в ячейках между строками текста. Однако в некоторых случаях нужно двигать именно ячейки, а не контент.

Для реализации такого приема существует свойство border-spacing . Этот элемент работает только в том случае, если в другом табличном свойстве border-collapse указано раздельное отображение ячеек таблицы (border-collapse: separate ), т.е. двойная линия не убирается.

Почему так происходит? border-spacing устанавливает расстояние от контента до границ элемента таблицы. По умолчанию рамка задается для каждого элемента своя. Если же используется свойство border-collapse: collapse , то происходит следующее: браузер анализирует табличное представление и удаляет двойные линии.

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

У свойства border-spacing нет ключевых слов, поэтому значения указываются в виде единиц измерения. Можно установить как одно значение, так и два. Во втором случае первый параметр определит интервал по горизонтали, второй – по вертикали.

Перейдем к практике. Информацию из предыдущего примера занесем в таблицу.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 Пример 2

Глобализация

Позитивные аспекты глобализацииУсиление и стимулирование свободной конкуренции для активного развития технологий;
Мировое разделение труда, которое способствует равномерному распределению важных ресурсов;
Повышение уровня жизни человечества.

Пример 2

Глобализация

Позитивные аспекты глобализацииУсиление и стимулирование свободной конкуренции для активного развития технологий;
Мировое разделение труда, которое способствует равномерному распределению важных ресурсов;
Повышение уровня жизни человечества.

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

Понимание термина «межстрочный интервал» дает представление о том, как максимально уменьшить расстояние между строчками в без ущерба для читабельности текста.

В случаях, когда эта величина не задана в критериях по оформлению, на него не обращают внимания, хотя эта величина помогает сэкономить место при печати.

Что такое межстрочный интервал

Значение интервала зависит от используемого шрифта, так как стандартная ширина строки по этому кеглю берется за 1. Соответственно, расстояние между строками будет примерно равно величине большинства букв.

Сам интервал считается от середины строки по вертикали, что необходимо учитывать при изменении интервала в меньшую сторону. Если взять слишком маленькое значение, то строчки будут наезжать друг на друга: верхняя часть большинства буков будет «съедаться» верхней строкой.

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

Зачем уменьшать расстояние между строками

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

По умолчанию в Microsoft Word стоит значение 1 или 1,5, поэтому данное знание этого, поможет придерживаться критериев оформления, которые не всегда совпадают со стандартными настройками на вашем компьютере.

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

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

Для изменения расстояния между строками для версий Ворда 2007 и моложе, необходимо на главной закладке выбрать значок «Интервалов», который находит в подразделе «Абзац» и выглядит как две стрелки, направленный вверх и вниз.

Сделать интервал меньше 1 можно только в разделе «Другие варианты интервалов». При выборе этого поля выпадает следующее окно, где необходимо менять значения множителя.

В окне «Образец» можно будет сразу увидеть, как будет выглядеть текст после изменения. Значения множителя указываются любые. Их можно как прописывать вручную, так и выбирать с помощью стрелочек «вверх-вниз» возле клетки «Значение».

Но во втором случае нет возможности выбрать значения меньше 1. Обратите внимание, что выбрать необходимо именно «Множитель ». Данная категория подразумевает, что изначальная ширина расстояния между строк (к примеру, 11 пт) будет умножаться на указанное значение.

При умножении на значение меньше 1, общий параметр уменьшается, сокращая расстояние. Минимальное значение, которое можно внести в графу – 0,01. Стоит отметить, что уже при интервале в 0,2-0,3 текст невозможно разобрать.

Кроме строки «Множитель» можно использовать «Минимум». Хитрость этой графы в том, что вместо стандартного кегля, измеряемого в пт (пунктах), можно задать значение для интервала в сантиметрах и миллиметрах.

В таком случае расстояние между строками будет одинаковым даже при смене шрифта. Для того, чтобы изменить пункт на сантиметры или миллиметры, необходимо в строке значение удалить «пт» и через пробел после цифры написать сокращение см или мм.

Строки «Одинарный», «Двойной» и «Полуторный» зададут соответственно интервал 1, 2 и 1,5. Строка «Точно» укажет величину шрифта, которая и будет равна значению 1 для межстрочного интервала.

В этой строке также можно изменить эту величину, но только в пунктах. Можно вручную рассчитать это расстояние. 1 пункт приблизительно равен 0,35-0,37мм в зависимости от страны. В США использует не унифицированную система метрических измерений, поэтому пункты приравниваются к 1/72 дюйма.

Аналогичное меню можно открыть не только из командной строки, расположенной в шапке открытого текстового редкатора. Есть также более быстрый способ при использовании контекстного меню.

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

Как изменить интервал в более старых версиях Ворда

В версии Ворда 2003 интерфейс программы немного отличается, что может затруднить поиск необходимого раздела. Однако соответствующие значения все также находятся в подразделе «Абзац». Найти этот подраздел можно:

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