martedì 20 gennaio 2009

Come inserire un'area di testo

Scrivendo questo post intendo rispondere alla domanda fattami  Alex, l'utente anonimo che mi ha lasciato un commento nel post precedente. Avevo intenzione di rispondere con un altro commento, ma mi sono resa conto che sarebbe stato troppo lungo perciò ho deciso di aprire un nuovo post, che poi potrebbe rivelarsi utile anche ad altri.


Alex, mi rivolgo a te direttamente. Innanzitutto ti ringrazio dei complimenti e della piacevole sorpresa di aver visto nel tuo blog un link al mio (al più presto ricambierò volentieri). Leggere che qualcuno considera la mia grafica "di un certo livello" rischia di farmi alzare in volo come una mongolfiera....

Per quanto riguarda la tua domanda, premetto che non sono una vera esperta di HTML, me la cavicchio solo un po' a forza di tentativi e testate sui muri (solo virtuali, altrimenti mi ritroverei con un capoccione così!). Dopo di che, sappi innanzitutto che ho preso l'abitudine di preparare quasi sempre i miei post con FrontPage, programma che uso anche per editare il codice delle pagine dell'altro mio sito (Silviababy) e il codice dei miei gadgets (calendarietti etc.). Quelli bravi (il che non include me) non usano FrontPage, perché si dice che FrontPage sporchi il codice HTML, ma usano direttamente il blocco notes oppure altri editor visuali come DreamWeaver. Io ho cominciato ad imparare a costruire pagine HTML con FrontPage ed è dura perdere le cattive abitudini. Ci ho provato, ma col blocco notes dopo un po' mi perdo, la mia conoscenza dell'HTML non è abbastanza profonda, e DreamWeaver non fa per me ...

Comunque, tornando a noi, scrivere i post con FrontPage mi permette di interagire meglio con il codice HTML del post e di inserire ad esempio gadgets, immagini, aree di testo, etc.

Lo spazio dove ho inserito il codice dei calendari viene chiamato appunto area di testo e il suo codice HTML è:

<textarea></textarea>

Per capirci qualcosa di più puoi consultare la guida sull'HTML che trovi nel sito di Web-Link.it e in particolare questa pagina che parla proprio di questo argomento: http://www.web-link.it/html/form.htm


Se poi dovessi avere altri dubbi, rivolgiti iscriviti al forum di Web-Link e posta un quesito. Troverai persone molto disponibili e competenti disposte ad aiutarti. Non ti dico di iscriverti là perché ti voglio scaricare, ma semplicemente non mi sento abbastanza preparata sull'argomento.

Nonostante ciò, ti do un'ulteriore dritta, anzi faccio un regalino a te e a tutti i visitatori che capitassero qui e casualmente volessero sapere la stessa cosa.

Questo è il codice della mia area di testo:

<textarea rows="3" name="S1" cols="21" style="border: 1px solid #D9BBA5; background-color: #1E1A0F; color: #D9BBA5; scrollbar-arrow-color: #D9BBA5; scrollbar-base-color: #1E1A0F; scrollbar-darkshadow-color: #1E1A0F; scrollbar-face-color: #1E1A0F; scrollbar-highlight-color: #D9BBA5; scrollbar-shadow-color: #D9BBA5; scrollbar-track-color: #1E1A0F;">Qui scrivi quello che ti pare. Puoi inserire un codice HTML che intendi far prelevare dai tuoi visitatori, oppure qualunque altra cosa tu desideri.
</textarea>


Se inserisci questo codice, il risultato sarà questo:



Se vari i valori degli attributi cols e rows modificherai le dimensioni dell'area di testo. Per la precisione, variando cols modificherai il numero di colonne su cui si estende l'area, quindi in sostanza ne modificherai la larghezza. Analogamente, variando il valore di rows modificherai il numero di righe su cui si estende l'area, pertanto ne modificherai l'altezza.

Ad esempio se scrivi cols="35" e rows="6" otterrai questo:




Se vuoi modificare il colore della barra di scorrimento devi agire su questa parte del codice e variare i codici esadecimali dei colori:

scrollbar-arrow-color: #D9BBA5; scrollbar-base-color: #1E1A0F; scrollbar-darkshadow-color: #1E1A0F; scrollbar-face-color: #1E1A0F; scrollbar-highlight-color: #D9BBA5; scrollbar-shadow-color: #D9BBA5; scrollbar-track-color: #1E1A0F;


Ricordati però che solo chi naviga con Internet Exploerer sarà in grado di vedere la barra di scorrimento colorata. Chi naviga con Firefox non la vedrà colorata, per quanto riguarda gli altri browser non sono in grado di fornirti indicazioni a riguardo, ma credo che comunque la barra colorata sia proprio un'esclusiva di Internet Explorer.

Se non vuoi che compaia la barra di scorrimento, semplicemente elimina quella parte di codice.

Così:

<textarea rows="3" name="S1" cols="21" style="border: 1px solid #D9BBA5; background-color: #1E1A0F; color: #D9BBA5;">Area di testo senza barra di scorrimento.
</textarea>


Avrai questo:



Se vuoi puoi modificare l'attributo di stile cambiando lo spessore del bordo, il suo colore, il colore dello sfondo e il colore del testo.


Per esempio, se vari l'attributo di stile in questo modo:

<textarea rows="5" name="S1" cols="21" style="border: 3px solid #666633; background-color: #D2D2A6; color: #666633;">Area di testo con i bordi di 3 pixel e diversi colori di testo, bordi e sfondo.</textarea>

otterrai questo:



Spero di aver saputo rispondere alla tua domanda e di non averti confuso troppo le idee.

5 commenti:

  1. Grazie mille.

    Sei stata gentilissima e hai fatto bene a rendere tutto pubblico dato che io di certo non sono l'unico che chiederà questa cosa. Pensa, non sapevo manco che le "robe scritte nel riquadro" xD si chiamano area di testo.

    RispondiElimina
  2. Grazie mille.

    Sei stata gentilissima e hai fatto bene a rendere tutto pubblico dato che io di certo non sono l'unico che chiederà questa cosa. Pensa, non sapevo manco che le "robe scritte nel riquadro" xD si chiamano area di testo.

    RispondiElimina
  3. argh, sono cose difffffficilissssssime per me!

    RispondiElimina
  4. @alex: io l'ho imparato un po' leggendo la guida di web-link, un po' pasticciando con FrontPage.

    @simplymum: non molto tempo fa queste cose anche per me erano arabo e in parte è ancora così ... ma imparare qualcosina, un po' di HTML di sopravvivenza, per così dire, non è stato troppo difficile. Comunque, come ho scritto nel post, ci sono delle volte che dò veramente tante capocciate virtuali ...

    RispondiElimina
  5. @alex: io l'ho imparato un po' leggendo la guida di web-link, un po' pasticciando con FrontPage.

    @simplymum: non molto tempo fa queste cose anche per me erano arabo e in parte è ancora così ... ma imparare qualcosina, un po' di HTML di sopravvivenza, per così dire, non è stato troppo difficile. Comunque, come ho scritto nel post, ci sono delle volte che dò veramente tante capocciate virtuali ...

    RispondiElimina

LinkWithin

Related Posts Plugin for WordPress, Blogger...