Отправляет email-рассылки с помощью сервиса Sendsay

Рецепты HTML

  Все выпуски  

Рецепты HTML


Информационный Канал Subscribe.Ru

www.htmlbook.ru
   Новости сайта www.htmlbook.ru
Добрый день.

Изменил документ посвященный CSS и ссылкам. Добавил описание новой возможности, которую предлагают современные браузеры. Когда при наведении на ссылку, ее цвет остается неизменным, а цвет подчеркивающей линии изменяется.

Новый документ Рецепты HTML, в котором собраны различные короткие приемы использования HTML. В скором времени появится аналогичный раздел посвященный CSS. Шлите свои советы, будем дополнять.

Здесь собраны небольшие советы по использованию приемов HTML для различных целей.

1. Как убрать отступы на веб-странице

Горизонтальные и вертикальные отступы от края браузера до содержимого веб-странице встроены в браузер по умолчанию. Тем не менее можно изменять значение этих параметров, делая отступы по желанию больше или меньше. Хитрость заключается в том, что Internet Explorer и Netscape имеют разные параметры для указания значения отступов. У Internet Explorer в теге BODY следует указывать leftmargin для горизонтального отступа и topmargin для вертикального, а в Netscape те же функции выполняют параметры marginwidth и marginheight. Объединяя все параметры воедино, получим универсальный код, который будет работать во всех браузерах одинаково.

<body bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">



2. Область залитая сплошным цветом

Для создания цветной области используется таблица, в которой фон заливается определенным цветом с помощью параметра bgcolor. Отступы от края фона до содержимого регулируются значениями cellspacing или cellpadding.

<table cellpadding="10" bgcolor="#FFCC66">
<tr><td>
Выдалась у меня свободная минутка, открыл я любимый LINES , сижу, строю пятерки и тихо наслаждаюсь. Заходит девочка и начинает меня строить: дескать, LINES - это игра детсадовская, и т.п. "А ты во что играешь?", - спрашиваю очаровательную девочку. "Конечно, в Quake", - говорит она, - "там такое мясо"!
</td></tr>
</table>



3. Выравнивание в ячейке таблицы по верхнему краю

По умолчанию выравнивание в ячейках происходит с левого края по горизонтали и по центру вертикали. Чтобы выравнивание в ячейке было по верхнему краю, следует добавить параметр valign=top в тег TD.

<table height="100%">
<tr><td valign="top">
В воздухе образуются многочисленные вихри различных размеров, вследствие чего их гидродинамические и термодинамические характеристики испытывают хаотические флуктуации и потому изменяются от точки к точке и во времени нерегулярно.
</td></tr>
</table>



4. Отступы в форме

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

<form>
<table>
<tr><td>
<input type="text" size=10>
</td></tr>
</table>
</form>


5. Поля внутри таблицы

Если требуется сделать отступы внутри таблицы, но при этом ее параметры cellpadding или cellspacing по какой-либо причине изменять нельзя, вложите внутрь ячейки еще одну таблицу, указав у нее нужные поля.

<table cellpadding=0 cellspacing=0>
<tr><td>
 <table cellpadding=10>
   <tr><td>
    Содержимое
   <tr><td>
 </table>
</td></tr>
</table>


6. Двойная рамка

Создаем обычную таблицу, в которой устанавливаем border отличным от нуля, bordercolor - будет цвет рамки, cellpadding задает расстояние от внутренней рамки до содержимого таблицы, а cellspacing определяет расстояние между внутренней и внешней рамкой.

<table border="1" cellspacing="3" cellpadding="4" bordercolor="#000000">
<tr>
<td>Содержимое</td>
</tr>
</table>


7. Маркеры

Если перед текстом требуется поставить маркер, это можно сделать с помощью тега LI. Для изменения вида маркера добавьте параметр type="...", который может принимать одно из трех значений: disk (круг), circle (окружность), square (квадрат). Netscape, независимо от параметров показывает всегда точку.

<li type="square"> Пляшущие молнии;
<li type="square"> Раскаленная жаба.

Если хочется сделать особый маркер, можно воспользоваться спецсимволами. Например: » (&raquo;), · (&middot;) и другие.

&raquo; Пляшущие молнии;
&raquo; Раскаленная жаба.


Короткие советы

  • Тег MARQUEE, создающий бегущую строку, работает только в браузере Internet Explorer.
  • Фреймы плохо индексируются поисковыми машинами, это одна из причин, почему от использования фреймов лучше отказаться.
  • Если на вашем сайте размещена длинная таблица, то страница не будет показываться, пока таблица не загрузится полностью. Разбейте таблицу на несколько фрагментов для создания впечатления быстрой загрузки страницы.
  • Использование невидимой таблицы - один из популярных методов верстки веб-страницы.
  • Если ваша страница содержит 10 маленьких рисунков, каждый из которых занимает 100 байт, она будет загружаться дольше, чем при использовании одного рисунка размером 1000 байт.
  • Если вы делаете дизайн для разрешения монитора 800х600, используйте элементы шириной меньше, чем 770 пикселов.
  • Для изменения цвета ссылки добавьте тег FONT между тегами <A href=...> и </A>.
  • Чтобы ваши цвета на веб-странице не изменялись браузером, используйте 216 цветов веб-палитры.
  • Internet Explorer может некорректно и медленно показывать страницу если в ячейке таблицы в качестве фона используется GIF с прозрачностью, а поверх него наложена картинка также в формате GIF с прозрачностью.
  • Netscape не будет показывать содержимое ячейки таблицы и ее фон, если ячейка пуста.
  • Для создания всплывающей подсказки у текстовой ссылки, используйте параметр title тега <A href>.
  • Если в тег BODY добавить параметр onSelectStart="return false", то Internet Explorer запретит выделять текст и графику в окне браузера.
  • Если в тег BODY добавить параметр onCopy="return false", то Internet Explorer запретит копировать выделение в буфер обмена.
  • Отступ в начале красной строки можно задать с помощью нескольких неразделяемых пробелов &nbsp;.
  • Используйте формат GIF для текста, логотипов, иллюстраций с четкими краями, изображений с прозрачными участками и анимированных рисунков.
  • Если изображение является ссылкой, вокруг него автоматически добавляется рамка толщиной 1 пиксел, а цвет рамки совпадает с цветом ссылок.
  • Тег BASEFONT не поддерживается в браузере Opera.
  • Альтернативный текст не поддерживается браузерами Mosaic и Opera.
  • Перед тегом DIV, в отличие от тега SPAN, автоматически добавляется перенос строки и пустое пространство.
  • С помощью вложенных таблиц можно создавать рамки.

  •   Разделы сайта
     
    Создание сайта
      HTML
      CSS
      Графика
      Дизайн
      Инструментарий
      Справочная информация
      Форум

      Подписка на новости
      Введите ваш e-mail:


      Помощь
      Не знаете с чего начать или что можно найти на сайте www.htmlbook.ru - воспользуйтесь Помощником по сайту
    Copyright 2002 Влад Мержевич, e-mail: vlad@htmlbook.ru
    Материалы сайта охраняются законом об авторском праве.
    Вы можете свободно использовать и распространять любые статьи с указанием автора и ссылки на сайт www.htmlbook.ru.


    http://subscribe.ru/
    E-mail: ask@subscribe.ru
    Отписаться
    Убрать рекламу

    В избранное