We covered the basic syntax and few cool things about CSS3 in the workshop. We also showed a quick overview of Bootstrap's grid system. Below you'll find few of the highlights and links to useful resources:
- The basic syntax for a CSS statement is: "Selector {Property : Value;}"
- There are 3 kinds of selectors in CSS:
- Elements (h1, p, etc.)
- Ids (#myID) (each ID can be used only once per html page)
- Classes (.myClass) (can be used on as many elements as needed)
- "@" is used for CSS definitions (ex: @keyframes)
- ":" is used for CSS selector related events (ex: .myClass:hover)
- Animations are performed in a keyframed way in CSS. Define a keyframe animation then apply it to a specific selector/event
- The are plenty of cool things that can be done in CSS. Always look up CSS references before making the decision of using other options (JavaScript, etc.)
- There are plenty of solid CSS-based frameworks on the internet; by all means, use them to make your life easier!
- YouTube - Derek Banas - Bootstrap crash course
- YouTube - Derek Banas - CSS3 tricks
- Bootstrap - Official website
- w3schools - Bootstrap
- Materialize - Great light-weight CSS framework based on Google's material design
- CSS-Tricks - Great resource for CSS discussions & code snippets
Once again, if you have any questions, don't hesitate to shoot me an email at: marwan@alani.ca