Сообщения оставленные на форуме с 9 сентября будут потеряны из-за восстановления бекапа.
Страница 1 из 212»
Модератор форума: SanchiZ 
Форум forucoz.com » Веб-мастеру » Уроки по ucoz » Урок 9: Изображения
Урок 9: Изображения
DArk-AnGeL Дата: Четверг, 06.05.2010, 15:10 | Сообщение # 1
Сообщений: 1259
Награды: 67
Статус: Offline
[ Личный статус ]
Урок 9: Изображения

Здóрово было бы поместить портрет актёра и музыкальной легенды David'а Hasselhoff'а прямо в центре ваше страницы?!
Это звучит немного дерзко...

Может быть, но это довольно просто сделать. Всё, что вам необходимо, как всегда, - тэг:

Пример 1:

Code

             <img src="david.jpg" alt="David" />

будет выглядеть в браузере:

Вам необходимо сообщить браузеру, что вы хотите вставить изображение/image (img), и указать его размещение (src, сокращение для "source"). У вас есть файл изображения?

Обратите внимание, что тэг img не требует наличия закрывающего тэга. Как и
, это команда не связана с буквенным текстом.

"david.jpg" это название файла изображения. ".jpg" - расширения файла, тип изображения. Как ".htm" указывает, что файл является HTML-документом, так и ".jpg" сообщает браузеру, что файл является изображением. Есть три типа файлов изображений, которые можно вставить на ваши страницы:

* GIF (Graphics Interchange Format)
* JPG / JPEG (Joint Photographic Experts Group)
* PNG (Portable Network Graphics)

GIF-изображения обычно лучше всего для графики и рисунков, а JPEG - для фотографий. Для этого есть две причины: первая - GIF-изображения содержат только до 256 цветов, а JPEG - до миллионов цветов, и второе - формат GIF лучше сжимает простые изображения, чем JPEG, который оптимизирован под более сложные изображения. Чем выше сжатие, тем меньше файл изображения, тем быстрее загружается ваша страница. Как вы, вероятно, знаете из собственного опыта, пользователи не любят "тяжёлые" страницы.

Традиционно форматы GIF и JPEG являются преобладающими типами, но в последнее время становится всё более популярным формат PNG (прежде всего из-за издержек формата GIF). Формат PNG по многим параметрам превосходит JPEG и GIF: миллионы цветов и эффективное сжатие.
Где мне взять файлы изображений?

Для этого вам понадобится программа редактирования файлов изображений. Такая программа совершенно необходима для создания интересных web-сайтов.

К сожалению в Windows и других операционных системах отсутствуют хорошие программы для редактирования изображений. Таким образом, вы может вложить деньги в приобретение Paint Shop Pro, PhotoShop или Macromedia Fireworks - это три лучшие программы редактирования изображений, имеющиеся в данный момент на рынке.

Однако, как мы говорили ранее, не обязательно покупать дорогие программы для работы с этим учебником. Вы можете загрузить прекрасную программу для работы с изображениями, Irfan View, которая является т. н. freeware, и, следовательно, ничего не стóит.

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

1. Правой клавишей мыши щёлкните на изображении в Internet.
2. Выберите "Save picture as..." в меню.
3. Выберите место для сохранения на вашем компьютере и нажмите "Save".

Проделайте это с изображением, расположенным здесь, и сохраните его на вашем компьютере в том же месте, что и ваши HTML-документы. (Заметьте, что этот логотип сохраняется в файле формата PNG: logo.png):


Теперь вы можете вставлять это изображение в ваши страницы. Попробуйте сделать это самостоятельно.
Это всё, что нужно знать об изображениях?

Вам необходимо знать ещё две вещи.

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

Пример 2:

Code

             <img src="images/logo.png">

Пример 3:

Code
           <img src="http://www.html.net/logo.png">

Во-вторых, изображения могут быть ссылками:

Пример 4:

Code

             <a href="http://www.html.net">
             <img src="logo.png"></a>

будет выглядеть в браузер примерно так (попробуйте щёлкнуть на изображении):

Пример 5:

Code
           <img src="logo.gif" alt="HTML.net logo">

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

Атрибут title можно использовать для краткого описания изображения:

Пример 6:

Code
           <img src="logo.gif" title="Learn HTML from HTML.net">

будет выглядеть в браузере:

Ну, хватит о David Hasselhoff и изображениях.

источник ru.html.net

 
Freema[N] Дата: Четверг, 06.05.2010, 15:22 | Сообщение # 2
Сообщений: 3650
[ 76 ]
Награды: 61
Статус: Offline
[ Личный статус ]
отличеую картинку ты выбрал. ...


Заходите на CS 1.6 сервер. у тебя есть возможность получить админку) 188.127.246.101:27789
 
DArk-AnGeL Дата: Четверг, 06.05.2010, 15:42 | Сообщение # 3
Сообщений: 1259
Награды: 67
Статус: Offline
[ Личный статус ]
Freema[N], норм картинка
 
Leader Дата: Четверг, 06.05.2010, 15:44 | Сообщение # 4
Сообщений: 695
[ 912 ]
Награды: 21
Статус: Offline
[ Личный статус ]
DArk-AnGeL, спс ! Кто автор ?

У меня новая жизнь , в 100 раз круче за ту что была раньше .
 
duffy_28 Дата: Суббота, 08.05.2010, 11:04 | Сообщение # 5
CS задрот xD
Сообщений: 1113
[ 1343 ]
Награды: 41
Статус: Offline
[ Личный статус ]
спасиб)

Идиоты недели: Necrоmane
DeidaRa, а ты за свой слова ответить можешь? или тоьлко и можешь пиздеть чего не знаешь?
 
DArk-AnGeL Дата: Вторник, 11.05.2010, 08:06 | Сообщение # 6
Сообщений: 1259
Награды: 67
Статус: Offline
[ Личный статус ]
Leader, автора указал
 
N1LEX Дата: Четверг, 20.05.2010, 09:55 | Сообщение # 7
Лейтенант
Сообщений: 81
[ 107 ]
Награды: 5
Статус: Offline
[ Личный статус ]
Спасибо!
 
Flex Дата: Понедельник, 24.05.2010, 10:05 | Сообщение # 8
Генерал-майор
Сообщений: 782
[ 518 ]
Награды: 37
Статус: Offline
[ Личный статус ]
Спс позновательно=)

 
Str1ke Дата: Вторник, 25.05.2010, 17:37 | Сообщение # 9
★by Str1ke★
Сообщений: 1681
[ 3816 ]
Награды: 151
Статус: Offline
[ Личный статус ]
Freema[N], согласен

 
WipeS333 Дата: Вторник, 25.05.2010, 17:40 | Сообщение # 10
Сообщений: 507
[ 359 ]
Награды: 9
Статус: Offline
[ Личный статус ]
Str1ke, ты вообще кроме флуда что-нибудь писать умеешь ? Куда не зайду ты либо пишешь (где оценивают работы) 8.10
Либо цитируешь ник и пишешь - правда, согласен.

Регистрируем домены на кириллице. Фичи для ucoz
http://colomoff.do.am/
 
Форум forucoz.com » Веб-мастеру » Уроки по ucoz » Урок 9: Изображения
Страница 1 из 212»
Поиск: