CSS: Nebraska

(A very brief introduction to CSS)

NCompass Live 30 March 2011

Michael SauersTechnology Innovation

Librarian,Nebraska Library

CommissionAuthor of XHTML & CSS Essentials for

Library Web Designhttp://www.flickr.com/photos/21814247@N08/5256026599/

CharlieSheenSyndro

me

#winning

What is CSS?

• Cascading Style Sheets• A coding language that allows for controlling the look and feel (style) of content• Typically used to present Web (HTML/XHTML) content.

Benefit #1:

Content creators can

on content

http://www.flickr.com/photos/56387066@N00/1810357551/

Benefit #2:Design enforcement

http://www.flickr.com/photos/11051496@N00/3459379822/

Benefit #3: Write once, use many

http://www.flickr.com/photos/hkdmz/3132679379/

Benefit #4:Redesign made

easier

Benefit #5:Different styles

for different media

http://www.flickr.com/photos/69135870@N00/4203327202/ - http://www.flickr.com/photos/31477465@N02/4324941403/http://www.flickr.com/photos/14497193@N04/5072723955/ - http://www.flickr.com/photos/8675898@N03/5063557111/

Benefit #6: Accessibility

http://www.flickr.com/photos/47379017@N00/4971661764/

What does CSS look like?

Three Ways to implement CSS

1. External2. Embedd

ed3. Inline

http://www.flickr.com/photos/8980157@N06/3978562587/

Let’s jump in and get messy!

http://www.flickr.com/photos/17217108@N00/3545065342/

http://pastehtml.com/ http://www.lipsum.com/

The Cascade

• Browser• Coder– External– Embedde

d– Inline

• User

http://www.flickr.com/photos/75544898@N00/3575436924/

http://www.flickr.com/photos/juehuayin/3876764554/

The Box Model

http://www.flickr.com/photos/juehuayin/3985429095/

http://www.flickr.com/photos/eplewis/4179681048/

Michael SauersTechnology Innovation

Librarian, Nebraska Library

Commissionmichael.sauers@nebraska

.govwww.travelinlibrarian.info

Thank you!

http://www.flickr.com/photos/39664542@N07/5335872369/