Practical CSS for No-Coders

Course details

If you’re using a no-code tool to build your website, you may find it looks a bit generic. How can you make the site uniquely your own? CSS comes to the rescue! CSS (Cascading Style Sheets) is responsible for anything pretty on the web, including colors, fonts, layouts, and much more. Just a little bit of CSS code can give you the customizations you need, and web design and development instructor Jen Kramer shows you exactly how to do it. Jen introduces you to CodePen, a tool used for working with HTML and CSS within a web browser, then goes over what CSS does and how it’s structured. She explains how to use selectors to apply CSS to your page, then dives into CSS colors, images, boxes, sizes, and type. Plus, Jen covers more advanced CSS concepts and properties, like styling links, understanding inheritance, and debugging your creation.

Concepts

0. Introduction

01 - Styling the web for no-coders
02 - Working in CodePen
03 - What is CSS and how is it structured

1. Applying CSS to Your Page with Selectors

04 - Writing your first comment and element selector
05 - Writing a class selector
06 - Grouping selectors
07 - Descendent selectors
08 - Challenge - Working with selectors
09 - Solution - Working with selectors

2. CSS Colors and Images

10 - Identify a color scheme
11 - Formatting color in CSS
12 - Background and text color in CSS
13 - Understanding images in CSS
14 - Working with background images in CSS
15 - Challenge - Style this web page
16 - Solution - Style this web page

3. CSS Boxes, Sizes, and Type

17 - Understanding type in CSS
18 - Applying type formatting with CSS
19 - Understanding and applying size in CSS
20 - Understanding the box model in CSS
21 - Working with border, padding, and margin in CSS
22 - Challenge - Add styling to this page
23 - Solution - Add styling to this page

4. More Advanced CSS Concepts and Properties

24 - Styling links with CSS
25 - Understanding inheritance in CSS
26 - Debugging CSS with borders and background colors

Conclusion

27 - Next steps