![]() |
![]() |
|||
Sezione del telaio dedicata alla realizzazione e |
||||
![]() |
![]() |
|||
..:: Testo, font e personalizzazioni ::.. Tra le prime cose da imparare quando si inizia a realizzare un sito o dei gadget webè sicuramente, come impostare e personalizzare il font/carattere, per il testo dei contenuti, ovviamente molto dipenderà dal tipo di sito o lavori che vogliamo realizzare Benché ormai sia possibile "importare" qualsiasi tipo di font, leggete -> Font personalizzato nel sito la scelta più semplice è utilizzare un font "standard" compatibile con i vari sistemi operativi e/o browser, tipo Georgia, Palatino Linotype, Times New Roman, Arial, Trebuchet MS, Verdana, Comic Sans MS, Courier New, comunque sceglierne uno che si legga bene, senza troppi fronzoli ![]() che abbiamo sul nostro pc solo se si eseguono determinati passaggi, perché non è detto che chi legge abbia gli stessi sul proprio, mi ripeto, leggete il tutorial linkato sopra ![]() potremmo scrivere queste indicazioni nello style in linea, anche se sarà ovviamente più comodo inserire questi ed altri parametri, per maggiori personalizzazioni, nei css/foglio di style <font face="Arial" size="3" color="#a4584b">Testo</font> Prova scrittura testo con style in linea - Classe css per impostare lo style del font per il testo in tutta la pagina
* Parametri base per inserire il font/carattere nei css/foglio di style
Poche righe di codice per scrivere su qualunque punto della pagina ed il testo si visualizzerà con le caratteristiche che abbiamo stabilito, potremmo però aver bisogno di scrivere un titolo o un piccolo testo con delle caratteristiche differenti, allora useremo il tag apposito per i paragrafi: <p>Testo</p> - Paragrafo con personalizzazioni di style in linea
I paragrafi sono molto comodi nelle pagine web, "contenitori" versatili per scrivere un testo con caratteristiche personalizzate anche differenti dal resto della pagina, è un blocco a se per cui non si può affiancare a nulla, va a capo in automatico lasciando anche parecchio spazio se non si stabilisce nello style che ovviamente è più comodo scrivere nei css/foglio di style così da poter richiamare la classe ogni volta che occorre Ecco un paio di esempi per le classi dei paragrafi, ai parametri base, font/carattere, misura e colore ho aggiunto margin: 0px; per stabilire lo spazio con il contenuto della pagina.In pratica di default, dopo la chiusa del paragrafo è come se ci fossero due a capo, il parametro "margin: xpx;" ci permette di modificare questa caratteristica
- Per richiamare le classi nel tag del paragrafo scriveremo: <p class="extra">Testo</p> <p class="font_decor">Testo</p> Testo scritto con la classe p.extra Testo scritto con la classe p.font_decor ![]() penalizzare il sito in termini di indicizzazione, specifici tag html sono previsti per questa funzione e hanno determinate regole, leggete la guida dettagliata qui -> w3schools tag titoli ![]() utilizziamo il tag <span style="...">Testo</span> Nello style dell'esempio ho modificato solo il colore del testo ma ovviamente si può aggiungere ogni parametro necessario <span style="color:#898f51">Testo</span> Questo testo è una prova, questa parte è in verde e ora torna il marrone... Anche per questo tag è possibile scrivere una o più classi dedicate nei css/foglio di style, ecco un paio di esempi, con la prima classe il testo racchiuso nel tag sarà verde, in corsivo e sottolineato, con la seconda invece, il testo sarà di colore azzurro e tutto maiuscolo
- Per richiamare le classi nel tag scriveremo: <span class="decor">Testo</span> <span class="more">Testo</span> * Testo di prova con la prima classe, ora sono nel tag span... e ora torno classico * Testo di prova con la seconda classe, ora sono nel tag span... e ora torno classico ![]() alcuni molto utili e altri decorativi, tutti i parametri si possono inserire in linea o nello style, spesso sono scritti nello stesso modo ma in alcuni casi, in linea si usano solo brevi tag
Spero di essere stata chiara in tutti i passaggi ^_^ Vi auguro buon lavoro ma sopratutto buon divertimento! Ciao alla prossima^^ Penelope ♥
|
|
Scrivi qui per lasciare un saluto, una richiesta di aiuto, un suggerimento o una critica ^_^ |
H:
Felice Estate
e ...buona domenica!
..:: Basi ::..
..:: html ::..
..:: Script page ::..
..:: Script gadget ::..
Accessori e gadget del telaio...
Spazio web...
Realizzare e gestire un sito web
nell'hosting free più famoso...
Materiale grafico
Gif, mini gif, pixel, immagini, png...
Tutto il materiale grafico che ti serve,
raccolto e messo a tua disposizione!
I vostri messaggi...
|
|
|