Реферат: Кулинарные рецепты CSS

Кулинарные рецепты CSS

Craig Saila

Как убрать лишнее пространство вокруг формы? html css

Есть два способа сделать это - с помощью хитрости и с помощью css. Хитрость: вставляем форму в таблицу, помещая её между открывающим и закрывающим тэгами:

<table>

<form>

<tr>...</tr>

</form>

Второй способ - с помощью css выставить отступы в ноль:

<form style="margin-top: 0; margin-bottom: 0;">

Почему элементы формы видны даже через перекрывающие их слои? css

Это особенность отображения имеет место в IE и Opera под Windows и, к сожалению, ничего поделать с этим нельзя.

Opera показывает все элементы формы, IE только select. Пример.

Это происходит потому, что эти броузеры при отображении форм используют стандартные элементы интерфейса Windows, в то время как Netscape 6.x/Mozilla каждый раз отрисовывают их заново.

Даже проблема возникает практически во всех новых броузерах при отображении плагинов и слоёв.

На сайте DHTML Lab есть более подробная статья на эту тему. Thomas Brattli предлагает решение проблемы на JavaScript в своем скрипте CoolMenus.

Как убрать полосу прокрутки? html

Прежде всего, у вас должна быть действительно веская причина для этого. Отключение полосы прокрутки создает массу проблем с юзабилити и смущает пользователей. Если причина все же имеется, то достичь желаемого можно несколькими способами, но все они чрезвычайно опасны в неумелых руках.

Отключить полосу прокрутки во фрейме элементарно, просто добавьте атрибут

scrolling="no"

Убрать её из основного окна несколько сложнее. Во-первых, можно открыть окно с помощью JavaScript без активирования прокрутки:

window.open(this.href,'newWindow','scrollbars=no');

Во-вторых, в некоторых броузерах (IE под Windows пятой версии и старше, а также броузерах на базе Gecko) можно использовать нижеследующую декларацию:

HTML, BODY { style="overflow: hidden; }

Как можно контролировать размер текстового поля? html css

Увы, Netscape 4.x отображает элементы формы по иному алгоритму, нежели прочие броузеры (Internet Explorer, Opera, и на базе Gecko).

Так как Netscape 4.x использует основной моноширинный шрифт для отображения текста в полях для ввода текстовой информации, а IE использует варьирующийся шрифт (обычно sans-serif) - лучше всего оптимизировать текстовое поле прежде всего для Netscape.

После этого можно использовать декларацию css (которую старые версии Netscape проигнорируют) для подгонки поля под прочие броузеры.

Примеры:

Могу ли я использовать выпадающее меню для навигации? ia/u gd

Как и многое в веб-дизайне, целесообразность использования выпадающего меню зависит от аудитории. На обычных сайтах лучше от него отказаться. Впрочем, иногда бывает удобно собрать вместе несколько ссылок на ограниченном пространстве.

Минусы использования выпадающих меню:

длинный текст делает меню чрезмерно широким

трудности доступа к опциям в текстовых и речевых броузерах

невозможно увидеть сразу все доступные варианты

некоторые пользователи не догадываются о наличии скрытых опций

оперирование выпадающими меню может представлять трудности для некоторых пользователей ("Я не понял, что надо нажать 'перейти'")

различный внешний вид в различных броузерах

требует небольшого, но все же программирования (на стороне клиента или сервера)

Еще на эту тему имеет смысл почитать Macintosh Human Interface Guidelines.

Почему у картинок в таблицах появляется отступ внизу? html css

Особенно это заметно в броузерах на базе Gecko (например, в Netscape 6.x) и некоторых версиях Mozilla. Скорее всего это происходит потому, что броузер интерпретирует <img> как строчный элемент. Проблема решается следующей декаларацией:

TD>IMG { display: block; }

(подробное объяснение вы можете найти в статье "Tables, Images, and Mysterious Gaps".)

После выхода Mozilla 1.0 в него был курсовые - 700 р. Комментарии: