Wednesday, February 13, 2008

CSS based Design - Website Design Tips

53 CSS-based techniques you should always have ready to hand if you develop web-sites.


1. CSS Based Navigation

CSS-Technique

2. Navigation Matrix Reloaded

CSS-Technique

3. CSS Tabs

CSS-Technique

4. CSS Bar Graphs (CSS For Bar Graphs)

CSS-Technique

5. Collapsing Tables: An Example

CSS-Technique

6. Adam’s Radio & Checkbox Customisation Method

CSS-Technique

7. CSS Image Replacement

CSS-Technique

8. CSS Shadows (CSS Shadows Roundup)

CSS-Technique

9. CSS Rounded Corners Roundup (Nifty Corners)

CSS-Technique

10. Drop Cap - Capital Letters with CSS

CSS-Technique

11. Define Image Opacity with CSS

CSS-Technique

12. How to Create a Block Hover Effect for a List of Links

CSS-Technique

13. Pullquotes with CSS (Automatic Pullquotes with JavaScript and CSS

CSS-Technique

14. CSS Diagrams

CSS-Technique

15. CSS Curves

CSS-Technique

16. Footer Stick allows for the footer of a Web page to appear either at the bottom of the browser window or the bottom of the Web page content – whichever is visually lowest.

CSS-Technique

17. CSS Image Map

CSS-Technique

18. CSS Image Pop-Up

CSS-Technique

19. CSS Image Preloader

CSS-Technique

20. CSS Image Replacement for Buttons

CSS-Technique

21. Link Thumbnail

CSS-Technique

22. CSS Map Pop

CSS-Technique

23. PHP-based CSS Style Switcher

CSS-Technique

24. CSS Unordered List Calender (CSS Styled Calender)

CSS-Technique

25. CSS-Based Forms: Techniques

CSS-Technique

26. CSS-Based Tables: Techniques

CSS-Technique

27. Printing Web-Documents and CSS

CSS-Technique

28. Improved Links-Display for Print-Layouts with CSS

CSS-Technique

29. CSS-Submit Buttons

CSS-Technique

30. CSS Teaser Box

CSS-Technique

31. CSS Tricks for Custom Bullets

CSS-Technique

32. Ticked Off Links Reloaded

CSS-Technique

33. CSS Zooming

CSS-Technique

34. Creating a Star Rater using CSS

CSS-Technique

35. The ways to style visited Links

CSS-Technique

36. PDF, ZIP, DOC Links Labeling

CSS-Technique

37. Displaying Percentages with CSS

CSS-Technique

38. Image Floats without the Text Wrap

CSS-Technique

39. Let visitors decide, whether or not will they open link in a new window

CSS-Technique

40. Simple accessible external links

CSS-Technique

41. Zebra Table with JavaScript and CSS

CSS-Technique

42. Vertical Centering with CSS (Horizontal and Vertical Centering with CSS

CSS-Technique

43. Unobtrusive Sidenotes

CSS-Technique

44. Image Caption with CSS (Styled Images with Caption)

CSS-Technique

45. Dynamic Piechart with CSS

CSS-Technique

46. Format Footnotes with CSS

CSS-Technique

47. Hierarchical Sitemap with CSS

CSS-Technique

48. Snook’s Resizable Underlines

CSS-Technique

49. Switchy McLayout: An Adaptive Layout Technique

CSS-Technique

50. StyleMap: CSS+HTML Visual Sitemap

CSS-Technique

51. Custom Reading Width

CSS-Technique

52. CSS Alert Message

CSS-Technique

53. CSS Production Notes

CSS-Technique

Read More CSS based techniques

2 comments:

Muthu SEO Expert India said...

Hi!
Nice Blog!
With the spectacular growth of the web, new opportunities are available for business across the world. An organization can now make its presence felt to customer across continents. It has become an essential marketing strategy to hold strong web presence. India with its advantages, of low input costs and increased productivity, has become a hub for website development for companies across the world.

We are well - qualified and positioned to provide low cost high end quality web development and design work. We are a full service web development firm in India offering web designing, web development, e-commerce solutions, regular update works, redesigning of websites, etc. We are experts, working on interactive as well as static sties.

Our people expertise in the aesthetics and technologies of the web. Along with the look and feel of the web pages, we gave nuances for the right kind of web authoring, graphics and animation. For that purpose we are well versed with different tools and web programming languages. We design classy corporate designs that truly represent the company. We also design and develop shock wave layouts for websites and intros.

Anonymous said...

Hello. This post is likeable, and your blog is very interesting, congratulations :-). I will add in my blogroll =). If possible gives a last there on my blog, it is about the Câmera Digital, I hope you enjoy. The address is http://camera-fotografica-digital.blogspot.com. A hug.