HTML ширина документа - PullRequest
       3

HTML ширина документа

2 голосов
/ 15 января 2010

Может кто-нибудь попросить уточнить, как установить ширину для HTML-документа. я установил ширину для моего тега body и даже сделал div-обертку, чтобы установить ширину, но все же страница имеет ширину в несколько пикселей? что я делаю не так?

Ответы [ 5 ]

2 голосов
/ 15 января 2010

Вам, вероятно, нужно назначить ноль для отступа и поля body & html:

html, body {
  margin: 0;
  padding: 0;
}
1 голос
/ 15 января 2010

Тег body имеет поле по умолчанию во всех браузерах. Может быть, ему не хватает margin: 0px?

Хотя это может быть нормально делать по правилам (я не знаю, так ли это), присвоение тегу body ширины мне не подходит. Если вам нужно ограничить свой контент определенной областью, лучше использовать контейнер <div> непосредственно под <body>.

0 голосов
/ 15 января 2010

Элементы (такие как тег body) имеют поля и отступы по умолчанию, многие из которых ненулевые. Это, вероятно, объясняет дополнительные пиксели.

html, body {
    width: 800px;
    margin: 0;
    padding: 0;
}

Это пример CSS Reset : концепция состоит в том, чтобы исключить настройки по умолчанию для браузера, чтобы вы могли контролировать точный внешний вид во всех браузерах. В этом инкрементном сбросе мы исключаем поля и отступы для двух элементов, которые, вероятно, отвечают за ваши дополнительные пиксели.

0 голосов
/ 15 января 2010

Чтобы узнать, что сказал @pekka:

Тег body имеет поле по умолчанию во всех браузерах

Браузеры имеют разные стили по умолчанию, и это, вероятно, объясняет дополнительное поле или отступы, которые вы видите. Чтобы ваш CSS работал так, как вы ожидаете, обычно рекомендуется сбросить ваш CSS. Короче говоря, но определяя определенные стили для всех элементов, вы устраняете эти несоответствия браузера и затем можете верить, что ваши стили будут каскадно соответствовать вашим желаниям. Вот почему установка полей для элементов HTML и BODY устраняет дополнительное пространство, упомянутое в вопросе.

У Эрика Мейера есть хорошие мысли на этот счет, и его сброс - это то, что я видел чаще всего в Интернете. Тем не менее, следует отметить, что приведенный ниже обширный пример не следует использовать без него. Настройте его в соответствии с потребностями вашего проекта

Ex (От перезагрузки Эрика Мейера, ссылка ниже):

/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}

/* remember to define focus styles! */
:focus {
outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
 }

Проверьте эти обсуждения для более подробного объяснения:

http://meyerweb.com/eric/tools/css/reset/

http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/

0 голосов
/ 15 января 2010

ширина для моего тега тела

Некоторые браузеры (например, многие версии Internet Explorer) не позволяют устанавливать ширину элемента body. Обычно лучше добавить div и стиль оболочки, которые вместо этого

ширина страницы составляет несколько пикселей

Возможно, вы не удаляете отступы и / или поля по умолчанию (разные браузеры имеют разные значения по умолчанию)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...