Laboratorio Web Design » Immagini

Immagini digitali

v_a_l_i_x — Thu, 27 Nov 2008 14:22:46 +0000

Come fare uno screenshot (foto al monitor)

v_a_l_i_x — Tue, 11 Nov 2008 17:18:51 +0000

In Windows premi il tasto “Stamp” o “Print screen” o “prt scr” che è solitamente situato in alto a destra della tastiera. Apri un qualsiasi programma di editing immagini (Paint va più che bene) clicca con il destro sull’area del disegno e seleziona incolla, infine salva il file in formato .gif o .png
Con il mac basta fare ctrl cmd+shift+3 e l’immagine si salva sul Desktop automaticamente in formato .png
Con Linux c’e’ l’applet “cattura desktop”.

Se siete dei perfezionisti potete scaricarvi Fireshot (estensione gratuita per Firefox e Explore) che vi permetterà di utilizzare una serie di strumenti di editing per modificare, inserire annotazioni, testo nell’immagine catturata.

Testo intorno all'immagine

v_a_l_i_x — Tue, 24 Apr 2007 17:54:16 +0000

…praticamente quello che succede in questo post!
Il primo passo è definire un selettore di tipo class a cui associamo un nome, ad esempio image_sx, ed attribuirgli un float a sinistra e un margine di 3 pixel (per distanziare l’immagine dal testo):
.image_sx {float: left; margin: 3px;}
Il secondo passo è associare all’immagine presente nel documento HTLM la classe creata:
Ovviamente se desiderate posizionare l’immagine a destra basta cambiare il valore left con right
.image_dx {float: right; margin: 3px;}

Vi ricordo che la sintassi per definire un selettore CSS da usare come nome di una classe richiede l’uso di un “.” (punto) immediatamente prima di tale nome. Al contrario, la sintassi per la definizione di selettori di tipo id richiede l’uso di un “#” (cancelletto, sharp), al posto del “.” .

Per chi usa Dreamweaver
Inserite un’immagine all’interno del documento (inserisci > immagine).
Create una nuova regola CSS (testo>stili CSS> nuovo), controllate che il selettore CLASSE sia selezionato, attribuite il nome e fate click su ok.
Ora non vi resta che associare la classe all’immagine: selezionate l’immagine e dalla finestra CLASSE all’interno del box PROPRIETÀ scegliete la classe da associare.

Spero sia tutto chiaro…