css — Как сделать выравнивание по центру div в HTML
спросил
Изменено 1 год, 10 месяцев назад
Просмотрено 197 тысяч раз
Возможный дубликат:
Как горизонтально центрировать div?
Один простой способ центрировать объект в HTML — использовать align='center'
, но это не работает для div.
Я пробовал:
style='text-align:center'; стиль = 'слева: 50%';
Я даже использую центральный тег
Но я не могу сделать свой целевой div центральным.
- HTML
- CSS
5
<голова>Центр <тело> <дел> Этот DIV расположен по центру
Проверено и работает в IE, Firefox, Chrome, Safari и Opera. Я не тестировал IE6. Внешнее выравнивание текста необходимо для IE. Другие браузеры (и IE9?) будут работать, если вы зададите для полей DIV (слева и справа) значение auto. Маржа «0 auto» является сокращением для поля «0 auto 0 auto» (вверху справа внизу слева).
Примечание: текст также центрируется внутри внутреннего DIV, если вы хотите, чтобы он оставался слева, просто укажите text-align: left; для внутреннего DIV.
Изменить: IE 6, 7, 8 и 9работа в стандартном режиме будет работать с полями, установленными на автоматический режим.
10
Я думаю, что align="center"
выравнивает содержимое, поэтому, если вы хотите использовать этот метод, вам нужно использовать его в div-обертке — div, который просто оборачивает остальное.
text-align
делает то же самое.
left:50%
игнорируется, если вы не установите позицию div как относительную или абсолютную.
Общепринятым методом является использование следующих свойств
width:500px; // это может быть любой модуль, который вы хотите, вам просто нужно определить его поле слева: авто; поле справа: авто;
автоматические поля означают, что они увеличиваются/сокращаются, чтобы соответствовать окну браузера (или родительскому div)
ОБНОВЛЕНИЕ
Спасибо Мео за указание на это, если вы хотите, вы можете сэкономить время и использовать короткую руку для маржи.
поле:0 авто;
это определяет верх и низ как 0 (поскольку это ноль, не имеет значения отсутствие единиц), а левое и правое определяются как «авто». Затем вы можете, если вы не хотите переопределить верхнее поле как вы бы с любыми другими правилами CSS.
6
это зависит от того, находится ли ваш div в позиции: абсолютной/фиксированной или относительной/статической
для позиции: абсолютной и фиксированной
blblablbalba
Хитрость здесь в том, чтобы иметь отрицательное поле, равное половине ширины объекта
для позиции: относительной и статической
blblablbalba
для обеих техник необходимо обязательно задать ширину.
0
как насчет чего-то в этом роде