Главная » Статьи » Рефераты » Без категории |
Как убрать лишнее пространство вокруг формы? htmlcss Есть два способа сделать это - с помощью хитрости и с помощью css. Хитрость: вставляем форму в таблицу, помещая её между открывающим и закрывающим тэгами: Второй способ - с помощью css выставить отступы в ноль: Почему элементы формы видны даже через перекрывающие их слои? css Это особенность отображения имеет место в IE и Opera под Windows и, к сожалению, ничего поделать с этим нельзя. Opera показывает все элементы формы, IE только select. Пример. Это происходит потому, что эти броузеры при отображении форм используют стандартные элементы интерфейса Windows, в то время как Netscape 6.x/Mozilla каждый раз отрисовывают их заново. Даже проблема возникает практически во всех новых броузерах при отображении плагинов и слоёв. Как убрать полосу прокрутки? html Прежде всего, у вас должна быть действительно веская причина для этого. Отключение полосы прокрутки создает массу проблем с юзабилити и смущает пользователей. Если причина все же имеется, то достичь желаемого можно несколькими способами, но все они чрезвычайно опасны в неумелых руках. Отключить полосу прокрутки во фрейме элементарно, просто добавьте атрибут scrolling="no" Во-вторых, в некоторых броузерах (IE под Windows пятой версии и старше, а также броузерах на базе Gecko) можно использовать нижеследующую декларацию: HTML, BODY { style="overflow: hidden; } Как можно контролировать размер текстового поля? htmlcss Увы, Netscape 4.x отображает элементы формы по иному алгоритму, нежели прочие броузеры (InternetExplorer, Opera, и на базе Gecko). После этого можно использовать декларацию css (которую старые версии Netscape проигнорируют) для подгонки поля под прочие броузеры. Примеры: Могу ли я использовать выпадающее меню для навигации? ia/ugd Как и многое в веб-дизайне, целесообразность использования выпадающего меню зависит от аудитории. На обычных сайтах лучше от него отказаться. Впрочем, иногда бывает удобно собрать вместе несколько ссылок на ограниченном пространстве. Минусы использования выпадающих меню: длинный текст делает меню чрезмерно широким трудности доступа к опциям в текстовых и речевых броузерах невозможно увидеть сразу все доступные варианты некоторые пользователи не догадываются о наличии скрытых опций оперирование выпадающими меню может представлять трудности для некоторых пользователей ("Я не понял, что надо нажать 'перейти'") различный внешний вид в различных броузерах требует небольшого, но все же программирования (на стороне клиента или сервера) Еще на эту тему имеет смысл почитать MacintoshHumanInterfaceGuidelines. Почему у картинок в таблицах появляется отступ внизу? htmlcss Особенно это заметно в броузерах на базе Gecko (например, в Netscape 6.x) и некоторых версиях Mozilla. Скорее всего это происходит потому, что броузер интерпретирует <img> как строчный элемент. Проблема решается следующей декаларацией: TD>IMG { display: block; } В старых броузерах отступ может появляться из-за пробелов между <img> и закрывающим <td>. Удалите лишние пробелы и проблема скорее всего решится. Как удалить рамку вокруг картинки-ссылки? htmlcss В HTML (и старых броузерах) необходимо добавить атрибут border="0" к тэгу img. В CSS (и новых броузерах) достаточно добавить стилевую декларацию AIMG { border: none; } Еще вы можете сделать рамку невидимой в Netscape 4.x с помощью css, меняя её цвет на цвет фона во внешнем блоке: A IMG { border: none; border-color: [цвет фона]; color: [цвет фона] } Но отступ примерно в две точки вокруг картинки все равно останется. Как установить отцентрировать таблицу с помощью CSS? css Корректным способом установки блочных элементов (в том числе и таблиц) по центру является указание таких отступов: margin-left: auto; margin-right: auto; или еще проще: margin: auto; Как сделать резиновую верстку с ограничением по ширине? css Проще всего было бы использовать атрибут max-width. К несчастью, он не поддерживается большинством версий IE. sObj = d.getElementById("container").style } Пример. Как задать стиль для hr? css InternetExplorer и большая часть css-совместимых броузеров (например, на основе Gecko, Opera имеет одну странность, которую документировал StefanM. Huber) работают с hr по-разному. Суть в том, что IE обрабатывает его как строчный элемент, а прочие - как блочный. Поэтому, для горизонтального разделителя красного цвета мы делаем: InternetExplorer: HR { color: #F00; } Прочие CSS-совместимые броузеры: HR { background-color: #F00; } Тоже самое верно и для выравнивания: Internet Explorer: HR { text-align: right; } Прочие CSS-совместимые броузеры: HR { margin-right: 0; } Итак, достичь с помощью css того, что в html выглядит как <hr align="right" width="30%" size="2" color="#000F00" noshade> ...вы можете следующим образом: HR { text-align: right; width: 30%; height: 2px; color: #F00; border: none; } /* Для IE */ HTML>BODY HR { margin-right: 0; width: 30%; height: 2px; background-color: #F00; border: none; } /* Для броузеров на базе Gecko */ HTML>BODY HR { margin-right: 0; width: 30%; height: 2px; background-color: #F00; border: 0px solid #F00; } /* Для Оперы и броузеров на базе Gecko */ Для более подробной информации по этой теме читайте статью MarekProkop "Styling <hr>". Как изменить отступ для элементов списка с помощью css? css Единственного правильного пути не существует. Броузеры Gecko и InternetExplorer по-разному интерпретируют css в данном случае. Самый простой вариант для уменьшения отступа - очистить поля и отступы слева. Для увеличения же отступа можно сделать так: ul { margin-left: 0; padding-left: 20px; } или ul { margin-left: 20px; padding-left: 0; } (Те же правила применимы к ol и dl) EricA. Meyer написал подробное объяснение по этой проблеме. Как можно добавить отступ между элементами списка? htmlcss Если элемент списка - текст, лучше всего оформить его как параграф: <li><p>a list item</p></li> В других случаях можно добавить два переноса строки в конце каждого элемента списка: <li>a list item<br><br></li> Для более аккуратного и эффективного решения проблемы следует использовать CSS, так как он не затрагивает структуру документа. Эта декларация даст тот же эффект, что и уже приведенные способы: li { margin-top: 1em; } Внимание: установка line-height для списка приведет не только к увеличению расстояния между элементами, но добавит междустрочное расстояние для содержания каждого элемента. Почему текст в Netscape 4.* становится все меньше и меньше? htmlcss Netscape 4.* рассматривает следующие один за другим тэги <p> (даже корректно закрытые) как вложенные, и поэтому уменьшает размер текста. Проблема возникает оттого, что пары </p><p> в модели отображения Netscape 4.* взаимно уничтожаются. Добавьте пробел или любой другой символ между тэгами (например, так: </p> <p>) и проблема решится.
| |
Просмотров: 254 | |
Всего комментариев: 0 | |