Листинг 4.9. Расположение текста или изображения внутри ячейки таблицы
<HTML> <HEAD>
<TITLE>Расположение текста или изображения
внутри ячейки таблицы</TITLE>
<script>
<!-—
function set(obj)
{ var d=document
if(obj.elements[0].checked) {d.all("itab").align="LEFT"}
else
if(obj.elements[1].checked) {d.all("itab").align="MIDDLE"}
else
if(obj.elements[2].checked) {d.all("itab").align="RIGHT"}
if(obj.elements[3].checked) {d.all("itab").vAlign="TOP"}
else
if(obj.elements[4].checked) {d.all("itab").vAlign="MIDDLE"}
else
if(obj.elements[5].checked) {d.all("itab").vAlign="BOTTOM"}
}
function rset(obj)
{ var d=document
d.all("itab").align="LEFT"
d.all("itab").vAlign="TOP"
}
//—>
</script>
<BODY bgcolor="F8F8FF">
<H3 align=center>Pacпoлoжeниe текста или изображения
внутри ячейки</Н3>
Выберите значения параметров, которые Вас интересуют,
и нажмите кнопку <В>Просмотр</В>.
<TABLE border=2>
<TR>
<TD><H4 align=center>Значения параметров выравнивания
таблицы</Н4>
<TD><H4 align=center>Действия при выбранных значениях
параметров</Н4>
</TR>
<TR>
<TD>
<FORM name="form1">
Горизонтальное выравнивание<br>
<input typ'e="radio" name="al" value=0 checked>LEFT<br>
<input type="radio" name="al" value=l>CENTER<br>
<input type="radio" name="al" value=2>RIGHT<P>
Вертикальное выравнивание<br>
<input type="radio" name="vl" value=3 checked>TOP<br>
<input type="radio" name="vl" value=4>MIDDLE<br>
<input type="radio" name="vl" value=5>BOTTOM<br>
</FORM>
</TD>
<TD id="itab" bgcolor=blue background="firering.jpg" height=160
valign=TOP align=LEFT>
<IMG src="6rkranim.gif" border=2 height=120>
</TD>
</TR>
</TABLE><P>
<input type="button" value= "Просмотр" onclick="set(forml)">
<input type="reset" value="Обновить" onclick="rset()">
</BODY>
</HTML>
Таблицы в HTML используются не только для представления табличных данных, но и как средство размещения на странице различных текстовых и графических объектов. Можно задать цвет фона таблицы или фоновое изображение, отличное от цвета фона или фонового изображения всего документа. Рамку с тенью можно указать, варьируя толщину рамки таблицы. Интересные эффекты получаются, если в таблицу поместить изображение, а затем подбирать для нее цвет фона. При выборе фона изображение каждый раз будет в разном обрамлении.
Фоновое изображение таблицы
Необходимо написать сценарий, который позволяет выбрать фоновое изображение для таблицы, содержащей рисунок. Требуется предусмотреть возможность изменения толщины рамки таблицы для того, чтобы создать эффект выпуклости изображения.
Варианты для выбора фонового изображения расположим в документе слева, а справа поместим таблицу, для которой определяется фон, и которая содержит изображение (рис. 4.7).
Атрибут CELLSPACING назначает ширину промежутка между ячейками. В рассматриваемом примере чем больше значение этого параметра, тем шире рамка вокруг изображения. Задание фонового изображения для таблицы определяет цвет рамки вокруг изображения. Имена графических файлов, используемых в качестве фонового изображения: fonl.gif, fon2.gif, ..,, fon8.gif. Все графические файлы содержатся в текущей папке.
HTML-код приведен в листинге 4.10.