Web Design - CSS e XHTML
Articoli e tutorial su CSS e XHTML
a cura della Redazione
Altre risorse sui CSS di WebMasterPoint: Tag Css - Referenze Css ( tutti i comandi Css ) - Guida CSS Base - Guida CSS completa
-
Banner espandibili con i CSS
In questo articolo vedremo come realizzare dei banner che si espandono al passaggio del mouse, utilizzando esclusivamente i CSS
-
Guida all'uso di TopStyle Lite, il programma che ti aiuta a scivere i CSS
Utilizzando TopStyle puoi velocizzare molto la realizzazione di un file CSS.
-
Realizzare un menu verticale con i css
Vediamo come in poco tempo si puo realizzare un menu utilizzando i css
-
Emulare le immagini mappate con i CSS
Tramite i CSS e possibile realizzare immagini mappate utilizzando una semplice lista di link
-
Stilizzazione dei form Html
con i Css
Anche i form Html sono soggetti a possibili stilizzazioni mediante l'utilizzo dei Css...
-
Come realizzare un layout liquido
In questo articolo vedremo come realizzare una pagina web con un layout "liquido"
-
Immagini proporzionali con i CSS
Le immagini hanno una loro ben definita dimensione, ma in alcuni casi risulta comodo dimensionarle in modo proporzionale
-
Creazione di un layout senza tabelle
I Css mettono a disposizione un ottimo sistema di impaginazione e costruzione di layout...
-
Pagine zoomabili
In questo articolo vedremo come realizzare un semplice layout in grado di assecondare il ridimensionamento dei caratteri
-
Implementare min-height anche su Internet Explorer
Internet Explorer ha ancora problemi nel supporto di molte proprieta dei CSS, tra cui min-height
-
Semplice alternato delle righe di una tabella HTML
Questo tutorial mostrera come utilizzare i CSS e il JavaScript per ottenere la visualizzazione con colori alternati
-
Un banner con i fogli di stile
Utilizziamo i Css per creare un banner leggero e gradevole per gestire i contenuti pubblicitari del nostro sito
-
Sottolineatura tratteggiata sui link al passaggio del mouse
Sfortunatamente i Css non dispongono di un sistema di sottolineatura tratteggiata sui link, ma e possibile arrivarci con l'utilizzo del box-model
-
Referenze dei fogli di stile Css
La lista di tutte le referenze utili ad utilizzare i fogli di stile, conoscendone tutte le peculiarita
-
Cosi si stampa da una pagina Web con i CSS
Quante volte ci e capitato di stampare una pagina Web e scoprire di aver perso i tre quarti del foglio originale?
-
Effetto ombra su testo
Molti utilizzano titoli con effetto ombra, si tratta di immagini che possono rallentare il caricamento della pagina; vediamo com'e possibile creare lo stesso effetto usando un testo
-
La flessibilita delle tabelle
Questo elemento base dell'html ha come scopo un piu logico significato, intabellare e rendere disponibili semplicemente dati tabellari
-
Barra di navigazione con i CSS
Un oggetto che e possibile realizzare con i CSS, tra le tante cose, e una barra di navigazione senza l'uso di immagini e senza codice di scripting
-
Rendere accattivante una pagina di solo testo con i CSS
Se abbiamo una pagina del nostro sito contenente solo testo, possiamo renderla piu accattivante inserendo delle piccole immagini ".gif" che introducono un titolo o un paragrafo
-
I fogli di stile auditivi, una situazione concreta
Affrontiamo in questo articolo una situazione reale riprodotta tramite un interfaccia web, la situazione e un discorso tra amici che si incontrano descritto in formato xml
-
Sfondo tridimensionale applicato ad elementi form
Abbinando la grafica alla potenza dei CSS, oltre ad un po di fantasia, possiamo creare simpatici effetti su alcuni elementi di un form, da presentare nelle nostre pagine web
-
Una galleria in JS e CSS
Proprio oggi un mio amico mi scrive alla ricerca di qualche script JavaScript che gli permetesse di creare una piccola galleria di immagini...
-
Immagini ripetute e fisse con i CSS
In una pagina web possiamo avere l'esigenza di avere ai bordi superiore ed inferiore una immagine che si ripete per tutta la larghezza della foto
-
Emulare l' effetto frames ed i-frame con i fogli di stile
In questo articolo sui CSS avremo la possibilita di vedere come funziona una proprieta che consente di avere piccole finestre di contenuto all'interno di una pagina web
-
Dieci buoni motivi per realizzare un sito accessibile
Vengono quindi qui riportati dieci motivi che possono aiutare a riflettere sull'opportunita di realizzare presenze internet con un particolare occhio di riguardo all'aspetto dell'accessibilita
-
Pagina con "effetto ombra" e CSS
L' articolo proposto oggi vede l' utilizzo della grafica e dei CSS; la prima ci serve per creare delle immagini "gif" ed i fogli di stile per "impaginare" il tutto
-
Ricomporre una foto usando i DIV
Quando in una pagina abbiamo l'esigenza di inserire qualche fotografia di dimensioni rilevanti, non facciamo altro che "tagliarla" e ricomporla
-
Inseriamo un' immagine in un button di un <form>
In questo articolo vedremo come inserire una immagine nel tag: <input type="button">
-
Menu e roll-over CSS con l'aggiunta di una immagine gif
Creiamo un menu con l'aggiunta di una piccola immagine ".gif" nella parte destra dell'area linkabile
-
Un form... stiloso
Vogliamo dare un aspetto diverso al nostro form? Con i CSS e possibile farlo
-
Barra di navigazione con CSS e immagini gif a 3 stati
In questo articolo vedremo come creare una barra di navigazione con rollover e preload solo con l'uso dei fogli di stile e tre immagini gif
-
Layout di base a tre colonne
In questo articolo sara illustrato come creare lo schema di base per la realizzazione di layout a tre colonne
-
Immagini ripetute e fisse con i CSS
In una pagina web possiamo avere l'esigenza di inserire una fotografia e di avere ai bordi superiore ed inferiore una immagine che si ripete per tutta la larghezza della foto
-
Impaginare testo su 2 colonne e preservare lo spazio
In questo articolo sui CSS impagineremo del testo sempre su due colonne, ma "preserveremo" uno spazio che potrebbe esserci utile per inscrivere una immagine o altro
-
Effetto retinato con i CSS
In questo articolo creeremo un simpatico effetto con i CSS: vale a dire un effetto "retinato" su una immagine di sfondo
-
Posizionare una immagine in basso a destra nella pagina
Lo sfondo e l' area che racchiude i singoli caratteri del testo di un elemento
-
Barra di navigazione accessibile con stato "focus" ed accesskey
Nell' articolo di oggi realizzeremo una barra di navigazione, rendendola accessibile
-
Allineamento verticale con i CSS
In questo articolo vedremo come allineare in verticale, con i CSS, un elemento in una pagina html
-
Eliminare lo spazio prima e dopo un elenco
Quando viene creata una lista ordinata (<ol>) o non ordinata (<ul>) viene lasciato uno spazio vuoto la lista stessa
-
Scambio immagine (roll-over) con i CSS
L' articolo che oggi viene proposto prevede uno scambio immagine, altrimenti detto roll-over, solo e soltanto con l' ausilio dei CSS
-
Far coesistere 2 div opposti sulla stessa
riga
Nell' articolo di oggi posizioneremo su una stessa linea 2 DIV, ma opposti l' uno all' altro
-
Creare un paragrafo con immagine di sfondo
L' applicazione presentata oggi prevede l' inserimento di una immagine quale sfondo del paragrafo; al di sopra di essa, potremo scrivere il nostro testo
-
Sdoppiare un' immagine con i CSS
Quello che oggi vorrei proporre e, come scritto nel titolo, un effetto, spero simpatico, che possiamo introdurre nel nostro sito
-
Barra di navigazione trasformata in mappa
Come ho scritto nel titolo, avremo una barra di navigazione "mappata" e totalmente accessibile
-
Creare un roll-over disgiunto con i CSS
Non vi meravigliate nel leggere il titolo di questo articolo; effettivamente e proprio cosi: realizzeremo un "roll-over disgiunto" con il solo ausilio dei CSS
-
Creare box ad angoli curvi con i CSS
In questo articolo mi sono dedicato alla realizzazione di un box con angoli arrotondati, senza nessun utilizzo di files grafici
-
Realizzare un menu a tab verticali con i CSS
Potremmo scorrere con il mouse una parte di pagina che visivamente e simile alla nostra rubrica? Io credo di si e vi dimostro come l' ho ottenuto
-
Simulare frames con i CSS: colonna sinistra
fissa
Possiamo anche tentare di "ingannare" un utente che entra nel nostro sito e fare credere che la pagina in cui si trova, sia composta con i frames, usando semplicemente codice CSS
-
Simulare frames con i CSS: header fisso
Nell' articolo odierno, tratteremo sempre della simulazione dei frames ottenuti grazie ai fogli di stile ma l' effetto sara' quello di avere un header fisso ed il corpo sottostante anch' esso scrollabile
-
Effetti di trasparenza ed opacità con i CSS
Se in una pagina html vogliamo applicare simpatici effetti di "trasparenza" ad una immagine oppure ad un elemento contenitore o ad una parte di testo, possiamo ottenere tutto ciò con un semplice codice di scripting
-
Realizzare un banner accessibile con i CSS
Nell' articolo odierno vedremo come realizzare un banner accessibile con i CSS
-
Creare un POP-UP stile Flash con i CSS
In questo tutorial vedremo come utilizzando i CSS sia possibile creare un pop-up senza bordi sile flash, che si chiuda tramite la simpatica X in alto o in basso del POP-UP
-
Foto contratta ed espansa con i CSS
Nell' articolo di oggi vedremo come realizzare un simpatico effetto "fisarmonica" applicato ad una immagine
-
CSS e Fonts: una combinazione accessibile
In questo tutorial vedremo un piccolo trucco per combinare i fonts di una pagina web con i CSS in modo più accessibile possibile
-
Luci e ombre tra CSS2 e CSS3
I CSS2 sono oggetto di revisione e le promesse dei CSS3 lentamente prendono forma
-
Scrivere in verticale
con i CSS
Una domanda che spesso ho letto in qualche forum è stata quella se con l' html si può scrivere in verticale
-
Galleria
fotografica con i CSS
Uno dei maggiori utilizzi in un sito web personale o professionale è contraddistinto, molte volte, dalla presenza di una galleria fotografica
-
Usare i commenti
condizionali
Si potrebbe dire che essi sono, forse, il "filtro" più sicuro ed efficiente che attualmente circola nelle pagine web
-
Didascalia
"nascosta" su una foto con i CSS
Quando si apre la pagina vedremo solo l´immagine; quando invece passeremo con il mouse su di essa, apparirà la descrizione su uno sfondo semitrasparente
-
Un
metodo per usare al meglio le classi
Voglio condividere con voi un metodo di uso delle classi che ritengo veramente comodo ed efficace
-
Posizionare in modo assoluto i blocchi
Quando si utilizzano le posizioni assolute con css dobbiamo stare molto attenti altrimenti perdiamo del tempo inutile, ecco come usarle
-
Tabella con
scroll verticale
Il tutorial odierno prevede, come scritto nel titolo, la realizzazione di una tabella con una barra di scroll verticale
-
Sifr, Tecnica
per il Text Replacement, per creare titoli, notazioni, header
Ci sono davvero molti modi e tecniche per far in modo di utilizzare un determinato font nei nostri siti web
-
Permettere la
stampa orizzontale di una pagina web
Problema: il contenuto della nostra pagina web viene orribilmente 'mozzato' in fase di stampa
-
Centinaia di
template CSS da poter utilizzare su CSS_Showcase
CSS Showcase di Vitaly Friedman ti presenta una collezione selezionata di eccezionali esempi di web interface design
-
Mostare un'immagine in più dimensioni attraverso un gradiente
Usando gli stessi principi simili alle animazioni ed ai menu "flyout/drop-down", ho prodotto questa dimostrazione d'ingrandimento di immagine attraverso un gradiente
-
Cambiare fogli di stile in base al browser utilizzato usando PHP
In questo articolo impareremo a cambiare il foglio di stile in base al browser utilizzato dall'utente
-
Creare un overlay
con i fogli di stile
Avrete certamente notato, navigando per siti, di banner fatti in flash, e non, i quali pubblicizzano qualsiasi prodotto. Tali banner possono chiudersi "a tempo
-
Creare un menù orizzontale di navigazione con tab colorati
utilizzando CSS e Xhtml
Un menu orizzontale a tab con la particolarità che sullo stato :hover di ogni singola voce, avremo un colore di sfondo diverso dagli altri
-
Creare
effetti sul testo con i CSS come il "barrato" o aggiungere delle
piccole icone grafiche
Navigando per siti web, ho notato delle formattazioni molto simpatiche sui link
-
Intervista a Marco Rosella vincitore dell'oscar dei CSS a
livello mondiale
Marco Rosella è stato premiato pochi giorni fa al South By Southwest di Austin (Texas) per The Horizontal Way, un sito a sviluppo orizzontale
-
Moduli con Css per
siti web per raccogliere informazioni o vendite e-commerce. Come
personalizzarli con i fogli di stile
I form, personalizzati con i css, come possono apparire nelle pagine
-
Form e
moduli di registrazione e login con CSS usabili e accessibili.
Come realizzarli
Le caratteristiche e le funzionalità di una form sono molteplici, molte delle quali divengono sempre più complesse via via che ne vengono diminuite le dimensioni
-
CSS Hack
per Internet Explorer 6
I layouts di molti siti web non vengono più basati sulle tabelle, ma piuttosto sui CSS
-
Tre Menu in css e javascript e html
L' aspetto estetico di un portale è sempre importante, ed alla sua base vi stanno, tra le altre cose, i menu. I web designer si stanno sbizzarrendo oltre l' immaginabile per creare menu accattivanti, originali ed allo stesso tempo comodi.
-
Layout css complessi a tre colonne
In questo articolo andremo a lavorare con i CSS per la creazione di un layout graficamente gradevole e complesso, che risulti compatibile a tutti i browsers.
-
Layout css complessi a tre colonne (II Parte)
In questo articolo andremo a lavorare con i CSS per la creazione di un layout graficamente gradevole e complesso, che risulti compatibile a tutti i browsers.
-
CSS: proprietà delle tabelle. Table-layout, border-collapse, border-spacing, empty-cells, caption-side
Analizziamo le proprietà delle tabelle nei fogli di stile
-
Velocizzare caricamento pagine web? 10 semplici regole
Sapevate che le tabelle sono più lente rispetto ai fogli di stile, i cosiddetti CSS?
- Manuale
completo sui CSS
Disponibile un manuale completo che spiega come utilizzare i CSS
Le ultime news
- Offerte WiMax per utenti: 4 Mbps, chiamate telefoniche illimitate a 20 euro/mese
WiMax come alternativa a telefonia tradizionale e ADSL
- ADSL nuda senza linea telefonica: nuove offerte da Alpikom, Ngi, SìAdsl, Libero e Fastweb. Confronto
- Microsoft acquisterà Facebook, Digg.com e LinkedIn? O farà tutto internamente? Myspace si tira fuori
- Creare forum 3D in automatico partendo da proposte utenti: Microsoft Imagine Cup Italia, i vincitori
- Commenti anonimi eliminati da siti Web, forum e blog: anche il Washington Post lo vuole.
Ultimi articoli tecnici e speciali
- Soluzione problema delle PNG con IE 6: hack
La versione 6 del noto browser di casa Microsoft ha sempre avuto problemi di renderizzazione dei file PNG8. Varrà la pena cercare di supportarli? - OpenOffice 3.0 disponibile da scaricare gratis per tutti. Novità e funzioni
- Musica e video su P2P nascondono virus e trojan: rilevati in poche ore 360mila tentate infezioni da un unico nuovo worm. E' già accaduto in passato, ma vi è una forte crescita
- Errori di programmazione applicazioni e siti web: software DrangonFly Opera li controlla direttamente online facendo il debugging.Gratis da scaricare
- Windows Xp service pack 3 italiano rilasciato uficialmente da Microsoft. Installazione e soluzioni per possibili problemi
- Carta per stampante che si cancella utilizzabile 100 volte: elevato risparmio aziendale e minor inquinamento toner e inchiostri
- Creare file excel con PHP
[ Sommario ]


![[SPONSOR] 9NetWeb (Link Esterno)](http://www.webmasterpoint.org/sponsor/9netweb_120.gif)
![[SPONSOR] Aruba (Link Esterno)](/sponsor/aruba_90.gif)
![[SPONSOR] ConsultingWeb (Link Esterno)](/sponsor/consultingweb_120.gif)
Stampa Pagina
Info sull'autore
ICQ
EMAIL
DISCUTI DI QUESTA LEZIONE SUL FORUM![[SPONSOR] eDomain (Link Esterno)](http://www.webmasterpoint.org/sponsor/edomain_120.gif)

