Design ornamentation with CSS
Add a little extra design detail using CSS techniques.
- css ornamentation tutorials
-
Meyerweb.com - Boxpunch
Using CSS to produce 'boxed content' with 'gaps' or 'cut-outs' for aesthetic effect. Adviseable to put presentational images into the background for good separation.
-
CSSPlay.co.uk - CSS flicker 'book'
Create 'flicker-page' books using CSS - for a giggle. Zoetrope chronophotography for the new school.
-
Christianmontoya.com - Hot dates
Making blog dates look like small calendar pages.
-
CSSPlay.co.uk - Ragged float for images
A tutorial for creating 'stepped' floats to position text so that it 'tracks' the edge of an uneven image. Contains improvements on Eric Meyer's original ragged float tutorial.
-
Cssplay.co.uk - CSS image map
A tutorial on making a cross-browser pure CSS image map.
-
Tanfa.co.uk - CSS rollover map
Degradeable CSS & JS rollover map.
-
24ways.org - Styling tabular data
Semantic styling of cells, rows, row groups and, of course, the table element itself.
-
Codylindley.com - Data grid with stationary header
A Simplified Data Grid With A Stationary Header. A CSS solution for creating a stationary header out of the thead of a table while the table's tbody remains scrollable. Columns can be sorted.
-
Tantek.com - Dot leaders for menus
Styling a liquid width menu with 'dod leaders' for prices.
-
Natbat.net - Inline quotes
A block quote with speech marks at the front and termination of the text but without inline images.
-
Vorratsdatenspeicherung.de - Page corner advert pop-out
CSS to add an animated 'page corner' which displays an advert on hover.
-
Neatlysliced.com - HR image replacement
CSS to add an animated 'page corner' which displays an advert on hover.
-
Komodomedia.com - Block hover effect
Round cornered backgrounds appear when hovering over a block of text.
