Xpoint
   [напомнить пароль]

Интернет::HTML-верстка::Верстка - F.A.Q.

Как сделать иконку для "Избранного"?
Необходимые размеры иконки - 16x16 пикселей.
Для создания иконки воспользуйтесь редактором иконок, например тем, который входит в дистрибутив Microsoft® Visual Studio® или любым другим из доступных Вам редактором. Независимо от редактора, который Вы используете, убедитесь, что Вы установили в редакторе размер создаваемых иконок 16x16 пикселей. В противном случае Internet Explorer будет игнорировать созданные Вами изображения.
После создания иконки, Вы должны увязать её с Вашей веб-страницей. Однин из способов - это сохранение иконки с заданным по умолчанием именем favicon.ico в корневом каталоге Вашего домена, например, www.microsoft.com/favicon.ico. Каждый раз, когда Ваша страничка добавляется пользователем в Bзбранное, Internet Explorer автоматически находит этот файл и помещает в Избранное иконку и ссылку на Ваш сайт.
Также Вы можете увязать иконку с Вашей веб-страницей путем сохранения иконки с именем, отличающимся от favicon.ico, и добавлением строки с HTML кодом в HEAD Вашего скрипта. Строка кода включает LINK-тэг, который указывает на местоположение и имя Вашего файла. Вы можете включить этот LINK-тэг в базовую страницу.
<HEAD>
  <LINK REL="SHORTCUT ICON"
HREF="http://www.mydomain.com/myicon.ico">
  <TITLE>My Title</TITLE>
</HEAD>

******
Исходный текст
Для изготовления иконки можно использовать Microangelo (скачать можно здесь).
Как сделать плоский border (в IE и NN)?

Плоский border можно сделать с помощью однопиксельных колонок и однопиксельных строчек с фоном нужного цвета.

Любо с помощью вложенных таблиц. Например:

<table border=0 cellspacing=0 cellpadding=1>
<tr><td bgcolor=#00ff00>
<table border=0 cellspacing=0 cellpadding=2 width=100%> 
<tr> 
<td bgcolor=#FFFFFF>Зеленая</td> 
<td bgcolor=#FFFFFF>рамка</td> 
</tr> 
<tr> 
<td bgcolor=#FFFFFF>вокруг</td> 
<td bgcolor=#FFFFFF>таблицы</td> 
</tr> 
</table> 
</td></tr>
</table> 

<table border=0 cellspacing=0 cellpadding=0> <tr><td bgcolor=#0000FF> <table border=0 cellspacing=1 cellpadding=2 width=100%> <tr> <td bgcolor=#FFFFFF>Синие</td> <td bgcolor=#FFFFFF>рамки</td> </tr> <tr> <td bgcolor=#FFFFFF>вокруг</td> <td bgcolor=#FFFFFF>ячеек</td> </tr> </table> </td></tr> </table>
Как удалить пробелы между элементами (картинками)?

Отступ появляется из-за переноса строк. Вытяните всю конструкцию в одну строку и посмотрите что будет.

Обратите внимание на то, что <br> должен быть на ТОЙ ЖЕ строке, что и тэг <img ...> (не ставьте между ними перевод строки).

Как сделать чтобы текст, который обтекает картинку, начиная с определенной строки этого текста, перестал обтекать эту самую картинку?

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

<br Clear="left\right\all">

Значение параметра Clear выставляется в зависимости от параметра align, использовавшегося в картинке.

О тире, переносах и других специальных символах

1. &shy; - символ мягкого переноса: &shy; — &#173;. Если надо сделать перенос, показывает дефис, если не надо, прячет.

