Листинг 4.7. Расположение изображения относительно строки

<HTML>

<HEAD>

<TITLE>Расположение изображения относительно строки</TITLE>

<script>

<!-—

var s1="Верхняя граница изображения выравнивается " +

"по самому высокому элементу текущей строки"

var s2="Верхняя граница изображения выравнивается " +

"по самому высокому текстовому элементу текущей строки"

var s3="Выравнивание середины изображения " +

"по базовой линии текущей строки"

var s4="Выравнивание середины изображения " +

"по середине текущей строки"

var s5="Выравнивание нижней границы изображения по базовой линии " +

"текущей строки"

var s6="Выравнивание нижней границы изображения " +

"по нижней границе текущей строки"

var s=""

function set(obj)

{ switch (Number(obj.value))

{

case 0: s=sl; break;

case 1: s=s2; break;

case 2: s=s3; break;

case 3: s=s4; break;

case 4: s=s5; break;

case 5: s=s6; break;

}

obj.form.elements[6].value=s

}

//-->

</script>

</HEAD>

<BODY bgcolor="F8F8FF">

<H3 align=center>Расположение изображения относительно строки</НЗ>

Выберите значение параметра, который Вас интересует

<TABLE border=2>

<TR><TD align=center><H4>Значение параметра выравнивания align</H4>

<TD align=center><H4>Действия при выбранном значении

параметра</Н4></ТR>

<TR><TD>

<FORM name="form1">

<input type="radio" name="ln" value=0 checked

onFocus="set(forml.elements[0])">TOP<br>

<input type="radio" name="ln" value=l

onFocus="set(forml.elements[1])">TEXTTOP<br>

<input type="radio" name="ln" value=2

onFocus="set(forml.elements[2])">MIDDLE<br>

<input type="radio" name="ln" value=3

onFocus="set(forml.elements[3])">ABSMIDDLE<br>

<input type="radio" name="ln" value=4

onFocus="set(forml.elements[4])">BOTTOM или BASELINE<br>

<input type="radio" name="ln" value=5

onFocus="set(forml.elements[5])">ABSBOTTOM<br>

<FORM name="form1">

</TD>

<TD align=center> <textarea name="res" cols=30 rows=4>

Верхняя граница изображения выравнивается по самому высокому

элементу текущей строки </textarea><br></TD></TR>

</TABLE>

<Р>

<input type="reset" value="Обновить">

</BODY>

</HTML>

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

Изображение как часть строки

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

 

Документ состоит из двух частей. В верхней части перечислены возможные значения параметра выравнивания изображения, рассматриваемого как элемент строки. В нижней части документа располагаются текст и изображение, к которому применяются выбранные действия при нажатии кнопки Просмотр.Рис. 4.5. соответствует ситуации, при которой происходит выравнивание середины изображения по базовой линии текущей строки.

Документ, содержащий HTML-код для решения задачи, представлен в листинге 4.8.