CSS Lifted corner Drop Shadow. Samples. CSS Design: Taming Lists. As early as July of 1999 I was pontificating on email lists about the virtues of style sheets. Some things never change. Article Continues Below What has changed is how I think about CSS, and the underlying structure of (X)HTML to which it is applied. For example, I find that most pages on the web contain a menu of links in a navigation area. These are often marked up as a string of links, often in separate DIVs or paragraphs. Structurally, however, they are a list of links, and should be marked up as such. Of course the reason that we don’t mark them up in that way is that we don’t want a bullet in front of every link in our navigation area.
In this article, I’ll demonstrate how to use CSS to bring unwieldy lists under control. Setting the stage#section2 For purposes of this article, I am using unordered lists. <ul><li>Item 1</li><li>Item 2</li><li>Item 3</li><li>Item 4</li><li>Item 5 we'll make a bit longer so that it will wrap</li></ul> Positioning#section3 Markers#section4 to your rule. The Shapes of CSS. Learn Development at Frontend Masters CSS is capable of making all sorts of shapes.
Squares and rectangles are easy, as they are the natural shapes of the web. Add a width and height and you have the exact size rectangle you need. Add border-radius and you can round that shape, and enough of it you can turn those rectangles into circles and ovals. We also get the ::before and ::after pseudo elements in CSS, which give us the potential of two more shapes we can add to the original element. Square Rectangle Circle Oval Triangle Up Triangle Down Triangle Left Triangle Right Triangle Top Left Triangle Top Right Triangle Bottom Left Triangle Bottom Right Curved Tail Arrow via Ando Razafimandimby Trapezoid Parallelogram Star (6-points) Star (5-points) via Kit MacAllister Pentagon Hexagon Octagon Heart via Nicolas Gallagher Infinity via Nicolas Gallagher Diamond Square via Joseph Silber Diamond Shield via Joseph Silber Diamond Narrow via Joseph Silber Cut Diamond via Alexander Futekov Egg Pac-Man Talk Bubble TV Screen Lock.
Top 13 HTML5 – CSS3 frameworks to spice up your projects. HTML5 and CSS3 represent the near future of the web. The last versions of all major browsers support many of the new features introduced by these versions. If you want to try the new HTML5 properties (Canvas, Geolocalization, …) or new CSS3 rules (media queries, …) you can also use the frameworks examined in this article. These frameworks are used to create your HTML5/CSS3 templates, to develop your mobile applications, to draw graphs easily and much more. Read on to choose your next framework. 52Framework 52Framework is a new framework built specifically for utilizing HTML5 and CSS3 in a cross-browser, standards-compliant manner. HTML5 Use of all the most useful current html5 tags including: header, nav, section, article, footer, and more to come soon (with styling)Use of the all new <!
Link: Baseline Built with typographic standards in mind, Baseline makes it easy to develop a website with a pleasing grid and good typography. Link: Sproutcore jo. Css3. CSS-Tricks.