Выравнивание текста

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

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.

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

Для установки выравнивания текста обычно используется тег абзаца

с атрибутом align , который определяет способ выравнивания. Также блок текста допустимо выравнивать с помощью тега с аналогичным атрибутом align , как показано в табл. 2.

Табл. 2. Выравнивание текста с помощью параметра align

Код HTML	Описание
Текст	Добавляет новый абзац текста, по умолчанию выровненный по левому краю. Перед абзацем и после него автоматически добавляются небольшие вертикальные отступы.
Текст	Выравнивание по центру.
Текст	Выравнивание по левому краю.
Текст	Выравнивание по правому краю.
Текст	Выравнивание по ширине.
Текст	Отключает автоматический перенос строк, даже если текст шире окна браузера.
Текст	Разрешает браузеру делать перенос строки в указанном месте, даже если используется тег .
Текст	Выравнивание по центру.
Текст	Выравнивание по левому краю.
Текст	Выравнивание по правому краю.
Текст	Выравнивание по ширине.

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

Отличие между абзацем (тег

) и тегом в том, что в начале и конце параграфа появляется вертикальный отступ, чего нет в случае использования тега .

Атрибут align достаточно универсален и может применяться не только к основному тексту, но и к заголовкам вроде . В примере 1 показано, как в подобном случае устанавливать выравнивание.

Пример 1. Выравнивание текста

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





 
Метод дихотомии
 
Делим пустыню на две половины. В одной части - лев, в другой его нет. Берем ту половину, в которой находится лев, и снова делим ее пополам. Так повторяем до тех пор, пока лев не окажется пойман.
  

Результат примера показан на рис. 1.

Рис. 1. Выравнивание текста по правому и левому краю

В данном примере выравнивание заголовка происходит по центру окна браузера, выделенного абзаца по правому краю, а основного текста — по левому краю.

Единый форум поддержки

Вы здесь » Единый форум поддержки » Корзина » Как сделать чтоб правила были не сплошным текстом а в столбик?

Как сделать чтоб правила были не сплошным текстом а в столбик?

Страница: 1

Сообщений 1 страница 9 из 9

Поделиться1Вс, 19 Дек 2010 02:13:30

• Автор: спирит
• Заслуженный
• Зарегистрирован : Сб, 29 Мар 2008
• Сообщений: 7
• Уважение: +1
• Позитив: 0
• Последний визит:
  Пн, 20 Дек 2010 16:24:23

Как сделать чтоб правила форума были не сплошным текстом а в столбик? или по какий-то другой структуре?

Поделиться2Вс, 19 Дек 2010 02:19:52

• Автор: rps
• Стремясь к новому.
• Зарегистрирован : Вс, 12 Окт 2008
• Сообщений: 22652
• Уважение: +4738
• Позитив: +3431
• Пол: Мужской
• Предупреждения: ‡ 1. 2. 3. . 10!
• Последний визит:
  Вс, 14 Мар 2021 21:42:57

спирит
Здравствуйте.

спирит написал(а):

Как сделать чтоб правила форума были не сплошным текстом а в столбик? или по какий-то другой структуре?

Необходимо использовать ХТМЛ для форматирования. Например
для переноса на новую строку.

Поделиться3Вс, 19 Дек 2010 12:55:39

• Автор: спирит
• Заслуженный
• Зарегистрирован : Сб, 29 Мар 2008
• Сообщений: 7
• Уважение: +1
• Позитив: 0
• Последний визит:
  Пн, 20 Дек 2010 16:24:23

а можно еще коды для выделения жирным шрифтом?

Поделиться4Вс, 19 Дек 2010 13:01:24

• Автор: rps
• Стремясь к новому.
• Зарегистрирован : Вс, 12 Окт 2008
• Сообщений: 22652
• Уважение: +4738
• Позитив: +3431
• Пол: Мужской
• Предупреждения: ‡ 1. 2. 3. . 10!
• Последний визит:
  Вс, 14 Мар 2021 21:42:57

спирит
Не совсем.

Код:

Текст 1 
Текст 2 
Текст 3 
Текст 4.

Поделиться5Вс, 19 Дек 2010 13:37:45

• Автор: Deff
• Тутошний.
• Зарегистрирован : Ср, 16 Июн 2010
• Сообщений: 50849
• Уважение: +15030
• Позитив: +11302
• Последний визит:
  Сегодня 00:34:26

спирит написал(а):

а можно еще коды для выделения жирным шрифтом?

Отредактировано Deff (Вс, 19 Дек 2010 13:38:21)

Поделиться6Пн, 20 Дек 2010 16:10:12

• Автор: спирит
• Заслуженный
• Зарегистрирован : Сб, 29 Мар 2008
• Сообщений: 7
• Уважение: +1
• Позитив: 0
• Последний визит:
  Пн, 20 Дек 2010 16:24:23

Поделиться7Пн, 20 Дек 2010 16:19:22

• Автор: спирит
• Заслуженный
• Зарегистрирован : Сб, 29 Мар 2008
• Сообщений: 7
• Уважение: +1
• Позитив: 0
• Последний визит:
  Пн, 20 Дек 2010 16:24:23

а можно еще подчеркивание и цвет?

Поделиться8Пн, 20 Дек 2010 16:41:15

• Автор: Deff
• Тутошний.
• Зарегистрирован : Ср, 16 Июн 2010
• Сообщений: 50849
• Уважение: +15030
• Позитив: +11302
• Последний визит:
  Сегодня 00:34:26

спирит написал(а):

а можно еще подчеркивание и цвет?

Напишите и красиво оформите правила в своём топике на форуме (*с цветом форматированием и т.д )> тема должна быть открыта для просмотра гостем — и выложите ссылку на эту страничку тут — я дам вам код этого отформатированного документа

