|
Приветсвую вас, уважаемые друзья! Сразу хочу сказать, что
этот выпуск будет несколько отличаться от предыдущих. Это
первый практический выпуск, в котором мы уже займемся непосредственно
программированием, изучением более серьезных процедур и медотов
программирования. Как вы заметили, в прошлых выпусках было
не много практики, в основном это была теория, но сейчас вы
уже кое-что знаете и пора начать писать программы.
Если вы обратили внимание, разделы HTML и Паскаль поменялись
местами - так не будет в дальнейшем, это только в этом выпуске.
Дело в том, что теория нам сегодня не нужна, а по HTML больше
теории, чем практики. Я хочу отметить, что многие из подписчиков
изучают только гипертекстовый язык, не занимаясь Пакалем.
"Зачем?" - думают они - "Я и так смогу сделать себе страничку,
без знания Паскаля". Но дело в том, что в мои планы не входит
научить вас делать "домашние странички" - я хочу вас научить
создавать полноценные сайты. А для этого нужно будет создавать
не только гипертекстовые документы, но и программы, написанные
на серьезных языках программирования. Вы ведь заметили, что
технологии Интернет и обыкновенное программирование идут на
одном уровне друг с другом? Так будет и дальше. Но HTML через
некоторое время закончиться и начнутся действительные языки
программирования под Интерент - PHP, Perl, JAVA и JAVA Script.
В свю очередь и Паскаль сменится Си и программированием под
Windows. Вот как раз для того, чтобы суметь ими пользоваться
и нужно знать как минимум один язык программирования. Поэтому
если вы и увлекаетесь только WEB технологиями, не забывайте
про Паскаль. Без знания его вы не станете нормальным программистом,
и, как следствие ваши сайты не смогут претендовать на серьезность.
Когда HTML заменят языки программирования, я уже не буду
в них начинать с нуля. Все данные, которые я буду приводить
будут ставиться в сравнение с Паскалем и расчет пойдет на
то, что вы его знаете.
Но тем не менне, хотя упор сегодня и делается на практику,
HTML я тоже оставлять не хочу. Раздел про него, как Вы заметили,
есть - кратко расскажу о тэгах, управляющих рисунками, а также
о некоторых особенностях гипертекстовых ссылок. Но о каждом
в своем разделе, вы и так пишите мне, чтобы я сокращал до
максимума вступление. Просто хочу обратить ваше внимание,
что как-никак, но HTML сегодня присутсвует.
Заметьте также, в этом выпуске отсутсвуют разделы "Вопросы"
и "Объявления". Я решил не включать их в спецвыпуск, извините
все, кого не публикую.
Если Вы недавно подписались и Вам что-то непонятно, пожалуйста,
перед тем, как спрашивать у меня, просмотрите предыдущие выпуски
рассылки. Возможно, там есть ответы на ваш вопрос.
Архив рассылки можно взять на моем сайте "Библиотека
программиста" - http://www.plib.f2s.com/.
Также там можно скачать программное обеспечение, необходимое
нам для работы на сегодняшний день.
Буду особо благодарен, если Вы оставите свое мнение о рассылке
на сайте.
| Замечание по поводу сайта |
Уважаемые подписчики!
Я приложил некоторые усилия с сайту Библиотека
программиста и открыл на нем новый сервис.
Теперь на сайте в полную силу работает "Каталог ресурсов",
который, к сожалению, пока не очень насыщен ссылками. Так
вот, если у вас есть своя страничка или сайт, может вы просто
знаете интересный ресурс, надеюсь, вы не применете возможностью
и добавите его ссылку в "Каталог ресурсов Библиотеки".
Кроме того, хочу обратить ваше внимание, что на сайте появилось
несколько новых книг, заработали новые разделы. Правда, не
все ссылки пока откликаются, но уже есть кое-что интересное.
В частности, книги и исходные тексты по некоторым языкам.
К моему великому удивлению было очень много писем о моей
идее - создании "Клуба начинающих программистов". Большое
спасибо всем, кто откликнулся, я рад, что идея получила ваше
одобрение. Некоторые писали довольно конкретные наработки,
то есть не просто свое отношение, а предлагали конкретные
действия. Вот, например строчки из письма, которое я получил
первым, и которое мне очень понравилось (особенно своим оригинальным
стилем изложения):
| ............ Ваша идея на
счет создания клуба начинающих программистов оччень
даже неплоха, хм..., так сказать, но я бы , опять же
хм..., выразил свое мнение (пожелание?) пойти трохи
дальше. А именно: мона организовать типа что-то распределения
по интересам - по языкам. К примеру: Паскаль, ХыТыМыЛь
вешч кароши, но мне в данный отрезок времени - кровь
с носу надыть максимально быстро освоить фокс и Си ессно
у мя от них хэд пухнет и мню не до Паскаля :( Вот, я
со своей низкой колокольни, имхо подумал, что было бы
здорово, дабы каждый желаюшчий смог подписаться именно
на то, что он считает, что оно и токмо оно ему необходимо.
Опять же факи по конкретному языку в конкретной "комнате"
;) ........... |
Вот такое вот оригинальное мнение. Ну чтож, спасибо вам
всем еще раз, я начинаю разработку. Хочу сказать, что все
письма, которые вы решите мне написать будут очень в тему;
именно по ним я буду судить о том, что надо и что нет, а также
черпать идеи и вдохновение. Пишите!
Писем с вопросами по прошлым темам было меньше, чем обычно.
Это хорошо, я рад! Видимо, вам все понятно и не требуется
дополнительной помощи, по крайней мере основной массе подписчиков.
Но хотя и говорю меньше, это не значит, что мало - вопросов
было около 300. Извиняюсь очередной раз, кому не ответил.
Уважаемые друзья! Если я вам не отвечаю, это не значит, что
я не проявляю внимание к вашем письмам - я принимаю их во
внимание и строю выпуски исходя из вопросов, пожеланий и предложений.
Пожалуйста, помните это и не считайте меня невнимательным
к свой аудитории.
Спасибо!
Как я уже говорил, сегодняшний урок будет состоять полностью
из задач. Новых конструкций мы изучать не будем, хотя и освоим
несколько новых процедур. Задачи будут представлены как на
повторение пройденной теории, так и на усвоение некоторых
примемов программирования. Они идут одна да другой в порядке
возрастания сложности.
А теперь необходимый комментарий к тому, что Вам необходимо
с этой информацией делать и зачем она вам нужна. Во-первых,
это более усложненные и функциональные варианты известной
вам информации. Их попросту будет полезно изучить, дабы понять
возможности их использования. Кроме того, советую после изучения
программ самостоятельно их все написать: закрыть рассылку
и повторить все, согласно условиям. Это позволит вам глубже
усвоить информацию.
Также будет замечательно, если вы эти программы усовершенствуете.
Возьмете за принцип существующее условие и переделаете его
- добавите чего-нибудь, что-то уберете.
Кроме того, советую все процедуры, которые мы проходим,
выписывать на бумагу. Это будет служить вам наглядным примером
и в дальнейшем вы сможете быстро находить необходимую вам
информацию.
Условие задания:
Написать программу, выводящую в столбик десять строк, в
каждой печатая цифры от 0 до 9, то есть в таком
виде:
0 1 2 3 4 5 6 7 8 9
0 1 2 3 4 5 6 7 8 9
...................
0 1 2 3 4 5 6 7 8 9
Начинаем решать
Итак, давайте разберемся, что же нам надо, чтобы без проблем
вывести столбик цифр? Здесь больше всего подойдут циклы, причем
использовать мы будем изветсный нам цикл FOR. Мы его
запустим 10 раз, каждый раз будем выводить 10 цифр, которые
также будут выводиться циклом, причем после этого нужно будет
перенести курсор на новую строку, чтобы получался столбик.
Сразу же решаем, какой тип мы будем использовать в циклах.
Подойдет тип Byte, не так ли? Ведь значения у нас не
будут переваливать через 255 (границу Byte). Итак, текст программы:
| Program N1;
var
I,J: Byte;
begin
For I := 1 to 10 do
begin
For J
:= 0 to 9 do
Write(J, ' ');
Writeln;
end;
Readln;
end.
|
Запустите эту программу. Ну как? Она делает именно то, что
и предполагалось по условию. Заметьте, здесь, в принципе,
можно вместо второго цикла, печатающего строку цифр, можно
использовать процедуру Write:
Write('0 1 2 3 4 5 6 7 8 9 ');
Но тем не менее я этого не делаю, для того, чтобы продемонстрировать
вложенность циклов. Следующий пример будет являться усовершенствованным
этой задачи.
Условие задания:
Написать программу, распечатывающую таблицу умножения. (По
типу известной всем Таблицы Пифагора). Программа должна выводить
следующий экран:
1 2 3 4 5 6 7 8
9 10
2 4 6 8 10 12 14 16 18 20
.........................
10 20 30 40 50 60 70 80 90 100
Начинаем решать
Сразу давайте определимся с алгоритмом. Как реализуется
такой вывод? Мы с вами будем использовать как и в прошлой
программе, два цикла - один будет вложен в другой. Только
нужно соотнести значения циклов так, чтобы выводимый результат
был в требуемом виде, то есть на пересечении строки и столбца
должно быть произведение соответсвующих чисел. Как поступить?
Все просто. Здесь я вам покажу крайне простой и оптимизированный
алгоритм, который распечатывает таблицу умножения.
Что представляет из себя таблица умножения? Это произведение
строки на столбец. Зная это, мы решаем поставленную перед
нами задачу: первый цикл у нас будет считать строки, так ведь?
(Вспомните предыдущую программу), а второй (вложенный цикл)
считает символы в строке, или столбцы. То есть чтобы получить
произведения строки на столбец, нужно просто умножать значения
циклов друг на друга! Вот и все, если не понятно, дальше разберетесь.
Текст программы:
| Program N2;
var
I,J: Byte;
begin
For I := 1 to
10 do
begin
For J
:= 1 to 10 do
If I*J > 10 then Write(I*J, ' ')
else Write(I*J,
' ');
Writeln;
end;
Readln;
end.
|
Видите, мы всего лишь умножаем индексы циклов друг на друга,
вот и все! Запомните этот алгоритм, а главное, попытайтесь
его "ощутить", понять до конца.
Теперь внимательно смотрите на обе процедуры Write.
В первой из них два пробела - Write(I*J,' . . ');
Во второй один - Write(I*J,'
. ');
(Здесь не очень хорошо видно, поэтому я выделил их точками).
Как вы думаете, зачем я так поступаю? Всмотритесь в текст
программы, на проверку if...then...else. Не догадались?
А вы подумайте. Вот это первый вопрос до следующего выпуска.
Постарайтесь понять! Наберите программу, здесь все очень просто.
Жду ваших писем.
Вот теперь мы переходим с циклов на типы, а именно на строки.
В этом примере я расскажу о дополнительных возможностях работы
со строками и мы напишем одну довольно серьезную программу.
| Методы работы со строками |
Как вы знаете, тип-строка обозначается как String.
Переменная такого типа может хранить любые символы, в т.ч.
и буквы русского алфавита. Строки нельзя представлять как
числа, их нельзя сопоставлять типу Integer и другим
числовым, однако в некотором роде этот тип совместим с типом
Char, который может хранить один символ. А сколько
же может хранить строка? Ведь у всех типов есть свой диапазон.
Действительно, это так и String тоже имеет свой диапазон.
Тип String может хранить до 255 символов,
то есть максимальная длина строки - 255 знаков. Запомните
это!
А теперь зададимся таким вопросом - как определить фактическую
длину строки? Понятно, максимальная длина 255 символов.
Но если нам нужно точно знать, сколько символов ввел пользователь?
Это просто. Для этого есть специальная функция, которая и
определяет длину строки. Это функция Length.
Функция Length (англ. ДЛИНА) - определяет,
точное количество символов в строке. Заметьте, это функция,
а не процедура. Сейчас постараюсь объяснить, в чем
здесь разница.
Процедура выполняет какие-либо действия внутри себя, то
есть все данные, которые ей передаются, доступны ей и только
ей. Функция - результаты ее работы могут быть использованы
прямо в программе, причем делается это простым присваиванием.
То есть она возвращает значение от своего действия, и это
значение можно занести в какую-либо переменную или использвоать
в непосредственно в выражениях. Если не понятно, поймете на
примере использвания Length.
Функция Length очень наглядно демонстрирует пример
использования функций. Чтобы это показать, расскажу как использовать
ее в действии.
Итак, имеем мы какую-нибудь строку, например S: String.
Нам нужно вычислить ее длину. Понятно, что длина - то число,
например, 120. При своей работе Length возвращает длину
строки как результат своей работы. Зная принцип работы функий
(можно присваивать их переменным), а также зная, что она возвращет
число, мы и запишем:
A := Length(S);
,где A: Byte; S: String;
Вот и вся работа функции Length! После такого присваивания
переменная А будет содержать длину строки. Естественно, если
строка пустая - А будет равна нулю. Итак, пример использования
функции Length:
| Program N3;
var
A: Byte;
S: String;
begin
Write('Введите строку:
');
Readln(S);
A := Length(S);
Write('Длина введенной строки:
', A);
Readln;
end.
|
Видите, насколько посто использование функций? Усвойте это,
в Паскале кроме Length есть довольно много функций.
А теперь вспомните, что я говорил выше - результат функции
можно использовать непосредственно в выражениях? Вспомнили?
Под этим я понимал, что для использования значения, возвращемого
функцией, необязательно присваивание его переменной, его можно
сразу подставлять в выражения. Вот модифицированный пример
предыдущей программы:
| Program N4;
var
S: String;
begin
Write('Введите строку:
');
Readln(S);
Write('Длина введенной строки:
', Length(S));
Readln;
end.
|
Вот непосредственное использование в выражении. При такой
конструкции Паскаль какбы "подставляет" вместо функции результат
ее вычисления. Заметили, насколько при этом сократилась программа?
Теперь давайте подумаем, какие еще есть выражения, куда можно
прилепить функцию? Это может быть изчестная нам конструкция
if...then...else. В ней с успехом могут быть использованы
функции. Для примера напишем программу, которая будет читать
строку, проверять - она меньше 10 символов? Если да, читать
заново. Если нет, печатать ее длину. Текст программы:
| Program N5;
label
L1;
var
S: String;
begin
L1:
Write('Введите строку:
');
Readln(S);
if Length(S) < 10 then goto L1;
Write('Длина введенной строки:
', Length(S));
Readln;
end.
|
Заметили, мы используем сразу функцию, без промежуточных
переменных. Здорово и удобно, правда?
Ну а теперь после изучения новой функции, которая понадобиться
нам в дальнейшем, хочу рассказать о дополнительных медотах
работы со строками.
Вы когда нибудь задавались вопросом, как можно обратиться
к любому символу строки? Понятно, что строка - это набор символов,
идущих один за другим. Обычно хватает работы с одними строками,
но иногда нужно проверять и отдельные символы в строке. Вот,
например понадобилось нам проверять - есть ли в введенной
строке пробелы. Как мы сможем это сделать?
На самом деле, здесь все просто и такая возможность существует.
Как это осуществить, читайте ниже.
| Методы работы со строками - доступ к отдельным символам |
Строка - это набор символов, идущих один за другим. При
этом они все нумеруются по порядку и каждый из них имеет свой
номер. Вот наглядный пример того, как нумеруются символы в
сроке (для примера возьмем строку, в которой лежит слово "Строка"):
Вот таким образом и проводиться нумерация символов. Здесь
видно, что для того, чтобы обратиться к символу "С", нужно
обратиться к 1-му элeменту. К символу "р" - ко второму. Как
же реализовать такое обращение?
Для этого нужно написать переменную-строку, с номером символа
в ней, указанным в квадратных скобках - [ и ]. Вот
пример обращения к символу "C":
S[1];
А вот полный пример присваивания переменной Char
1-го символа строки:
var
C: Char;
S: String;
begin
S := 'Строка';
C := S[1];
end.
Просто? Просто. А возможностей много. Ниже в разделе домашних
заданий смотрите задание по этой теме.
Ну а теперь мы попробуем решить такую задачу:
Задача
Запросить у пользователя строку и проверить ее на пробелы.
В качестве ответа вывести количество пробелов.
Решение
Как всегда давайте определяться, чтоже нам надо и как будем
поступать.
1. Нам нужен будет счетчик, который будет хранить количество
пробелов. Это не проблема - заведем переменную Byte.
2. Нам нужно сканировать все символы веденной строки по
очереди и проверять, текущий символ является пробелом? Если
да, то увеличиваем счетчик.
3. Выведем счетчик на экран.
Что скажете? Есть мысли по поводу того, как будем решать?
Особых проблем возникнуть не должно, но как проверить все
символы по очереди? Какой здесь использовать алгоритм?
Если вы сами еще не догадались, привожу описание алгоритма,
с помощью которого будем проводить сканирование.
Итак, что нам нужно, чтобы проверить все символы по очереди?
Нам нужно всего лишь знать количество этих символов, после
чего мы сможет пустить цикл - от 1 до этого количества. В
этом цикле и будем производить сравнение. При этом текущим
символом будет являться значение цикла. Догадались? Если что-то
непонятно, просмотрите материал выше, ну а если все ясно,
привожу текст программы:
| Program N6;
var
I: Byte;
Count: Byte;
S: String;
begin
Write('Введите строку:
');
Readln(S);
For I := 1 to Length(S) do
If
S[I] = ' ' then Inc(Count);
Write('Количество пробелов:
', Count);
Readln;
end.
|
Вот, собственно и есть вся релизация этого алгоритма. В
качестве комментариев хочу сказать следующее:
1. Обратите внимание, что я использую описанную выше
возможность функций - подстановку в выражениях;
2. Также заметьте, что я не пишу begin...end
в цикле For, хотя там и не однин оператор. Это потому,
что констрункция if...then...else вместе с теми операторами,
что в ней заключены, является всеже одним действием и выполняется
едино.
На этом хочу закончить, сегодня вам довольно много информации
для размышления. Разбирайтесь, делайте и решайте возникшие
у вас задачи. Придумывайте побольше сами! В качестве практичеких
заданий я дам вам пару задач по темам "циклы" и "строки",
простых, но требующих внимания. Хочу сразу сказать - присылать
мне их не нужно! Это задачи, не требующие проверки с моей
стороны. Однако, вы сможете найти верные решения к ним. При
выходе следующего выпуска они появяться на моем сайте в разделе
"Домашние задания" - вы сможете зайти туда и сравнить. Толбко
помните, я опубликую их не сразу, чтобы избежать списывания.
Задания:
1. По теме "циклы": - напишите программу, печатающую
столбик строк такого вида:
1 0 0 0 0 0 0 0 0
0 2 0 0 0 0 0 0 0
0 0 3 0 0 0 0 0 0
0 0 0 4 0 0 0 0 0
0 0 0 0 5 0 0 0 0
0 0 0 0 0 6 0 0 0
0 0 0 0 0 0 7 0 0
0 0 0 0 0 0 0 8 0
0 0 0 0 0 0 0 0 9
2. По теме "строки": напишите программу, присваивающую
переменной Char последний символ введенной строки.
Как я уже сказал, ответы смотрите на сайте http://www.plib.f2s.com/
в разделе "Домашние задания".
Сегодня этот раздел будет небольшим, а точнее будет не много
объяснений с моей стороны. Мы будем разбирать простые вещи,
но довольно полезные и как я понял из ваших писем, очень вам
интересные. Это возможность добавления рисунков и управление
каталогами в ссылках. Причем про каталоги раздел будет построев
по принципу "вопросы-ответы", каждому вопросу будет соответсвовать
свой ответ. Итак, если вы не против такой системы, начнем
с каталогов.
1. Как сделать ссылку на каталог выше?
Например есть два каталога, расположенные на одном уровне
- A и B. Страница, на которой стоит ссылка,
находится в каталоге A, а файл, на который проставлена
ссылка, в каталоге B. Как оформить такое?
Оформление
Для того, чтобы указать каталог уровнем выше, используйте
конструкцию "./". В данном случае ссылка на странице
в каталоге A на файл в каталоге B будет такой:
<a HREF="./B/file.zip">file.zip</a>
2. Как сделать ссылку на два каталога выше?
Оформление
Для того, чтобы делать ссылки каталогами выше используйте
предыдущую конструкцию. Просто повторяйте ее столько раз,
на сколько каталог выше уровнем. Пример:
<a HREF="././B/file.zip">file.zip</a>
Сначала это может показаться не понятным, но вы попробуйте.
Сразу все поймете и узнаете, что это на самом деле просто.
3. Как сделать ссылку на корневой каталог?
Допустим, имеется в корневом каталоге файл file.zip,
а страница находиться в каталоге A/PAGES/HTML/index.html.
Как поступить?
Оформление
Для ссылки на корневой каталог из любого места на диске
нужно перед адресом файла или страницы поставить одну черту
- "/". В данном случае ссылка будет такой:
<a HREF="/file.zip">file.zip</a>
Это пока все про каталоги. Хоть информации здесь на первый
взгляд не много, но она очень полезная. Вы это очень скоро
поймете, когда начнете делать сайт и у вас появиться несколько
каталогов и страниц.
Рисунки на гипертекстовых страницах - это одно из самых
больших и заметных достоинств вебдизайна. Они могут очень
здорово преобразить вид и представление страницы, особенно
когда они в тему и по существу. Многие уже задавали мне вопрос
- "Как вставить изображение?". На него я отвечал - всему свое
время, расскажу и об этом. И вот я выполняю свое обещание
и рассказываю о тэгах, способных управлять изображением.
Считаю нужным сразу определиться, какие графические форматы
используются в Интернет. Во-первых, это конечно GIF.
Файлы этого формата могут быть анимированными, хорошим примером
таких картинок служат баннеры - они есть везде, даже в этой
рассылке. Анимация особо примечательна, поэтому формат GIF
получил большое распространие. К тому же файлы этого формата
не большие, что само по себе привлекает к нему внимание.
Кроме GIF есть также формат JPEG, файлы которого
чаще имеют расширение JPG. Этот графический формат
тоже популярен, хотя он и не позволяет использовать анимацию.
Но тем не менне он известен тем, что при большой цветовой
насыщенности файлы JPG получаются более меньшего объема,
чем GIF. То есть JPG больше подходит для фотографий,
реалистичных картинок и прочего в таком роде, когда GIF
лучше использовать для хранения созданных на компьютере файлов
- анимированных, немногоцветных и прочих. Собственно эти два
формата и используются в Интернет. Скажу, что помимо них есть
еще несколько - тот же BMP формат (файлы которого огромного
размера), PNG формат и прочие. Но их использовать крайне нежелательно,
некоторые из них вообще не будут показываться броузером.
Для HTML разницы между форматами не существует. Работа с
одним совершенно не отличается от работы с другим, не нужно
даже указывать тип картинки. Собственно, для того, чтобы вставить
картинку, нужно всего лишь указать путь к ней, и она засветиться
у вас на страничке. Также, при желании можно принудительно
указывать ширину и высоту, при этом если эти
данные будут отличаться от реальных, размер отображаемой картинки
будет соответсвенно изменяться. Таким образом по вашим потребностям
можно растягивать/сужать изображение, причем делать это как
по вертикали, так и по горизонтали. Но с этим вам придется
разбираться самим, я лишь расскажу о тэгах, позволяющих это
делать.
| Тэги управления изображением |
Для управления рисунками на странице существует тэг <img>,
от английского слова image, что значит изображение.
Это тэг имеет несколько параметров, основные из них я сейчас
объясню.
Итак, главный параметр тэга <img> - это параметр
SRC (англ. Source - источник). Этот параметр
позволяет указать путь к картинке. При его использовании изображение
как раз и вставляется в документ. При указании пути к рисунку
действуют теже правила, что и в гипертекстовых ссылках - некоторые
мы прошли сегодня.
Так вот, если у нас есть картинка image.gif, и мы
решили вставить ее в документ, мы всего лишь напишем:
<img src="image.gif">
При этом к картинке будут применены все тэги, которые в
данный момент применяются к тексту. Конечно, не тэги вроде
<b> - картинка не станет жирной. А вот тэги <center>,
<p> и прочие вполне будут действовать.
Вот еще пример вставки картинки, находящийся в каталоге
на уровень выше и имеющей формат JPG:
<img src="./image.jpg">
Ну, что скажете? По-моему, очень просто. Надеюсь, вы тоже
так думаете и продолжаю дальше.
Ширина и высота картинки изменяются параметрами width
и height. При этом:
width - это ширина,
height - это высота.
Эти параметры совсем не обязательны, они используются по
нуждам дизайнера, иногда для принудительно изменения размера.
Бывают и другие случаи использования, но об этом в следующих
выпусках. Измеряется ширина и высота в пикселах, то есть в
точках. Если вы не поняли, вспомните расширения Windows -
800x600, 1024x768 и т.д. Вот это как раз и есть ШИРИНА
х ВЫСОТА, числа же - это количество точек, или иначе пикселов.
Вот пример (картинка JPG находиться в каталоге images):
<img src="images/image.jpg">
Теперь еще один параметр - использование рамки рисунков.
Он служит для управления рамкой, которой может быть окружено
любое изображение. Это параметр border, который указывает
толщину рамки все в тех же пикселах:
<img src="images/image.jpg" border="1">
При таком написании вокруг рисунка появиться рамка толщиной
в 1 пиксел. Параметр border используется редко, обычно
наоборот рамок вокруг рисунков избегают и пишут:
<img src="images/image.jpg" border="0">
При этом рамка исчезает, то есть ее толщина равна нулю.
Обычно броузеры не рисуют сами рамку, то есть по умолчанию
ее нет. Но иногда (в частности, при использовании рисунка
в качестве ссылки), она появляется. Вот тогда ее и вырубают.
Собственно это и все про тэги, управляющие рисунками. Здесь
вам нужно самим попрактиковаться - найдите какой-нибудь рисунок
и попробуйте его разместить. Далее по выпускам я буду рассказывать,
как разместить рисунок необходимым образом, о том, как окружить
его текстом и других возможностях, а пока остановлюсь только
на использовании рисунков в качестве ссылок.
| Изображение в качестве ссылки |
Помните, я в прошлом выпуске (N7) при изучении гипертекстовых
ссылок говорил, что в качестве таковой может быть изображение?
Я еще пообещал, что в следующем выпуске об этом расскажу?
Вот и пришел следующий выпуск и вы сейчас прочитаете, как
это сделать.
Вообще, возможность использования рисунков в ссылках это
замечательная возможность. Надо сказать, что владея ей, вы
сможете создавать замечательный кнопки (можете уже попробовать)
и составлять из них красивое меню. Да, еще - далее я обязательно
расскажу вам, как создавать изображения и кнопки с помощью
передовых графических редакторов (Macromedia Flash, Photoshop
и т.д), вам нужно будет это знать, как дизайнерам. Но это
только потом, в следующих выпусках.
Итак, вы имеете изображение и хотите, чтобы оно выступало
в качетсве ссылки. То есть при нажатии на него пользователь
должен перейти по заготовленной вами странице. Сделать это
очень просто - нужно всего лишь внутри тэгов сслыки (<a
href="..."></a>) вписать тэги изображения:
<a href="page.html"><img src="images/image.jpg"
border="0"></a>
При этом изображение будет ссылкой. И обратите внимание,
я убираю рамку изображения - border=0, в ссылках она
появляется сама собой.
Надо отметить, что в качестве ссылки может быть и изображение
и текст одновременно. Это иногда очень хорошо выглядит, особенно
когда изображение тематическое и подходит под ситуацию. Если
захотите увидеть такой пример в действии, вы найдете его у
меня на сайте Библиотека
программиста. В частности, зайдите по ссылке
"Книги по Ассемблеру", там вы увидите пронумерованный список
книг. У каждой будет ссылка "Загрузить", оформленная вместе
с рисунком - дискетой. Этот рисунок здесь в тему, получается
довольно неплохо. Некоторые книги имеют также ссылку "Содержание",
которая тоже своеобразно оформлена.
Этот прием довольно часто используется и дает неплохое оформление.
Релизуется же это так:
<a href="page.html">
<img src="images/image.jpg" border="0">
Перейти к page.html
</a>
Видите, я вставляю внутри ссылки сразу и изображение и текст?
То есть все просто как дважды два - что туда напишешь, то
и высветиться.
Вот теперь про рисунки все. Хочу сказать, что когда мы займется
изготовлением страниц, я выложу на сайте несколько коллекций
рисунков - больших, маленьких, всяких стрелок, кнопок, линий
и прочего. Будут рисунки наподобие тех, что используются у
меня в разделах "Книги по Ассмблеру" и некоторых других, то
есть приятно гарморирующие со ссылками. Но это позже, когда
оно потребуется.
Вот вы и закончили читать
этот практический выпуск. Понравился он вам или нет, полезен
ли - решать вам. Мне остается только надеятся на то, что
мои усилия не пропадут даром и я действительно смогу научить
кого-нибудь программированию - шаг за шагом. Собственно,
практические выпуски на это и расчитаны - чтобы помочь вам
более углубленно освоить изученную теорию.
Буду ждать мнений о выпуске, в частности о этой идее практических
выпусков, пишите. Решайте задания, помните, ответы на задачи
по Паскалю будут выложены на сайте, присылать их мне не
нужно. Занимайтесь!
На этом прощаюсь, до следующего выпуска!
|
