nobuti / css-workshop

CSS Workshop

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Basic CSS Workshop

When using CSS properly, we can create powerful and beatuful web sites that are easier to develop, maintain and edit. After a short review of some basics and coverage of a few new topics, the workshop focus is on real-world CSS issues and applications.

Prerequisites

  • If you are a ninja or a whatever rockstar, this course is not for you. Probably you'll know all of this. But still you can contribute to it. Fork it!
  • You know what is a webpage and how is its basic structure of an HTML page (html, body, head, ...)
  • You have a basic undertanding of the main html tags (div, p, br, ul, li, ...)

Running locally

First, clone the repo and move to that folder:

git clone git@github.com:nobuti/css-workshop.git
cd css-workshop

To bootstrap the app, you'll need Ruby 2.x. Just run:

  1. bundle install

  2. foreman start

Then visit http://0.0.0.0:5000

Outline

This is still a work in progress, so the contents can be changed. So keep your fork in sync.

  • Module 1: Introduction to CSS.

    You'll learn what is CSS, why it is important and how you can add styles to your pages. You'll learn what is a CSS rule, and how powerful are selectors.

  • Module 2: Cascading and Inheritance

    You'll learn what the term cascade means, how the browser resolve conflicts between rules and how the inheritance works in CSS.

  • Module 3: Styling Text

  • Module 4: Layout with CSS

  • Module 5: CSS3

Attributions

Thanks to @LeaVerou, this site use the awesomeness of CSSS

License

Creative Commons License
This work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.

About

CSS Workshop


Languages

Language:JavaScript 67.7%Language:CSS 29.5%Language:Ruby 2.6%Language:Shell 0.2%