Programmare in HTML

........................................................Forum informatica>> ........Contatta l'autore del sito>>........

L'HTML è un linguaggio base del web, esso permette di creare l'aspetto iniziale detto (statico) del sito web, mentre per poi in seguito renderlo dinamico, cioè con la possibilità di collegare ad esso dei database per poter scrivere e leggere dati, ci sarà bisogno dell'aggiunta di altri codici di programmazione tra cui il PHP e JAVASCRIPT.

Qui sotto ho riportato l'esenziale dei codici HTML che vengono più usati per la gestione iniziale HTML:

 

MENU A TENDINA

<form>
 <fieldset>
  <legend>Siti per webmaster</legend>

  <select name="siti" >
   <option value="http://www.html.it" selected="selected">www.html.it  </option>
   <option value="http://freephp.html.it">frephp.html.it  </option>
   <option value="http://freasp.html.it">freasp.html.it  </option>
  </select>
 </fieldset>
</form>

MENU A TENDINA CON GRUPPI

<form action=ìì>
 <select name="siti" >
  <optgroup label="siti per webmaster">
   <option value="http://www.html.it">www.html.it  </option>
   <option value="http://freephp.html.it">frephp.html.it  </option>
   <option value="http://freasp.html.it">freasp.html.it  </option>
  </optgroup>

  <optgroup label="risorse per webmaster">
   <option value="http://font.html.it">font.html.it  </option>
   <option value="http://cgipoint.html.it">cgipoint.html.it  </option>
  </optgroup>
 </select>
</form>

 

 

Checkbox

Con le checkbox possiamo consentire all'utente di operare delle scelte multiple. Ad esempio:
<form action=ìì>
<fieldset>
 <legend>Linguaggi conosciuti</legend><br>
 <input type="checkbox" name="html" value="html"/> html
 <br>
 <input type="checkbox" name="css" value="css"/> css
 <br>
 <input type="checkbox" name="javascript" value="javascript"/> JavaScript
</fieldset>
</form>
che dà:


Linguaggi conosciuti
html
css
JavaScript

Si possono anche selezionare uno o più valori di default:
<form action=ìì>
 <input name="html" type="checkbox" value="html" checked="checked"/>
</form>
cioè


ed è possibile disabilitare una casella:
<form action=ìì>
 <input name="html" type="checkbox" value="html" disabled="disabled"/>
</form>


cioè:

RADIO BUTTON (scelta esclisiva)

<form>
 <fieldset>
  <legend>Linguaggi conosciuti</legend>
  HTML<input type="radio" name="linguaggio" value="html"/>
  CSS <input type="radio" name="linguaggio" value="css"/>
  JavaScript <input type="radio" name="linguaggio" value="javascript"/>
</fieldset>
</form>

 

 

Radio button

I "radio button" ("bottoni circolari") invece consentono di effettuare una scelta esclusiva. In questo caso quindi una scelta esclude l'altra. Per ottenere questo effetto i campi devono avere lo stesso nome e differente valore:
<form>
 <fieldset>
  <legend>Linguaggi conosciuti</legend>
  HTML<input type="radio" name="linguaggio" value="html"/>
  CSS <input type="radio" name="linguaggio" value="css"/>
  JavaScript <input type="radio" name="linguaggio" value="javascript"/>
</fieldset>
</form>
che viene così visualizzato:


Linguaggi conosciuti HTML CSS JavaScript

Anche in questo caso è possibile assegnare un valore di default o disabilitare un pulsante.
<form action=ìì>
 <input type="radio" name="linguaggio" value="html" checked="checked" disabled="disabled"/>
</form>
cioè:


 

Menu di opzioni (select) (con gruppi o senza)

Grazie al tag <select> è possibile costruire dei menu di opzioni. In questo caso ciascuna voce deve essere compresa all'interno del tag <option> (la chiusura del tag è opzionale) e il valore deve essere specificato attravero l'attributo "value". Con l'attributo "selected" si può indicare una scelta predefinita:
<form>
 <fieldset>
  <legend>Siti per webmaster</legend>

  <select name="siti" >
   <option value="http://www.html.it" selected="selected">www.html.it  </option>
   <option value="http://freephp.html.it">frephp.html.it  </option>
   <option value="http://freasp.html.it">freasp.html.it  </option>
  </select>
 </fieldset>
</form>
che da luogo a:


Siti per webmaseter

CON GRUPPI INVECE:

Siccome i menu di scelta tendono a diventare particolarmente lunghi, nell'HTML 4 è stato introdotto il tag <optgroup> che consente di suddividere le varie possibilità di scelta in gruppi tramite l'utilizzo di apposite etichette. Ecco l'esempio:
<form action=ìì>
 <select name="siti" >
  <optgroup label="siti per webmaster">
   <option value="http://www.html.it">www.html.it  </option>
   <option value="http://freephp.html.it">frephp.html.it  </option>
   <option value="http://freasp.html.it">freasp.html.it  </option>
  </optgroup>

  <optgroup label="risorse per webmaster">
   <option value="http://font.html.it">font.html.it  </option>
   <option value="http://cgipoint.html.it">cgipoint.html.it  </option>
  </optgroup>
 </select>
</form>

che dà luogo al seguente menu:


Infine con il tag select è possibile impostare anche delle scelte multiple. Come si può vedere, utilizzando l'attributo "multiple" l'aspetto del tag select cambia notevolmente:
<form action=ìì>
 <label>Quale siti visiti?<br>

  <select name="siti" multiple="multiple">
   <option value="http://www.html.it">www.html.it  </option>
   <option value="http://freephp.html.it">frephp.html.it  </option>
   <option value="http://freasp.html.it">freasp.html.it  </option>
   <option value="http://font.html.it">font.html.it  </option>
   <option value="http://cgipoint.html.it" >cgipoint.html.it  </option>
  </select>
 </label>
</form>
cioè:


Quale siti visiti?

Utilizzando il tasto "ctrl" l'utente può così effettuare delle scelte multiple.
Tramite l'attributo "size" si può specificare il numero delle voci che devono comparire nel menu, e conseguentemente regolare l'altezza del menu, aggiungendo o togliendo la barra di scorrimento verticale.
<form action=ìì>
 <label>Quale siti visiti?<br>

  <select name="siti" size="5" multiple="multiple">
   <option value="http://www.html.it">www.html.it  </option>
   <option value="http://freephp.html.it">frephp.html.it  </option>
   <option value="http://freasp.html.it">freasp.html.it  </option>
   <option value="http://font.html.it">font.html.it  </option>
   <option value="http://cgipoint.html.it" >cgipoint.html.it  </option>
  </select>
 </label>
</form>
che viene così visualizzato:


CAMPI NASCOSTI

Hidden, permette di nascondere un campo: esempio:

input type=”hidden” name"…..

COLORARE UN BOTTONE


È possibile COLORARE UN BOTTONE per mezzo del seguente codice CSS:
<input type=button style="background-color:red" value="Clicca">