Информатика - Программирование - html - Графика
Возможность использования графики трудно переоценить. Без иллюстраций документ однообразен, вял и скучен. Расчетливо подобранная и правильно размещенная в документе графика делает его визуально привлекательнее. Изображения могут сделать текст вашего документа более содержательным.
Однако во всем нужно чувство меры. Это правило лишний раз подтверждается при просмотре ряда WEB-страниц. Довольно часто встречаются WEB-документы, загроможденные фоновыми изображениями, ничего не выражающей графикой и раздражающей анимацией. Планируя разместить на своей странице то или иное изображение, убедитесь, что оно действительно необходимо.
HTML
Информатика - Программирование - html - Графика
Скачать и читать Информатика - Программирование - html - ГрафикаИнформатика - Программирование - html - Форматирование
Информатика - Программирование - html - Форматирование
Пока наша страница выглядит не слишком привлекательно. С помощью HTML - тегов можно задать различные параметры форматирования текста.
Параграфы вводятся тэгом: <p></p>
<p align="center">текст</p> С помощью параграфов мы можем центрировать текст
<p align="left">текст</p> С помощью параграфов мы можем выровнять текст по левому краю
<p align="right">текст</p> С помощью параграфов мы можем выровнять текст по правому краю документа
<p align="justify">текст</p> С помощью параграфов мы можем выровнять текст по обоим краям документа
----
Задание
Введите параграфы в свой документ. Попробуйте подставить в параграф атрибут align с разными значениями. Например с "align="center".
<html>
<head>
<title>Моя первая страница </title>
</head>
<body text="#336699" bgcolor="#6699CC">
<p align="center">
Здравствуйте, это моя персональная страница.
<br>
<font color="#CC0000"> Вот как у меня получилось</font> </p>
<br><font color="#FF66FF">Персидская кошка наиболее популярная порода длинношерстных кошек с коренастой (cobby) плотной фигурой, широкой головой и привлекательными круглыми глазами они по-видимому появились почти одновременно в отдаленных гористых районах таких стран, как Персия, Турция и Китай.</font>
<br><font color="#663399">Персидская кошка имеет длинную шерсть с плотными подшерстком и пушистый хвост, так что для них уход за мехом имеет важное значение. Не думайте о покупке персидской кошки, если вы не можете выделять ежедневно время для расчесывания ее меха гребешком. На эту процедуру требуется как минимум пять минут, но это, конечно, вопрос чисто индивидуального подхода. </font>
<br><font color="#FFCC66">У некоторых кошек мех сваливается сильнее, чем у других, и для ухода за ними потребуются составы, придающие меху лоск. Некоторые хозяева затрачивают на уход за своими персидскими кошками каждый день от двадцати до тридцати минут. </font>
</body>
</html>
<p></p> - никогда нельзя вводить в документ подобную конструкцию
текст в документе, если не задавать параграфы, всегда выравнивается по умолчанию по левому краю
после закрывающего тега </p> автоматически происходит перенос строки
если вам этот перенос не нужен, есть альтернативный тэг <p align="center">: <center> текст </center> или <div align="center"> текст </div>
<div align="left"> текст </div>
<div align="right"> текст </div>
<div align="justify"> текст </div>
параграф не может содержать в себе другие параграфы, и также тэг <div></div>
<div> может содержать в себе параграфы
Заголовки
Размер шрифта для имеющихся заголовков задаются тегами от <Н1> (самый крупный) до <Н6> (самый мелкий)
Давайте теперь введем заголовок в наш документ. Мне кажется, что фраза "Здравствуйте, это моя первая страница" так и просится, чтобы ее выделили:
<html>
<head>
<title>Моя первая страница </title>
</head>
<body text="#336699" bgcolor="#6699CC">
<center>
<H3>Здравствуйте, это моя персональная страница.</H3>
<br>
<font color="#CC0000"> Мой кот - Шерри</font> </center>
<p align="justify">
<br><font color="#FF66FF">Персидская кошка наиболее популярная порода длинношерстных кошек с коренастой (cobby) плотной фигурой, широкой головой и привлекательными круглыми глазами они по-видимому появились почти одновременно в отдаленных гористых районах таких стран, как Персия, Турция и Китай.</font>
<br><font color="#663399">Персидская кошка имеет длинную шерсть с плотными подшерстком и пушистый хвост, так что для них уход за мехом имеет важное значение. Не думайте о покупке персидской кошки, если вы не можете выделять ежедневно время для расчесывания ее меха гребешком. На эту процедуру требуется как минимум пять минут, но это, конечно, вопрос чисто индивидуального подхода. </font>
<br><font color="#FFCC66">У некоторых кошек мех сваливается сильнее, чем у других, и для ухода за ними потребуются составы, придающие меху лоск. Некоторые хозяева затрачивают на уход за своими персидскими кошками каждый день от двадцати до тридцати минут. </font>
</p>
</body>
</html>
Заголовки предназначены для выделения небольшой части текста (строки, фразы). Но, если вы хотите выделить большой фрагмент текста, то заголовки для этого использовать нельзя. Для этого предназначен атрибут size тэга <font></font>, который устанавливает желаемый размер шрифта:
<font size="+4"> текст </font>
<font size="+3"> текст </font>
<font size="+2"> текст </font>
<font size="+1"> текст </font>
<font size="+0"> текст </font>
<font size="-1"> текст </font>
<font size="-2"> текст </font>
<html>
<head>
<title>Моя первая страница </title>
</head>
<body text="#336699" bgcolor="#6699CC">
<center>
<H3>Здравствуйте, это моя персональная страница.</H3>
<br>
<font color="#CC0000"> Вот как у меня получилось</font> </center>
<p align="justify">
<br><font color="#FF66FF">Персидская кошка наиболее популярная порода длинношерстных кошек с коренастой (cobby) плотной фигурой, широкой головой и привлекательными круглыми глазами они по-видимому появились почти одновременно в отдаленных гористых районах таких стран, как Персия, Турция и Китай.</font>
<br><font color="#663399">Персидская кошка имеет длинную шерсть с плотными подшерстком и пушистый хвост, так что для них уход за мехом имеет важное значение. Не думайте о покупке персидской кошки, если вы не можете выделять ежедневно время для расчесывания ее меха гребешком. На эту процедуру требуется как минимум пять минут, но это, конечно, вопрос чисто индивидуального подхода. </font>
<br><font color="#FFCC66"><font size="+4"> У некоторых кошек мех сваливается сильнее, чем у других, и для ухода за ними потребуются составы, придающие меху лоск. Некоторые хозяева затрачивают на уход за своими персидскими кошками каждый день от двадцати до тридцати минут. </font></font>
</p>
</body>
</html>
----
Стиль шрифта
Продолжаем форматирование нашего текста. Попробуем изменить стиль шрифта
<b> Полужирный текст </b>
<i> Наклонный текст (курсив) </i>
<u> Подчеркнутый текст </u>
<strike> Перечеркнутый </strike>
<s> Перечеркнутый </s>
<small> Малый </small>
Нормальный текст
<big> Большой </big>
Верхний индекс <sup> sup </sup>
Нижний индекс <sub> sub </sub>
Тип Шрифта
<font face="arial"> текст (шрифт Arial)</font>
Какие же типы шрифтов являются стандартными, и по идее должны находиться на компьютере каждого пользователя - это:
* Times;
* Times New Roman;
* Arial;
* Helvetica;
* Courier;
* Verdana;
* Tahoma;
* Comic Sans;
* Garamond
Пока наша страница выглядит не слишком привлекательно. С помощью HTML - тегов можно задать различные параметры форматирования текста.
Параграфы вводятся тэгом: <p></p>
<p align="center">текст</p> С помощью параграфов мы можем центрировать текст
<p align="left">текст</p> С помощью параграфов мы можем выровнять текст по левому краю
<p align="right">текст</p> С помощью параграфов мы можем выровнять текст по правому краю документа
<p align="justify">текст</p> С помощью параграфов мы можем выровнять текст по обоим краям документа
----
Задание
Введите параграфы в свой документ. Попробуйте подставить в параграф атрибут align с разными значениями. Например с "align="center".
<html>
<head>
<title>Моя первая страница </title>
</head>
<body text="#336699" bgcolor="#6699CC">
<p align="center">
Здравствуйте, это моя персональная страница.
<br>
<font color="#CC0000"> Вот как у меня получилось</font> </p>
<br><font color="#FF66FF">Персидская кошка наиболее популярная порода длинношерстных кошек с коренастой (cobby) плотной фигурой, широкой головой и привлекательными круглыми глазами они по-видимому появились почти одновременно в отдаленных гористых районах таких стран, как Персия, Турция и Китай.</font>
<br><font color="#663399">Персидская кошка имеет длинную шерсть с плотными подшерстком и пушистый хвост, так что для них уход за мехом имеет важное значение. Не думайте о покупке персидской кошки, если вы не можете выделять ежедневно время для расчесывания ее меха гребешком. На эту процедуру требуется как минимум пять минут, но это, конечно, вопрос чисто индивидуального подхода. </font>
<br><font color="#FFCC66">У некоторых кошек мех сваливается сильнее, чем у других, и для ухода за ними потребуются составы, придающие меху лоск. Некоторые хозяева затрачивают на уход за своими персидскими кошками каждый день от двадцати до тридцати минут. </font>
</body>
</html>
<p></p> - никогда нельзя вводить в документ подобную конструкцию
текст в документе, если не задавать параграфы, всегда выравнивается по умолчанию по левому краю
после закрывающего тега </p> автоматически происходит перенос строки
если вам этот перенос не нужен, есть альтернативный тэг <p align="center">: <center> текст </center> или <div align="center"> текст </div>
<div align="left"> текст </div>
<div align="right"> текст </div>
<div align="justify"> текст </div>
параграф не может содержать в себе другие параграфы, и также тэг <div></div>
<div> может содержать в себе параграфы
Заголовки
Размер шрифта для имеющихся заголовков задаются тегами от <Н1> (самый крупный) до <Н6> (самый мелкий)
Давайте теперь введем заголовок в наш документ. Мне кажется, что фраза "Здравствуйте, это моя первая страница" так и просится, чтобы ее выделили:
<html>
<head>
<title>Моя первая страница </title>
</head>
<body text="#336699" bgcolor="#6699CC">
<center>
<H3>Здравствуйте, это моя персональная страница.</H3>
<br>
<font color="#CC0000"> Мой кот - Шерри</font> </center>
<p align="justify">
<br><font color="#FF66FF">Персидская кошка наиболее популярная порода длинношерстных кошек с коренастой (cobby) плотной фигурой, широкой головой и привлекательными круглыми глазами они по-видимому появились почти одновременно в отдаленных гористых районах таких стран, как Персия, Турция и Китай.</font>
<br><font color="#663399">Персидская кошка имеет длинную шерсть с плотными подшерстком и пушистый хвост, так что для них уход за мехом имеет важное значение. Не думайте о покупке персидской кошки, если вы не можете выделять ежедневно время для расчесывания ее меха гребешком. На эту процедуру требуется как минимум пять минут, но это, конечно, вопрос чисто индивидуального подхода. </font>
<br><font color="#FFCC66">У некоторых кошек мех сваливается сильнее, чем у других, и для ухода за ними потребуются составы, придающие меху лоск. Некоторые хозяева затрачивают на уход за своими персидскими кошками каждый день от двадцати до тридцати минут. </font>
</p>
</body>
</html>
Заголовки предназначены для выделения небольшой части текста (строки, фразы). Но, если вы хотите выделить большой фрагмент текста, то заголовки для этого использовать нельзя. Для этого предназначен атрибут size тэга <font></font>, который устанавливает желаемый размер шрифта:
<font size="+4"> текст </font>
<font size="+3"> текст </font>
<font size="+2"> текст </font>
<font size="+1"> текст </font>
<font size="+0"> текст </font>
<font size="-1"> текст </font>
<font size="-2"> текст </font>
<html>
<head>
<title>Моя первая страница </title>
</head>
<body text="#336699" bgcolor="#6699CC">
<center>
<H3>Здравствуйте, это моя персональная страница.</H3>
<br>
<font color="#CC0000"> Вот как у меня получилось</font> </center>
<p align="justify">
<br><font color="#FF66FF">Персидская кошка наиболее популярная порода длинношерстных кошек с коренастой (cobby) плотной фигурой, широкой головой и привлекательными круглыми глазами они по-видимому появились почти одновременно в отдаленных гористых районах таких стран, как Персия, Турция и Китай.</font>
<br><font color="#663399">Персидская кошка имеет длинную шерсть с плотными подшерстком и пушистый хвост, так что для них уход за мехом имеет важное значение. Не думайте о покупке персидской кошки, если вы не можете выделять ежедневно время для расчесывания ее меха гребешком. На эту процедуру требуется как минимум пять минут, но это, конечно, вопрос чисто индивидуального подхода. </font>
<br><font color="#FFCC66"><font size="+4"> У некоторых кошек мех сваливается сильнее, чем у других, и для ухода за ними потребуются составы, придающие меху лоск. Некоторые хозяева затрачивают на уход за своими персидскими кошками каждый день от двадцати до тридцати минут. </font></font>
</p>
</body>
</html>
----
Стиль шрифта
Продолжаем форматирование нашего текста. Попробуем изменить стиль шрифта
<b> Полужирный текст </b>
<i> Наклонный текст (курсив) </i>
<u> Подчеркнутый текст </u>
<strike> Перечеркнутый </strike>
<s> Перечеркнутый </s>
<small> Малый </small>
Нормальный текст
<big> Большой </big>
Верхний индекс <sup> sup </sup>
Нижний индекс <sub> sub </sub>
Тип Шрифта
<font face="arial"> текст (шрифт Arial)</font>
Какие же типы шрифтов являются стандартными, и по идее должны находиться на компьютере каждого пользователя - это:
* Times;
* Times New Roman;
* Arial;
* Helvetica;
* Courier;
* Verdana;
* Tahoma;
* Comic Sans;
* Garamond
Информатика - Программирование - html - Настройки цвета
Информатика - Программирование - html - Настройки цвета
Давайте окрасим слова "Вот как у меня получилось" в красный.
<font color="#CC0000"> Вот как у меня получилось </font>
Color – параметр (атрибут) для тэга font, он отвечает, в данном случае, за цвет заключенного в контейнер текста. Атрибут color, как и другие атрибуты, не принадлежит только одному тэгу, он может быть присвоен и некоторым другим тэгам.
Скачать и читать Информатика - Программирование - html - Настройки цветаДавайте окрасим слова "Вот как у меня получилось" в красный.
<font color="#CC0000"> Вот как у меня получилось </font>
Color – параметр (атрибут) для тэга font, он отвечает, в данном случае, за цвет заключенного в контейнер текста. Атрибут color, как и другие атрибуты, не принадлежит только одному тэгу, он может быть присвоен и некоторым другим тэгам.
Информатика, учебное пособие для 7-11 классов - Гаевский А.Ю. - 2006
Информатика - Учебное пособие для 7-11 классов - Гаевский А.Ю. - 2006
В пособии в соответствии с программой по информатике для общеобразовательных школ изложены основные понятия информатики, устройство компьютеров, работа в операционных системах Windows 9.Х/2000 и MS-DOS. Описаны компьютерные технологии подготовки текстовых документов (Блокнот, Word), создания графических изображений (Paint), вычислений в электронных таблицах (Excel), работы с базами данных (Access). Большое внимание уделяется вопросам компьютерных коммуникаций, Интернету, работе с электронной почтой, созданию HTML-документов и Web-сайтов. Изложены учебные вопросы моделирования на компьютере, составления алгоритмов и программ, работы в средах программирования Quick Basic и Turbo Pascal.
Предназначено для учеников общеобразовательных средних школ, лицеев, гимназий, а также для широкого круга пользователей персональных компьютеров.
Скачать и читать Информатика, учебное пособие для 7-11 классов - Гаевский А.Ю. - 2006В пособии в соответствии с программой по информатике для общеобразовательных школ изложены основные понятия информатики, устройство компьютеров, работа в операционных системах Windows 9.Х/2000 и MS-DOS. Описаны компьютерные технологии подготовки текстовых документов (Блокнот, Word), создания графических изображений (Paint), вычислений в электронных таблицах (Excel), работы с базами данных (Access). Большое внимание уделяется вопросам компьютерных коммуникаций, Интернету, работе с электронной почтой, созданию HTML-документов и Web-сайтов. Изложены учебные вопросы моделирования на компьютере, составления алгоритмов и программ, работы в средах программирования Quick Basic и Turbo Pascal.
Предназначено для учеников общеобразовательных средних школ, лицеев, гимназий, а также для широкого круга пользователей персональных компьютеров.
Информатика и информационные технологии, учебник для 10-11 классов - Угринович Н.Д. - 2003
Информатика и информационные технологии - Учебник для 10-11 классов - Угринович Н.Д. - 2003
Учебник предназначен для изучения курса «Информатика и информационные технологии» (ИИТ) в общеобразовательных учреждениях. Учебно-методический комплект (учебник, практикум, методическое руководство, компьютерный практикум на CD-ROM), в который входит данный учебник, полностью соответствует разработанному Министерством образования новому общеобразовательному стандарту по ИИТ и обеспечивает возможность изучения углубленного курса ИИТ в 10-11 классах по естественно-математическому, информационно-технологическому и общеобразовательному профилям. Особое внимание уделено изучению объектно-ориентированного программирования на языке Visual Basic, основ логики, систем счисления и коммуникационных технологий. Содержание учебника соответствует программе вступительных экзаменов по информатике в вузы и может быть использовано для подготовки к экзаменам.
Скачать и читать Информатика и информационные технологии, учебник для 10-11 классов - Угринович Н.Д. - 2003Учебник предназначен для изучения курса «Информатика и информационные технологии» (ИИТ) в общеобразовательных учреждениях. Учебно-методический комплект (учебник, практикум, методическое руководство, компьютерный практикум на CD-ROM), в который входит данный учебник, полностью соответствует разработанному Министерством образования новому общеобразовательному стандарту по ИИТ и обеспечивает возможность изучения углубленного курса ИИТ в 10-11 классах по естественно-математическому, информационно-технологическому и общеобразовательному профилям. Особое внимание уделено изучению объектно-ориентированного программирования на языке Visual Basic, основ логики, систем счисления и коммуникационных технологий. Содержание учебника соответствует программе вступительных экзаменов по информатике в вузы и может быть использовано для подготовки к экзаменам.
Самоучитель HTML
Самоучитель HTML
С чего начинать?
Текст.
Цвет и фон.
Изображения.
Изображения-карты.
Ссылки.
Стили (CSS).
Мета-теги. (HTML создатель мета тегов)
Таблицы. (HTML создатель таблиц)
Списки.
Формы.
E-mail форма. (Почтовая форма на странице и проверка ее полей).
Горизонтальные линии.
Список элементов HTML. (Основные теги, используемые в Web-дизайне. Описание).
Раскладка цветовой гаммы по RGB-составляющим. (Название цветов на английском языке и в шестнадцатеричном виде).
Спецсимволы в HTML. (Специальные символы, математические, знаки препинания и прочие).
Курсоры.
Фильтры, применяемые к тексту.
Фильтры, применяемые к изображению.
Дополнительные возможности тега <BODY>
Новые окна. (HTML создатель ссылок для открытия новых окон с определенными параметрами).
Полезные советы Web-мастеру. (Информация, которую нужно учитывать при создании сайта).
JavaScript.
События.
Окна с сообщениями.
Кнопки.
Простые вредоносные JavaScripts.
Скачать и читать Самоучитель HTMLС чего начинать?
Текст.
Цвет и фон.
Изображения.
Изображения-карты.
Ссылки.
Стили (CSS).
Мета-теги. (HTML создатель мета тегов)
Таблицы. (HTML создатель таблиц)
Списки.
Формы.
E-mail форма. (Почтовая форма на странице и проверка ее полей).
Горизонтальные линии.
Список элементов HTML. (Основные теги, используемые в Web-дизайне. Описание).
Раскладка цветовой гаммы по RGB-составляющим. (Название цветов на английском языке и в шестнадцатеричном виде).
Спецсимволы в HTML. (Специальные символы, математические, знаки препинания и прочие).
Курсоры.
Фильтры, применяемые к тексту.
Фильтры, применяемые к изображению.
Дополнительные возможности тега <BODY>
Новые окна. (HTML создатель ссылок для открытия новых окон с определенными параметрами).
Полезные советы Web-мастеру. (Информация, которую нужно учитывать при создании сайта).
JavaScript.
События.
Окна с сообщениями.
Кнопки.
Простые вредоносные JavaScripts.
Учебник по Html для чайников. Инструментарий.
Учебник по Html для чайников. Инструментарий.
Для учеников лицеев и колледжей.
Сборник лекций с практическими заданиями
Скачать и читать Учебник по Html для чайников. Инструментарий.Для учеников лицеев и колледжей.
Сборник лекций с практическими заданиями
Самоучитель JavaScript, второе издание, Дунаев В.
Д83 Самоучитель JavaScript, 2-е изд. - СПб.: Питер, 2005. - 395 с.: ил.
ISBN 5-469-00804-5
Эта книга предназначена для самостоятельного освоения программирования на языке JavaScript. Кроме общего руководства, она содержит множество примеров и текстов готовых к использованию программ. Рассматриваются вопросы создания сценариев для веб-сайтов, а также сценариев, выполняемых Windows Scripting Host. В приложениях приводится справочная информация по JavaScript и HTML. Книга адресована как новичкам, так и тем, кто уже имеет некоторый опыт в веб-дизайне и программировании. Во втором издании книги исправлены
замеченные опечатки и неточности.
ББК 32.988.02-018я7
УДК 004.738.5(075)
ISBN 5-469-00804-5 © ЗАО Издательский дом «Питер», 2005
Купить бумажную или электронную книгу и скачать и читать Самоучитель JavaScript, второе издание, Дунаев В.ISBN 5-469-00804-5
Эта книга предназначена для самостоятельного освоения программирования на языке JavaScript. Кроме общего руководства, она содержит множество примеров и текстов готовых к использованию программ. Рассматриваются вопросы создания сценариев для веб-сайтов, а также сценариев, выполняемых Windows Scripting Host. В приложениях приводится справочная информация по JavaScript и HTML. Книга адресована как новичкам, так и тем, кто уже имеет некоторый опыт в веб-дизайне и программировании. Во втором издании книги исправлены
замеченные опечатки и неточности.
ББК 32.988.02-018я7
УДК 004.738.5(075)
ISBN 5-469-00804-5 © ЗАО Издательский дом «Питер», 2005
HTML
Предыдущая
Следующая
Показана страница 9 из 9