Course Description
If you have ever wanted to become a web developer, then you know you need to know both CSS and CSS3. It's your choice how you learn it. You can read through a textbook or eBook, or you can have your own personal tutor showing you how to do everything every step of the way. That's what this course is all about. This course is taught via a step-by-step tutorial system. You will start with tutorials for beginners who are new to CSS and CSS3 programming and move through progressively more difficult skills, including everything you need to know to build a fully functional, modern and sleek website.
Learn how to develop dynamic sites all at your fingertips.
- Learn the fundamentals of both CSS and CSS3
- Know the difference between CSS and CSS3
- Be able to apply the language into your projects
- Understand how each language has its own purpose
Course Objectives
1. To understand what CSS and CSS3 are
2. To learn the basic techniques of CSS and CSS3
3. To greatly advance your knowledge of CSS and CSS3
4. To build your first website and many more websites in the future
Content
What Is CSS?
Understanding CSS
How CSS and HTML Work Together
Download Source Code
Selectors (Part 1/4)
Selectors (Part 3/4)
Selectors (Part 4/4)
Styling Links (Hyperlinks)
Widths and Heights
Positioning
Centering a Container
Display Types
Hiding an Element
Margins and Padding
Overflow
Element Stack Order (z-index)
Cursors
Box Sizing
Color
Floats
Clearfix
Forcing Uppercase, Lowercase and Capitalisation
Text Alignment
Text Indenting
Backgrounds
Multiple Background Images
Background Size
Borders
Border Images
Font Basics
Selectors (Part 2/4)
Build a Website (Part 1/3)
Build a Website (Part 2/3)
Build a Website (Part 3/3)
Dropdown List Menu (Part 1/2)
Pure CSS Drop-Down Menu
Dropdown List Menu (Part 2/2)
Horizontal Menu (Part 1/2)
Horizontal Menu (Part 2/2)
Vertical Menu
Creating a Button
Display Property
Floating Elements
Clearfix (For Clearing Floats)
Styling Headers
Styling Unordered Lists
Element Shadows (Box Shadow)
Text Shadows
Before and After Pseudo Elements
Image Overlay Effect (Part 1/2)
Image Overlay Effect (Part 2/2)
Opacity
Sprites
Dashed Link Underline
Rounded Borders
2D Transformations (Part 1/4)
2D Transformations (Part 2/4)
2D Transformations (Part 3/4)
2D Transformations (Part 4/4)
Styling Tables
Styling Form Elements
Slide Out Navigation Part 1
Slide Out Navigation Part 2
Buttons
Quick & Easy CSS Triangles
Progress Bar
Creating a 3D Cube with CSS3
Create a CSS3 Avatar/Profile Picture Effect
CSS Speech Bubble Comment Effect
CSS Headline Background Effect
Pure CSS Video Play Button
CSS Icon Fonts