1 of 12

Slide Notes

DownloadGo Live

CSS for Newbie

Published on Feb 11, 2016

As I am a designer who can coding, I would like to inspire web designers that programming is not difficult. Let's CSS be your first programming language.

PRESENTATION OUTLINE

CSS for Newbie

- Good start for someone who know nothing about programming -
Photo by carlosgomez

HTML 101

  • What is tag?
  • &
  • What does means?
  • class vs. id
  • What is inside ?
  • HTML or PHP?
Photo by Jitter Buffer

Let's start styling

Where You Should Place CSS

  • External CSS file
  • Internal style in
  • Inline style
Photo by s2art

CSS Syntax

Click to add more text here

Style of Something

  • Title

  • h1 { color:white; }
  • .myc { font-size: 60px; line-height: 1.5em; }
  • #myh1 { padding: 10px; }
  • Add class if > 1 elements using same style
  • Add id's to fix style for an element
Photo by Pierre Nel

Margin vs. Padding

Learn about space

Bootstrap

Shortcut to make your web look good

Inspect Element

The secret for css creator

GREAT CSS TEACHERS

w3schools and stackoverflow
Photo by tybeeney

If you love to design

CSS is a little thing changing designer to be programmer.
Photo by Dean Hochman