2. Длинное тире (&#0151;), оно же "em dash" - это обычное тире, которое все знают (и которое например, использовано в данном предложении). По типографским правилам оно должно отбиваться от соседних слов _уменьшенными_ пробелами, но, из-за отсутствия таковых в Вебе, отбивается обычными. Короткое тире (&#0150;), оно же "en dash" используется _исключительно_ для указания числовых и временных интервалов. Например, "стр. 20-22" или "1990-2000 гг.". Отбивается совсем уж мелкими интервалами, в Вебе - не отбивается совсем (кстати, в англоязычных текстах _длинное_ тире также не отбивается). И, наконец, дефис "-" - используется для переносов и слов типа "во-первых".

В HTML нет стандартных обозначений для длинного и среднего тире (типа "&чтототам;") и единственный способ поставить тире - писать &#0151;. А это автоматически закрывает всю типографику для тех, кто смотрит страницы в КОИ, поскольку все эти коды определены исключительно для CP1251, а в КОИ на этих местах стоит со-овсем другое...

Но есть символы которые можно использовать при любой кодировке:

  • &laquo; и &raquo; - кавычки-ёлочки
  • &copy; - копирайт (C)
  • &reg; - (R)
  • &trade; - (ТМ)
  • &deg; - градус
  • &sect; - параграф
  • &plusmn; - плюс-минус
  • &acute; - апостроф
  • &times; - знак умножения (косой крестик - типа 640х480)
  • &Prime; и &prime; - двойной и одиночный штрихи (минуты и секунды, футы и дюймы)
  • &mdash; и &ndash; - длинное и короткое тире
  • &nbsp; (&#160;) неразрывный пробел
  • &ensp; (&#8194;) средний, разрывной пробел
  • &#8195; &emsp; (&#8195;) длинный разрывной пробел (примеяют в конце предложений)
  • &#8201; &thinsp; (&#8201;) узкий пробел (применяют в двойных словах)
Взято с http://html.manual.ru/book/info/specialchars.php
Полную версию обсуждения этой проблемы можно посмотреть в архиве.
Тег <form> срабатывает как перевод строки, как устранить эффект?

<form style="margin:0px">

Если необходима поддержка Netscape Navigator 4.*, то проблема решается перемещением тега формы за пределы ограничивающих её ячеек таблицы. Как вариант -- указывать тег <form> между тегами <tr> и <td> (</td> и </tr>). Стоит учитывать, что данное решение нарушает стандарты верстки.
Как уменьшить/убрать отступы от края браузера до содержимого сайта?

Прописать в body следующее:
leftmargin="0" topmargin="0" bottommargin="0" rightmargin="0" marginheight="0" marginwidth="0"

Либо, используя стили:
style="margin:0px" bottommargin=0 rightmargin=0

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

Для этого в CSS надо прописать:
body {
scrollbar-face-color: #111111; <!--Цвет базы под треугольными стрелочками и самого бегунка -->
scrollbar-highlight-color: #222222; <!--Цвет внутреней обводки сверху и слева, а также тени неактивных стрелочек -->
scrollbar-shadow-color: #333333; <!--Цвет треугольных стрелочек в неактивном состоянии и внутреней обводки снизу и справа -->
scrollbar-arrow-color: #444444; <!--Цвет треугольных стрелочек в активном состоянии -->
scrollbar-track-color: #555555; <!--Цвет полосы прокрутки под бегунком -->
scrollbar-darkshadow-color: #666666; <!--Цвет обводки снизу и справа -->
scrollbar-base-color: #777777; <!--Цвет обводки сверху и слева -->
}
Следует заметить, что работает это только в браузерах IE5.5 и выше.

Как убрать полосу прокрутки (scrolling)?

Вставить в тег <body> аттрибут scroll="no".
Но данная конструкция не поддерживается NN.

Как прописать ссылку на файл в директории "а" из файла, находящегося в директории "b" (обе директории находятся в каталоге "с")?

1 способ:
<a href="../а/xxx.htm"></a>
2 способ:
<a href="/c/а/xxx.htm"></a>

Почему элементы формы не отображаются?

Нетскейп не воспринимает элементы форм, если они не включены в теги <FORM></FORM>.

Как "слепить" два слова при align="justify"?

При использовании align="justify" часто бывает, что два небольших слова разносятся по разным краям страницы, а хочется чтобы между ними оставалаось расстояние одного пробела.
Для достижения нужного эффекта можно использовать несколько способов:

  1. Убираете между словами пробел и вместо него ставите gif-распорку нужной ширины
  2. Вместо пробела ставите символ "#" и задаете ему белый цвет. (Однако, представьте, что будет с текстом, если посетитель решит его скопировать в текстовый редактор...)
  3. И, наконец, самый простой и в то же время самый верный вариант - это поставить вместо пробела &nbsp; (символ неразрывного пробела)
    Обратите внимание: между символом неразрывного пробела и словами не должно быть никаких пробелов! (Пример: слово&nbsp;слово2)
Почему не работает стиль ссылок?

Если написаные стили ссылок a:link,a:hover,a:visited не работают или работают неправильно, следует обратить внимание на порядок расположения их файле CSS.

  • Правильный код должен выглядеть так:
    a:link {} 
    a:hover {} 
    a:visited {} 
    a:visited:hover {} 
    
    Он позволяет указать разное оформления для hover (наведение мыши) у посещённых и непосещённых ссылок.

  • Либо можно использовать упрощенный вариант:
    a:link {} 
    a:visited {} 
    a:hover {} 
    
Как сделать чтобы фон не прокручивался?

Вставить в тег <body> : bgproperties="fixed"
или (CSS): style="background-attachment: fixed"

Как одну из колонок отделить цветной линией?

<td width=1 bgcolor=red><imr src="pix.gif" width=1 height=1></td>

Ширину ячейки указывать необязательно. Сама таблица должна быть стянута к минимуму (width=1 в теге <table>) тогда ширина ячейки будет гарантированно равна единице...
Конечно, если таблица резиновая (ширина задана в процентах), то придётся использовать вложенные таблицы.

Можно ли как-то задать типы файлов в <input type="file">?

<input type="file" accept="image/jpeg,image/gif,image/x-png">
Hо ни один браузер пока этого не поддерживает.

Как открыть ссылку в соседнем фрейме, а не там, где находится сама ссылка?
<a href="html.html" target="_название">ссылка</a>

А в коде основной страницы, где перечисленны все фреймы в свойства этого фрейма дописываем:

name="название фрейма"
Почему при загрузке странички прыгает текст и картинки?

У Вас не прописаны размеры картинок
<img width="xxx" height="xxx" ...>

Вид курсора

MSIE и большинство современных браузеров позвояют управлять видом курсора при наведении его на объект. Например, если в стилях объекта указать style="cursor: pointer" (для ранних версий MSIE < 6 следует использовать "cursor: hand") курсор принимает вид руки (как при наведении на гиперссылку).
Существует еще множество видов курсоров:

  • wait - песочные часы
  • crosshair - крестик
  • default - стрелка
  • move - крестообразная стрелка
  • e-resize - стрелка вправо
  • w-resize - стрелка влево
  • s-resize - стрелка вниз
  • n-resize - стрелка вверх
  • se-resize - стрелка вниз и вправо
  • sw-resize - стрелка вниз и влево
  • ne-resize - стрелка вверх и вправо
  • nw-resize - стрелка вверх и влево
  • text - значок текста
  • help - стрелка с вопросом

В IE6 можно задавать свой собственный курсор:
style="cursor:url(путьккурсору)"

В целях кроссбраузерности, при указании курсора в виде руки, необходимо указывать сначала hand (для ранних версий MSIE), потом pointer (для новых браузеров): style="cursor: hand; cursor: pointer;".

Как сделать, чтобы background не размножался?

Нужно прописать в стилях:

  • не размножался вообще
    style="background-repeat : no-repeat;"
  • размножался только по горизонтали
    style="background-repeat : repeat-x;"
  • размножался только по вертикали
    style="background-repeat : repeat-y;"
Powered by POEM™ Engine Copyright © 2002-2005