Выравнивание текста по ширине страницы CSS
|
|
Kosten |
Вторник, 15 Января 2019, 21:57 | Сообщение 1 |
|
Иногда нам нужно сделать так, чтоб контент на странице не занимал заданное место по умолчанию. А сделать так, чтоб по обеем сторонам были пролеты, и как пример, это занятость на 80% и не более. Но главное сделать так, чтоб заголовок стоял стандартно, а само описание выровнялось по центру, чтоб по сторонам были ровные отступы.
Вообщем чтоб понять сам дизайн, то вид на изображение так выглядит.

HTML
Код <div> <h1>ZorNet - портал для вебмастера</h1> <p> Здесь идет описание. </p> </div>
CSS
Код h1, p {margin: 0 auto; width: 65%} h1 {padding-bottom: 17px;} p {padding-bottom: 15px;}
Вы сами можете самостоятельно задавать ширину.
Демонстрация
|
[ RU ] |
|
|
Kosten |
Среда, 16 Января 2019, 15:26 | Сообщение 2 |
|
Если вам нужно автоматически выровнять описание по сторонам, это на странице или в блоке, чтоб был пробел по обеим сторонам, то нужно прописать стиль.
Выравниваем текст одновременно по правому и левому краю
CSS
Код p { text-align: justify; }
Сам текст размещаем.
Код <p>Здесь идет описание.</p>
На этом все.
Демонстрация
|
[ RU ] |
|
|
iHarD |
Среда, 16 Января 2019, 22:36 | Сообщение 3 |
|
Свойство padding позволяет задать величину поля сразу для всех сторон элемента, если использовать его так: padding: [значение px или проценты] , к примеру
Код padding: 20px; /* 20px - отступы */
В итоге, не нужно прописывать bottom и так далее, можно сразу сделать со всех сторон, если нужно :) Так же, элементы можно двигать при помощи: margin, указав значение, к примеру margin-top, margin-bottom и другие. Тогда, можно выравнивать еще и элементы, однако с этим нужно быть аккуратней на адаптивных сайтах)
Бывший модератор форума uCoz, первый модератор сервиса вопрос/ответов uCoz. Разрабатываю сайты!)
|
[ RU ] |
|
|
Kosten |
Четверг, 17 Января 2019, 01:49 | Сообщение 4 |
|
Цитата iHarD (  ) аккуратней на адаптивных сайтах Если все выставлять на процентах, то по идее на адаптивность не должно повлиять.
|
[ RU ] |
|
|
iHarD |
Четверг, 17 Января 2019, 16:32 | Сообщение 5 |
|
Цитата Kosten (  ) Если все выставлять на процентах, то по идее на адаптивность не должно повлиять.
Тут зависит ещё от адаптации и там, где применяется, но так по сути - да)
Бывший модератор форума uCoz, первый модератор сервиса вопрос/ответов uCoz. Разрабатываю сайты!)
|
[ RU ] |
|
|
Kosten |
Четверг, 17 Января 2019, 20:23 | Сообщение 6 |
|
Этот вариант больше для отдельных страниц, вновь созданных подходит. То иногда встречаются ресурсы, где описание написано, но как раз не одного пробела.
|
[ RU ] |
|
|