АвтоАвтоматизацияАрхитектураАстрономияАудитБиологияБухгалтерияВоенное делоГенетикаГеографияГеологияГосударствоДомДругоеЖурналистика и СМИИзобретательствоИностранные языкиИнформатикаИскусствоИсторияКомпьютерыКулинарияКультураЛексикологияЛитератураЛогикаМаркетингМатематикаМашиностроениеМедицинаМенеджментМеталлы и СваркаМеханикаМузыкаНаселениеОбразованиеОхрана безопасности жизниОхрана ТрудаПедагогикаПолитикаПравоПриборостроениеПрограммированиеПроизводствоПромышленностьПсихологияРадиоРегилияСвязьСоциологияСпортСтандартизацияСтроительствоТехнологииТорговляТуризмФизикаФизиологияФилософияФинансыХимияХозяйствоЦеннообразованиеЧерчениеЭкологияЭконометрикаЭкономикаЭлектроникаЮриспунденкция

Создание кнопок на web-странице

Читайте также:
  1. PR через создание виртуальных групп
  2. VI раздел. Создание представлений о здоровом образе жизни
  3. В. ВУНДТ И СОЗДАНИЕ ЭКСПЕРИМЕНТАЛЬНОЙ ПСИХОЛОГИИ
  4. Вопрос 26. Табличный процессор.Создание и проведение расчетов с помощью электронных таблиц. Автоматизация информационных процессов
  5. Вопрос 7 . Создание и деятельность межправительственных организаций при ООН.
  6. Всякая система является результатом процесса ее организации, но далеко не всякий процесс заканчивается созданием системы.
  7. г) Создание потенциала
  8. Глава 2. Создание, реорганизация и ликвидация кредитного кооператива (статьи 7 - 10)
  9. Д. Перкинс, Т. Мюррей и др.) рассматривали мировую политику с помощью правовых и этических категорий, ориентируясь на создание нормативных моделей мировых политических отношений.
  10. Добавление элементов: создание внешнего интерфейса
  11. За допомогою кнопок панелі Рисование
  12. Задание 2.1. «Создание и редактирование таблиц»

 

Еще одно частое применение графических элементов — это оформление кнопок. Кнопка — это элемент взаимодействия с пользователем, так как предполагается, что когда он на ней нажмет, то что-нибудь произойдет.

Выделяют три типа кнопок:

· кнопки отправки: При активизации такой кнопки производится отправка формы. В форме может быть несколько кнопок отправки.

· кнопки сброса: При активизации такой кнопки для всех управляющих элементов устанавливаются исходные значения.

· прочие кнопки: Для таких кнопок действие по умолчанию не определено. С атрибутами событий каждой такой кнопки могут быть связаны клиентские скрипты. Если происходит событие (например, пользователь нажимает кнопку, отпускает ее и т.д.), включается связанный с событием скрипт.

Необходимо определять язык скрипта для кнопок в объявлении скрипта по умолчанию (в элементе META).

Кнопки создаются с помощью элемента BUTTON или INPUT. Э лемент BUTTON предоставляет более широкие возможности представления кнопки, чем элемент INPUT.

Чтобы создать кнопку, достаточно поместить некоторый текст между тегами <BUTTON> и </BUTTON>, например, вот так:

<BUTTON>ЭТO KHОПKА</BUTTON>

Правда, из этого совершенно не следует, что при нажатии на этой кнопке что-нибудь произойдет.

Однако кнопка будет вполне полноценной и даже будет “вдавливаться” при нажатии.

Интереснее тот факт, что между тегами <BUTTON>...</BUTTON> можно поместить не только текст, а все, что угодно. Если мы поместим туда тег <IMG>, то получим кнопку с графическим изображением. Можно поместить на кнопку и текст, и изображение (только не надо забывать о форматировании — например, надо вставлять теги <BR> для переноса строк и т. д.). Наконец, как показано в следующем примере, можно поместить на кнопку вообще любой блок НТМL! В нашем примере мы поместили туда целую таблицу с разноцветными клетками.

 

Пример оформления кнопок:

<HTML>

<HEAD>

<TITLE>KHOПKИ</TITLE>

<STYLE>

TD {color: white;}

</STYLE>

</HEAD>

<BODY>

<BUTTON>ПРОСТО КНОПКА</BUTTON>

<BR><BR>

<button><img SRC="notre_dame.gif" BORDER="0" WIDTH="26"

HEIGHT="23" ALT="картинка"></BUTTON><BR><BR>

<BUTTON>Internet Explorer<BR>

<IMG SRC="eif.JPG" WIDTH="62" HEIGHT="61" BORDER="0"><BR> 4.0 </BUTTON><BR><BR>

<BUTTON><H1> Это большая кнопка</Н1>

<TABLE ALIGN="center" BGCOLOR="#408080" WIDTH="280" CELLSPACING="2" CELLPADDING="2"

BORDER="3">

<TR>

<TD ALIGN="center" BGCOLOR-"#400040">Oнa содержит</ТD>

<TD ALIGN="center">целую таблицу</ТR> </TR> <TR>

<TD ALIGN="center">c разноцветными</ТD>

<TD ALIGN="center" BGCOLOR="#400040">Клеточки</TD> </TR>

</TABLE>

<BR>И ГОРИЗОНТАЛЬНУЮ ЛИНИЮ <HR WIDTH="400" SIZE="10" COLOR="Navy"> </BUTTON>

</BODY>

</HTML>

 

Тег <STYLE>, был использован в этом примере для того, чтобы более быстрым способом отобразить белыми буквами текст в ячейках таблицы.

Применение кнопок очень разнообразно. В следующем примере кнопки используются для смены цвета фона документа:

<html>

<head>

<title>bgcolor</title>

</head>

<body text=000000 bgcolor=ffffff>

<table border=0 align=center>

<tr><td><form>

<input type=button value="красный" onClick="document.bgColor='red'">

<input type=button value="желтый" onClick="document.bgColor='yellow'">

<input type=button value="синий" onClick="document.bgColor='0000ff'">

<input type=button value="голубой" onClick="document.bgColor='blue'">

<input type=button value="коралловый" onClick="document.bgColor='ff7f50'">

</form></td>

</table>

</body>

</html>

 


1 | 2 | 3 | 4 | 5 | 6 |

Поиск по сайту:

Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Студалл.Орг (0.004 сек.)