#21653
Cascading Style Sheets: HTML and CSS
In many ways, the Cascading Style Sheets (CSS) specification represents a unique development in the history of the World Wide Web. In its inherent ability to allow richly styled structural documents, CSS is both a step forward and a step backward--but it's a good step backward, and a needed one. To see what is meant by this, it is first necessary to understand how the Web got to the point of desperately needing something like CSS, and how CSS makes the web a better place for both page authors and web surfers.
Meyer, Eric. O'Reilly and Associates (2001). Design>Web Design>CSS
#25361
Cascading Style Sheets: Using Element Display For Layouts, Links and Lists
Introduces the concepts of block-level and inline elements and mentions padding, borders and margins along the way. You'll learn simple techniques using CSS to create accessible layouts, lists, links and navigation bars.
Jordan, Miraz. Wise-Women (2004). Design>Web Design>CSS
#20288
Cascading Stylesheets and Dynamic HTML 
Have you been frustrated by the limitations of HTML as you have struggled to present information attractively on a Web page? Have you used common work-around methods such as setting up complex tables for text layout and creating special text effects with a graphics package? Cascading Style Sheets offers a way to produce desired layout effects through HTML. If we are programmatically inclined, we can use Dynamic HTML to increase interactivity. We will demonstrate methods for using Cascading Style Sheets and Dynamic HTML to design Web pages and point out design limitations we still need to be aware of.
Randolph, Elaine F. and Jeff Randolph. STC Proceedings (1998). Design>Web Design>CSS>DHTML
#25748
Supply two color values in either hex, short hex, RGB percentages, or RGB decimals and get as many as ten colors shades between the two you supplied. Great for finding a color halfway between two shades you like, or mixing two colors together in various proportions.
#27507
Coloring Your Scrollbars with CSS
You really can color your scrollbars and have a change of scenery from the basic gray or other browser default. It just takes a few snippets of CSS markup, which you'll learn how to do in this tutorial.
Kaiser, Shirley E. Website Tips. Design>Web Design>Forms>CSS
#32044
Conditional-CSS allows you to write maintainable CSS with conditional logic to target specific CSS statements at both individual browsers and groups of browsers.
#27508
Converting Existing Content to CSS
Thinking about converting an existing Web page or an entire Web site from FONT tags to using CSS (cascading style sheets)? This first tutorial of a new series will guide you through the very basics to help get you started.
#25212
This series explains how you can use Macromedia Dreamweaver MX 2004 to move towards using CSS as a positioning technique when developing web pages.
Senior, Adrian. Adobe (2004). Design>Web Design>CSS>Dreamweaver
#22958
Creating Accessible Cascading Style Sheets
For years, the only way to format HTML in a visually appealing way was to use tables, even though tables were originally created to display tabular data. As the Web evolved and became more sophisticated, designers wanted to do more than just display text, they wanted to emulate printed documents. They wanted to make an artistic statement. There's nothing wrong with that. In fact, tables can be used for layout without ruining the accessibility of a Web site. Yes, it's ok to use tables for layout. Still, you can take your Web design to a higher level by eliminating tables entirely. The way to do this is through CSS (Cascading Style Sheets).
Bohman, Paul. WebAIM (2003). Design>Web Design>Accessibility>CSS
#32076
Creating Killer Forms with CSS
So you’ve been to about a million websites at this point in your cyber life. There’s a little bit of everything in the online jungle, with every different imaginable style, color, and layout. Everyone is trying to be different, trying to separate themselves from the pack. So why is it that nearly every website, from the coolest of the cool to the worst of the worst, seem to still be using the same, ugly form fields that are default. Well, that’s about to change, at least on your website. I’m going to give you some quick and easy tips to spice up your form fields and set your website apart from the rest.
Robbins, Kyle. ReEncoded (2008). Articles>Web Design>CSS>Forms
#23324
Creating Liquid Layouts with Negative Margins
Two- and three-column, liquid page designs with header and footer are easy to dash off using old-school HTML table layout methods. Designing them in CSS is trickier, and can sometimes even require you to structure your page’s content elements in a specific (and undesirable) order. Negative margins to the rescue! Ryan Brill whips up two quick CSS layouts to demonstrate the power of negative thinking.
Brill, Ryan. List Apart, A (2004). Design>Web Design>CSS
#31956
Lately, I have taken interest in discussing methods of creating sexy stylesheets. While CSS can be used to create sexy websites, writing CSS can actually be an artform by itself. The way in which CSS is created, structured, and maintained can be a thing of beauty. So how does one create sexy stylesheets?
Bolton, Jina. Vitamin (2007). Design>Web Design>CSS
#25211
Creating Your First Design Without Tables
You will design a fixed-width page that allows the contents to flow. You will use an unordered list to create a horizontal navigation system. You will also design a banner image in Fireworks MX 2004 and use it on the page.
Senior, Adrian. Adobe (2004). Design>Web Design>CSS>Dreamweaver
#27292
Dynamic HTML (DHTML) provides a new range of ways to animate a page. DHTML can animate both text and images and animations can move throughout the browser window, instead of being anchored in one spot. Unfortunately, DHTML can be tricky because of differences between browsers. This article will cover the basics of cross-browser animation. You’ll learn how to animate text and images. Plus you’ll see how to move HTML elements around the screen. After you’ve finished reading this article, you should be able to add cross-browser compatible DHTML animations to your web pages.
Apple Inc. (2006). Design>Web Design>DHTML>CSS
#24994
Cross-Column Pull-Out Part Two: Custom Silhouettes
The cross-column pull-out gave us a new technique for marking up a layout with a pull-out positioned between columns. Now we examine a variation of the technique for wrapping around the edges of a non-rectangular image positioned between columns. But first we need to update the original technique.
Frommelt, Daniel M. List Apart, A (2005). Design>Web Design>CSS
#25263
Print designers have long relied on the ability to wrap text around anything, most commonly around a picture centered between two columns. This design option has not been available for web designers ... until now.
Frommelt, Daniel M. List Apart, A (2004). Design>Web Design>CSS
#29560
CSS is ten years old this year. Such an anniversary is an opportunity to revisit the past and chart the future. CSS has fundamentally changed web design by separating style from structure. It has provided designers with a set of properties that can be tweaked to make marked-up pages look rightand CSS3 proposes additional properties requested by designers.
Lie, Hakon. List Apart, A (2007). Design>Web Design>CSS>History
#22215
CSS and Email, Kissing in a Tree
Despite prevailing wisdom to the contrary, you can safely deploy HTML emails styled with good old-fashioned CSS. If you're not content to roll over and use font tags in your HTML emails, read on.
Wyner, Mark. List Apart, A (2004). Design>Web Design>CSS>Email
#25293
CSS and Round Corners: Boxes with Curves
Discover how to make boxes with round corners, all through the power of CSS.
Moss, Trenton. Webcredible (2005). Design>Web Design>CSS
#22721
CSS and Round Corners: Making Accessible Menu Tabs
Learn how to make accessible Amazon-style navigation tabs.
Moss, Trenton. Webcredible (2004). Design>Web Design>CSS
#27616
CSS Beauty is a project focused on providing its audience with a database of well designed CSS based websites from around the world. Its purpose is to showcase designers' work and to act as a small portal to the CSS design community.
#20769
CSS Design: Creating Custom Corners and Borders
In this article, we’ll show how customized borders and corners can be applied to fully fluid and flexible layouts with dynamic content, using sound and semantically logical markup.
Madsen, Søren. List Apart, A (2003). Design>Web Design>CSS>Semantic
#21885
CSS Design: Creating Custom Corners and Borders Part II
Part I showed how to create fluid, dynamic CSS layouts with customized borders and corners. Part II advances to the next level, extending the technique to work with more complicated backgrounds such as gradients and patterns.
Madsen, Søren. List Apart, A (2004). Design>Web Design>CSS
#25545
While web designers generally have a great deal of control over how a document should be presented, basic CSS doesn't provide many options for the style of underlines below the links on a page. But with a few nips and tucks, you can take back creative control of the way your links look.
Robertson, Stuart. List Apart, A (2004). Design>Web Design>CSS
#18425
As early as July of 1999 I was pontificating on email lists about the virtues of style sheets. Some things never change. 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 a previous article I outlined several techniques for using CSS to layout a web page. One of those techniques involved manipulating a list to display horizontally rather than vertically. In this article, I'll demonstrate how to use CSS to bring unwieldy lists under control. It’s time for you to tell lists how to behave, instead of letting them run wild on your web page.
Newhouse, Mark. List Apart, A (2002). Design>Web Design>CSS
