Установка свойств размеров
Свойства width и height управляют размерами зоны содержимого элемента плюс областями, занимаемыми просветом и обрамлением (см. рисунок 7.27 в начале раздела "Установка свойств текстовых областей").
Вы можете задавать свойствам width и height следующие типы значений:
- любое значение в размерных единицах, описанных на вставке "Задание значений в размерных единицах" ранее в этой лекции. Например, следующее правило устанавливает для свойства width элемента STANZA значение в 3 дюйма, а для свойства height – значение в 2 дюйма:
STANZA {width:3in; height:2in}
- значение в процентах относительно ширины или высоты родительского элемента. Так, следующее правило устанавливает для свойств width и height элемента STANZA значения, равные половине ширины и высоты родительского элемента:
STANZA {width:50%; height:50%}
- ключевое слово auto , которое устанавливается по умолчанию. При такой установке браузер подстраивает свойства width и height в соответствии с реальными размерами текста. Например, следующее правило устанавливает для свойств width и height режим auto (это аналогично тому, что вы просто опустите установку свойств width и height ):
STANZA {width:auto; height:auto}
Если вы сделаете ширину слишком маленькой, чтобы строки текста поместились внутри области содержимого, браузер будет переносить текст, пытаясь полностью разместить текст внутри отведенной области. Если же текст не помещается в зону содержимого по вертикали вследствие недостаточного значения, установленного для свойства height , браузер увеличит значение для height , чтобы разместить весь текст, как если бы вы установили для свойства height значение auto .
Так, если вы добавите следующее правило в таблицу стилей, содержащуюся в Листинге 7.5, браузер отобразит XML-документ из Листинга 7.6 (к которому присоединена таблица стилей), как показано на рисунке 7.33.
STANZA {border-style:solid; width:2.5in; height:1in}
Рис. 7.33.
Обратите внимание, что текст переносится с целью уместить его в отведенной ширине области в 2,5 дюйма, но высота области намного превосходит установленное значение в 1 дюйм, чтобы все содержимое текста было отображено.