|
Выравнивание текста по ширине страницы 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 ] |
| |
