Варна - 2006

Съдържание:

HTML - Въведение
HEAD
BODY - фон, текст, цветове на връзките
FONT - работа с текстове
Форматиране на параграфи
Цветове
Хипервръзки
IMG - Изображения
Таблици
Списъци
Формуляри
Линии
Фреймове
Музикален фон

Формуляри

  • формулярите са един особен вид средство за обмяна на информация между разработчика на сайта и неговите посетители.

Текстови връзки към други файлове :

Общия вид на формулярите е:

<form>

   <input type ="стойност"/>
   < input type =" стойност " />
   < input type =" стойност " />
   ...
   ...
   ...

</form>

 

Въвеждане на поле за текст във формуляр

  • <input type =" text " />
  • В този случай на страницата ще се изобрази текстово поле, което по подразбиране има дължина 20 символа /тъй като не сме задали изрично дължина на полето/.
  • Атрибутите на тага за текст са:
    • Атрибута name , който приема като стойност името, което дадете на полето. Например name="Email".
    • Атрибута size - дължината на текстовото поле в брой символи (например size ="45" ).
    • Чрез атрибута value може да се зададе текст, който да се вижда в текстовото поле преди още потребителя да е въвел някаква информация. Например ако текстовото поле е предназначено да съдържа уеб-адреса на клиента, е уместно да се въведе атрибута value и да му се зададе стойност http ://
    • Чрез атрибута maxlenght може да въведете ограничение на броя на изписваните в текстовото поле символи. Например ако зададете maxlenght ="10" в текстовото поле няма да бъде възможно да се въведат повече от 10 символа /букви, цифри и др./.

Пример:

<form>
Вашето име: <input type="text" name="Name" size="45" maxlenght="40" /> <br />
Вашия имейл: <input type="text" name="EmailAddress" size ="45" maxlenght ="40" /><br />
Вашия уеб-адрес: <input type="text" name=" WebAddress " size ="45" maxlenght ="40" value ="http://" />
</form>

Въвеждане на полета за маркиране (checkbox)

<form>
Какво правите през свободното си време?<br />
<input type="checkbox" name="Choice" value="sport" checked="checked" /> Спортувам<br />
<input type="checkbox" name="Choice" value="Ucha" /> Уча<br />
<input type="checkbox" name="Choice" value ="Tanci" /> На танци
</form>

  • Тъй като полетата за маркиране предоставят някакъв избор, те трябва да са поне 2 на брой или повече.
  • Името, което ще се присвои като стойност на атрибута name трябва да бъде еднакво за всички полета за маркиране от формуляра, за да се покаже, че това са документи, починени на една и съща тема.
  • Чрез атрибута value се задава название на съответното поле за маркиране, чрез което полетата да се различават.
  • Ако желаете едно от полетата за маркиране да бъде маркирано предварително /по подразбиране/, трябва да използвате атрибута checked , като му зададете за стойност собственото му название /checked =" checked "/.

Единичен избор (радио-бутони)

<form>
В кой клас сте? <br />
<input type="radio" name="OneChoice" value="ix" checked="checked" />IX<br />
<input type="radio" name="OneChoice" value="X" /> X <br />
<input type="radio" name="OneChoice" value="XI" /> XI <br />
<input type="radio" name ="OneChoice" value="other" /> Друг

</form>

Падащи менюта

<form>
В кое училище учите? <br />
   <select name="ChooseOne">
   <option value="І"> І ЕГ </option>
   <option value="ІІ"> ІІІ ПМГ </option>
   <option value="ІІІ"> ІV ЕГ </option>
   <option value="ІV"> V ЕГ </option>
   <option value="V">VІІ СОУ </option>
   <option value="VІ"> VІІІ СОУПЧЕ </option>
   </select>
</form>

  • Падащите менюта дават възможност както за единичен, така и за множествен избор. Горното меню е пример за падащо меню за единичен избор.

За да бъде възможно маркиранета на повече от едно поле от падащото меню е нужно в тага select да се въведе атрибута multiple. Този атрибут няма собствена стойност и затова според изискванията на XHTML му се задава като стойност собственото му название.


Многоредови полета за въвежадане на текст

<form>
Напишете писмо:<br />
<textarea name="Comentar" cols="50" rows="10"> Здравей! </textarea>
</form>

Поле за въвеждане на парола - атрибути и стойности

<form>
Въведете своята парола:    <input type="password" name="parola" />
</form>

Поле за прехвърляне /upload/ на файлове

<form>
Сложете снимка:    <input type="file" size="25" name ="UploadFile" />
</form>
Натиснете върху бутона " Browse ", за да видите ефекта.

Начини за обработване на формуляри

Упражнение 17:

а) Копирайте всеки един от примерите посочени по-горе в урока в прозорчето и натиснете бутона, за да видите ефекта.

б) Направете редакция, като на съответните места поставите други текстове или стойности на атрибути.

JDJ © 2006 Всички права запазени.