Risultati della Ricerca per: css
Realizzare un layout sticky footer con colonne fullheight grazie alle table css
Nel nostro lavoro di sviluppatori ci capita spesso di doverci confrontare con problemi più o meno complessi.
Due di questi problemi sono la realizzazione di una pagina alta almeno il 100% della finestra del browser (di cui ho già parlato in questo articolo) e la realizzazione di uno sticky footer (footer tenuto sempre in basso a prescindere dalla lunghezza del contenuto).
Sono situazioni divenute talmente comuni che ormai forum e blog pullulano di metodi per risolverli. A me però è capitata una situazione un po’ più particolare: il problema era rappresentato dai due precedenti fusi assieme!
Come fare quando si vuole realizzare una pagina che abbia uno sticky footer e nello stesso tempo avere un contenuto che occupi il 100% dello spazio centrale compreso tra header e footer?
Credo sia inutile dirvi che un semplice height:100% non funziona, ma se continuate a prestare attenzione al mio articolo saprete come risolvere questo problema sfruttando le CSS table. || Leggi altro »
Conosci questi modi di utilizzo dei selettori css? (Parte 2)
Dopo aver introdotto i selettori di base presenti nelle specifiche CSS, ed averne testato la potenza, forse ti sarai chiesto: "Che bisogno c'é di altri selettori? Posso fare tutto con class e ID!". Non c'è niente di più professionale di...
CSS Transition e Transform: come posso utilizzarle?
Nei precedenti articoli abbiamo visto le basi delle CSS Transforms e Transition. Ma come utilizzare questi strumenti? Quali possono essere i possibili campi applicativi? Oggi ti mostrerò tre esempi che sfruttano queste proprietà. (altro…)
Come progettare un layout web responsive con le media queries?
Dopo le prime due lezioni introduttive sul Responsive Web Design, oggi ci addentreremo nel codice CSS attraverso le nuove istruzioni messe a disposizione nella terza versione dei fogli di stile. In particolare vedremo come realizzare un semplice layout responsive utilizzando...
CSS: come utilizzare la proprietà z-index?
Un paio di settimane addietro abbiamo analizzato l’utilizzo delle proprietà CSS relative al posizionamento degli elementi all’interno di un documento. Nel dettaglio abbiamo visto come si utilizza il posizionamento assoluto e come opera il posizionamento fisso. In quest’ultimo articolo abbiamo...
Come trasformare un psd in (x)html e css senza perderci la ragione? Parte 1
Il nostro compito in questa lezione sarà di dissezionare e in seguito di ricomporre il sito come in un puzzle della Clementoni, utilizzando i fogli di stile e l’(x)html. È una delle parti più appassionanti del lavoro perché ti permette...
CSS: come utilizzare la proprietà position absolute?
Il posizionamento degli elementi è uno degli argomenti più ostici riguardanti i CSS. Nell’articolo di oggi vedremo l’utilizzo della proprietà “position” la quale permette di posizionare un elemento all’interno della nostra pagina web sottraendolo dal normale flusso del documento. Nel...
Tendenze: il nuovo web design retrò e lo “stile CSS3”
Sul web impazzano la CSS3 e l’HTML5 mania, e questa non è una novità. I web designer di tutto il mondo si sbizzarriscono con animazioni –dalla dubbia utilità ma, dobbiamo ammetterlo, certamente estrose – sperimentano ombre e rotondità e si...
HTML5 Mobile app: transizioni e animazioni CSS3 (parte 2)
Nella prima parte di questa mini guida abbiamo parlato dei concetti di animazioni imperative/animazioni dichiarative, di come avviare o mettere in pausa un effetto transition e di come queste tecniche possano essere impiegate per la realizzazione di interfacce web e HTML5...
Pillole CSS: come realizzare un layout fisso a due colonne?
Con l'introduzione dei framework CSS come 960gs, o Blueprint, realizzare layout con CSS è diventato davvero semplice. L'unica pecca che affligge questi framework è anche il loro punto di forza: nascondere le implementazioni all'utente, permettendo di realizzare layout complessi utilizzando...
HTML Mobile App: 5 Consigli per aumentare le performance
Negli articoli precedenti (HTML5 Mobile App: transizioni ed animazioni CSS3 parte 1 e parte 2) abbiamo visto come poter realizzare applicazioni HTML5 e Javascript con interfacce che sfruttano animazioni CSS3, e come poter controllare quest’ultime grazie agli eventi che abbiamo...
Come aumentare le performance del mio sito? – CSS Sprites
Hai creato un sito, magari seguendo la nostra guida "Come creare un sito web dalla A alla Z", ma noti che spesso i tempi di caricamento sono lunghissimi. I motivi alla base di questo comportamento possono essere molteplici, ma ci...
Come creare un Menu animato in CSS3 senza Javascript
Esistono molti web designer che conoscono in modo impeccabile HTML e CSS, ma hanno carenze per quanto riguarda Javascript. Per questo cercano delle soluzioni alternative alle animazioni che potrebbero ottenere con l'ausilio di javascript. Queste alternative hanno un nome: effetti...
Guida CSS3: i font – parte prima
Bentrovato a questo nuovo appuntamento con la guida CSS3! Quest’oggi affronteremo un tema fondamentale: l’utilizzo di font, predefiniti e personalizzati. Nonostante sul web ci sia ormai un grand’utilizzo di materiale visivo — immagini, video, animazioni, etc. — il ruolo ricoperto...
Guida CSS3: ereditarietà
Bentrovato ad un nuovo appuntamento con la guida CSS3! Nel corso di questo articolo ci soffermeremo su un aspetto fondamentale che condiziona l’intero flusso di lavoro con il CSS: l’ereditarietà. (altro…)
Come velocizzare un sito WordPress
In questo articolo voglio dare alcuni suggerimenti che possono essere messi in pratica da tutti per velocizzare il proprio sito web WordPress. Alcuni dei consigli saranno regole da utilizzare con costanza, altri invece configurazioni e strumenti (come i plugin) che...
4 jQuery tricks che non potete non conoscere
jQuery. Un framework javascript talmente potente e popolare che equivale praticamente a Zend per il PHP. Sempre più siti web lo utilizzano per la sua capacità di essere sintetico ma altamente funzionale, e non se ne può più fare a...
Guida CSS3: pseudo classi e pseudo elementi
Bentrovato a questo nuovo articolo della guida CSS3! Come preannunciato nel capitolo precedente, quest’oggi ci occuperemo di pseudo classi e pseudo elementi. Ti sarà capitato spesso di voler applicare uno stile a degli elementi non proprio ben identificabili del tuo...
CSS3: COME ANIMARE LE TUE IMMAGINI
Il tutorial di oggi è davvero semplice e nello stesso tempo molto efficace: vedremo insieme come creare una semplice animazione che permetta di rendere dinamiche le nostre immagini, inserendo effetti zoom e una o più didascalie su di esse. è...
