Similar presentations:
Язык HTML. Графика на Web-странице
1. Язык HTML
Графикана Web-странице.
2. Размещение графики
<img src=“путь вставляемого объекта”>*.gif, *.jpg, *.png
Picture\foto.gif
3.
<HTML><HEAD>
<TITLE> Пробный файл </TITLE>
</HEAD>
<BODY background="\Новая папка\a4.gif" >
<P><I><font color="red" face="Arial" size="5">
<H1 align=center> Расписание </H1>
уроков 10-3 класса
<img src="book.png">
4.
5.
Атрибуты изображенияАтрибуты
Формат
<img src=“foto.gif ” alt=“картина”>
ALT
Описание
Если браузер не воспринимает
изображение, вместо него
появляется заменяющий текст.
BORDER
<img src=“foto.gif ” border=3> Задает толщину рамки вокруг
ALIGN
<img src=“foto.gif ” align=top> Выравнивает изображение
HEIGHT
<img src=“foto.gif ” height=272> Задает вертикальный размер
WIDTH
<img src=“foto.gif ” width=321>
Задает горизонтальный размер
изображения в пикселях.
VSPACE
<img src=“foto.gif ” vspace=8>
Добавляет верхнее и нижнее
пустые поля.(левое и правое)
изображения. Измеряется в
пикселях.
относительно текста:
•Top- по верхней части
изображения
•Bottom –по нижней
•Middle – по середине
изображения в пикселях.
6.
Оформление таблиц.Тег
Форма записи
TABLE
TR
TD
Примечание
<table> текст </table> Объявление таблиц
<tr> текст </tr>
<td> текст </td>
Тег строки
Тег данных
Атрибуты тега TABLE
Тег
Форма записи
Примечание
BORDER <table border=x>
Задает рамку вокруг таблицы
(1- самая тонкая).
WIDTH <table width=xx%>
Задает ширину таблицы как
ХХ% от ширины страницы или
как ХХ пикселей
BGCOLOR <table bgcolor=“#RRGGBB”> Задает цвет фона таблицы.
7.
Атрибуты тега TD и TRТег
Форма записи
Примечание
ALIGN
<td align=x>
Устанавливает
выравнивание по
горизонтали (RIGHT –
вправо, LEFT – влево,
CENTER – по центру)
VALIGN
<td valign=x>
Устанавливает
выравнивание по
вертикали (TOP – по
верху, MIDDLE – по
середине , BOTTOM –
по низу, BASELINE –
по базовой линии)
BGCOLOR
<td bgcolor=“#RRGGBB”> Задает цвет фона ячейки
8.
Записи цвета в формате RGBRRGGBB
цвет
000000
FFFFFF
черный
FF0000
00FF00
Красный
00FFFF
0000FF
Бирюзовый
FF00FF
FFFF00
Фиолетовый
996633
FF8000
8000FF
Коричневый
A0A0A0
Серый
Белый
Зеленый
Синий
Желтый
Оранжевый
Лиловый
9.
10.
<table border="1" width=50% bgcolor="99cccc"><tr bgcolor="ccccff" align=center>
<td> Урок </td>
<td> Понедельник</td>
<td> Вторник </td>
</tr>
<tr>
<td> 1 </td>
<td> Алгебра </td>
<td> Химия </td>
</tr>
<tr>
<td> 2 </td>
<td> Физика </td>
<td> Геометрия </td>
</tr>
<tr>
<td> 3 </td>
<td> Физкультура </td>
<td> История </td>
</tr>
11.
•Bordercolor= цвет - задает цвет рамки (черносерая по умолчанию)•COLSPAN = “n”– объединение n ячеек в
строке
•ROWSPAN = “n” – объединение n ячеек в
столбце.
•CELLPADDING= “n” - определяет отступы
между ячейками ( в пикселях)
•CELLSPACING=“n” – определяет отступы
между границей ячеек и текстом (в пикселях)
•<BODY text = “ цвет”> … </BODY> определяет цвет текста (черный по умолчанию)
12.
13.
<body … text="#ffff00"><center><table border="12" cellpadding="10" cellspacing="10"
width="1">
<tbody><tr>
<td>Температура</td>
<td>Давление</td>
<td>Влажность</td>
<td>Скорость ветра</td>
<td>Направление ветра</td>
</tr>
<tr>
<td>21</td>
<td>754</td>
<td>75</td>
<td>4</td>
<td>запад</td>
</tr>
…