Вертикальный текст в html

Когда я делал карту сайта, захотелось отобразить заголовки категорий вертикально. Но ни html, css пока сделать такого не позволяют. Хотя нет, css позволяет задать порядок расположения слов для языков, у которых порядок написания справа налево и сверху вниз (китайский например), но для кирилицы это не пойдет.
Как еще можно сделать текст вертикальным? Можно обрезать слово по буквам и разместить их в столбик. Можно применить javascript.
Есть еще один способ — создать картинку на лету из svg.
SVG (Scalable Vector Graphics) — это язык разметки масштабируемой векторной графики. При помощи него можно создавать на лету разные изображения, что я и использовал.
Делается это вот так:

3.33 avg. rating (70% score) — 3 votes

11 комментариев

[…] пришлось немного повозиться. И еще один – это вывод вертикально написанного текста. Это, конечно, не текст а картинка, но все равно, при […]

• Сентябрь 24, 2009 10:40 ДП
• By Alex Volkov » Архив » Карта сайта – какая у вас?

Вертикальный текст в html… Thank you for submitting this cool story — Trackback from progg.ru…

• Сентябрь 24, 2009 10:47 ДП
• By progg.ru

крякозябры в хроме показывает

• Сентябрь 24, 2009 10:08 ПП
• By Boroda

Кракозябры у меня в блоге показывает или когда себе копируешь и смотришь?

• Сентябрь 24, 2009 11:54 ПП
• By Alex Volkov

[…] дядька показал как сделать вертикальный текст html, но он почему то в виде крякозябр, надеюсь он ответит […]

• Сентябрь 24, 2009 10:12 ПП
• By В поисках вдохновения и необычного « Митрич Борода – уютный бложик на wordpress

[…] Волков рассказал как сделать вертикальный текст в html. Рекомендую подписаться на его блог, таких […]

• Сентябрь 25, 2009 5:19 ПП
• By Интересно почитать – часть 10 | Блог Терехова — продвижение сайтов, ведение блогов, заработок в интернет

у тебя в блоге, в фф все ок, вообщем с хромом эта фича не работает

• Сентябрь 25, 2009 7:55 ПП
• By Boroda

Ну, под линупс хрома нет, поэтому посмотреть не могу.

• Сентябрь 25, 2009 9:11 ПП
• By Alex Volkov

[…] полезный пример спасибо alexvolkov! 5. Для того что бы поисковики не индексировали ваши JS, […]

• Октябрь 02, 2009 8:44 ДП
• By Хозяйке на заметку — elz.su -Web 2.0 на марше

Вот они крякозябры в Хроме: http://clip2net.com/clip/m9343/1256840379-clip-4kb.png
А вообще вот как это делается с помощью css http://habrahabr.ru/blogs/css/58732/

• Октябрь 29, 2009 9:22 ПП
• By Search Bot

Незнаю, где там css, в статье написано что при помощи php, хотя метод используется один в один описанный тут.

• Октябрь 30, 2009 10:23 ДП
• By Alex Volkov

Об авторе

Меня зовут Волков Александр, я занимаюсь программированием под веб на PHP .

Также мне приходится админить сервера, любится с unix-like системами, всячески издеваться над вордпрессом и заниматься всякой фигней, о чем я и пишу сюда.

связаться со мной можно по почте alexvolkov.ru@gmail.com

Поискать-с

Также ищут

• html вертикальный текст
• вертикальный текст html
• вертикальный текст в html
• html вертикальный текст в таблице
• html текст вертикально
• вертикальный текст в таблице html
• Вертикальный текст
• вертикальный текст css
• как сделать вертикальный текст в html
• как сделать текст в столбик в html

HTML Что делать если текст пишется в столбик?

Текст пишется вот так: А должно в строку! Что делать?

Отслеживать
7,722 13 13 золотых знаков 25 25 серебряных знаков 54 54 бронзовых знака
задан 2 июн 2022 в 9:23
Tefetid May Tefetid May

1. Например расширение экрана маленькое. 2. Смотрите стили через панель разработчика. Наверняка что-то где-то переопределено

2 июн 2022 в 9:25

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

2 июн 2022 в 9:26

2 ответа 2

Сортировка: Сброс на вариант по умолчанию

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

Отслеживать
ответ дан 2 июн 2022 в 9:27
Алексей Шиманский Алексей Шиманский
71.2k 12 12 золотых знаков 91 91 серебряный знак 180 180 бронзовых знаков
Я не уверен, что такой вопрос-ответ имеет пользу для базы знаний.
2 июн 2022 в 9:51
Я не уверен вообще, что жизнь имеет какую-то пользу 😀
2 июн 2022 в 9:55

У класса nav пропущены кавычки nav >

Отслеживать
ответ дан 2 июн 2022 в 10:40
27 5 5 бронзовых знаков
Их можно не писать уже несколько лет как
2 июн 2022 в 10:42
@АлексейШиманский, их всегда можно было не писать, если нет пробелов и не xml
2 июн 2022 в 10:45
@Grundy ну я ж говорю несколько лет 😀
2 июн 2022 в 10:53

Важное на Мете

Похожие

Подписаться на ленту

Лента вопроса

Для подписки на ленту скопируйте и вставьте эту ссылку в вашу программу для чтения RSS.

Дизайн сайта / логотип © 2023 Stack Exchange Inc; пользовательские материалы лицензированы в соответствии с CC BY-SA . rev 2023.11.15.1019

Нажимая «Принять все файлы cookie» вы соглашаетесь, что Stack Exchange может хранить файлы cookie на вашем устройстве и раскрывать информацию в соответствии с нашей Политикой в отношении файлов cookie.