CSS Masterclass

The complete beginners guide

4.00 (1 reviews)
Udemy
platform
English
language
Web Development
category
instructor
CSS Masterclass
28
students
7 hours
content
Nov 2017
last update
$19.99
regular price

What you will learn

Students will have the knowledge and technical understanding as to building modern, responsive websites using the latest CSS technologies

Learn the fundamentals and theory of the CSS language and related tools

Understand CSS frameworks like Twitter Bootstrap

Understand CSS values

Understand the box model and HTML element 'Tree'

Understand element ‘relationships’

Description

CSS stands alone as the most important technology when it comes to 'styling' web pages. CSS is not a tool, framework or some form of development library. It is one of the backbone technologies that powers the web alongside HTML and Javascript.  In short, html focuses on the structure of the web page document, javascript the interactivity and dynamic behavior; CSS is all about the design of web pages. Web design continues be transformed for the better with each iteration of the CSS language.  Why? Because with it, you can design beautiful, modern and responsive websites. CSS and it's latest version allows designers and developers the ability to create industry leading websites. 

In this course, I help you to get off the ground running with CSS. We'll talk not just about how things work in CSS but why. We'll look at some of the intricacies of the language and then some working examples as to how to work with css properties and values. Opposite to other courses on CSS, this course does not explain how to create certain CSS/HTML implementations like fancy headers, nav-bars etc... Why? Because the focus is on the fundamentals. 

The lessons in this course will help you gain a solid foundation in CSS and will help you further your studies in all aspects of CSS whether that be frameworks, layout techniques, responsive web design, media etc.. 

TOPICS we'll discuss: 

SELECTORS

HTML ELEMENT "TREE"

THE 'CASCADE'

INHERITANCE

THE ALL IMPORTANT "BOX MODEL"

FLOATING 

FRAMEWORKS 

AND MUCH MORE.......

This course is very much the course I wish I'd had when I began my career in web development years ago. I built this course for that student in mind. 

It is my hope that you too will join and benefit from this course all the same! 




Content

Introduction - Laying the groundwork

Welcome!
Getting Set Up
Brief History of CSS
The Basics
The Basics - 'Targeting Elements'
The Basics -'Selectors'
The Basics - 'Id Selectors'
The Basics - 'Group Selectors'
The Basics - 'Descendant Selectors'
'Descendant Selectors' continued
'Descendant Selectors' Example
Additional Selectors in CSS
Pseudo Elements & Classes
Pseudo Classes
Pseudo Elements

CSS Core Fundamentals

Intro To
CSS Box Model
CSS Box Model - Continued
Box Model Properties
Quick Detour - CSS Values
Box Model - Adding "values to our properties"
Box Model - Adding "values to our properties" - Continued
Box Model - Applied Margins & Padding
Box Model - Applied Margins & Padding - continued
Box Model - Giving our 'divs' structure
Box Sizing - Calculating total Box Size
CSS display: block, inline, inline-block

CSS Core Fundamentals part II - Inheritance & the Cascade

Inheritance
The CSS cascade
Calculating Specificity
Cascade/Specificity example

Web Page Layout in CSS

Introduction
Static Vs Dynamic Layouts
Static Layout - Explained
"Floating" elements in CSS
Float Explanations
Floats - Clearing & the Clearfix:
Positioning in CSS
Positioning 101
Using Position
Effects of Positioning
Position: Relative
Relative Positioning example
Fixed Positioning
Positioning - tips and suggestions

Laying out our Blog post

Introduction
Quick Detour: Formatting Text
Formatting text - continued
Custom Fonts - Things to know
Using our Custom Fonts
Using Google Fonts
Laying out our blog post - Explained

Responsive Web Design

Introduction
Responsive Web Pages - Goals
Properties related to RWD
Media Queries
Staying Flexible
RWD CSS - explained
Div Section - Explained
Analyzing 'medium' stylesheet
Analyzing 'small' stylesheet

Understanding CSS Frameworks

Introduction
'Grid Systems'
Grid System vs CSS Grid Layout
Bootstrap - Getting Started
Downloading Bootstrap
Understanding the Bootstrap Site
Bootstraps Grid Inner-Workings
Bootstrap Classes
Laying out our web page with Bootstrap - explained
Webpage Design - Tips

Final CSS Properties

Backgrounds in CSS
Background Positioning and specifics
Background Size
Background Attachment
Miscellaneous - Gradients
Final Thoughts.. Thank you!

Charts

Price

CSS Masterclass - Price chart

Rating

CSS Masterclass - Ratings chart

Enrollment distribution

CSS Masterclass - Distribution chart
1342630
udemy ID
9/5/2017
course created date
12/12/2021
course indexed date
Bot
course submited by