Introduction to CSS
by John Elder
If you have ever wanted to build and design stylish, responsive websites, this introductory course can help you get started with CSS for web design and development. Designed for beginners, no prior experience with CSS is required to get the most out of this course. You will start with the basics and apply the practical knowledge you learn through hands-on application and examples every step of the way. By the end of the course, you will have learned to apply fundamental design elements in CSS to create a beautiful and functional user experience.
Getting Started with CSS
Course IntroductionWhat is CSS and what is it used for?
Setting up a Cloud Development Environment
What tools do you need to write CSS?
CSS SyntaxUnderstanding the basic CSS syntax.
Using CSS 3 WaysLearn the three main ways to use CSS on a web page.
ColorsHow to add and change the colors of elements.
BackgroundsChanging background colors, images, and more.
BordersAdding borders to elements, and modifying the border style.
Margins and PaddingUnderstanding the difference between Margins and Padding.
Height and WidthHow to change the height and width properties of an element.
Box ModelUnderstanding the CSS Box Model for your design and layout.
OutlineLearn how to change the style, color, and width of an outline.
Text FormattingHow to change the formatting and alignment of text.
FontsHow to manipulate the font family, boldness, style, and size, of text.
LinksLearn to style links. Understanding active, hover, and visited formatting as well as text decoration.
ListsStyling both ordered, and un-ordered lists.
TablesHow to greatly alter the look of HTML tables.
DisplayUnderstanding how an element is displayed with CSS.
PositionUnderstanding static, relative, fixed and absolute positioning.
Float and ClearUnderstanding Float left, Float right, and the clear statement.
Inline-BlockLearn how to make floating easier with Inline-Block
AlignAligning elements horizontally and vertically, as well as centering objects.
CombinatorsWhat are Combinators, and when to use them.
Pseudo-ClassUnderstanding CSS Pseudo-Classes and how to use them.
Rounded CornersAdding cool rounded corners to things.
Border ImagesUsing images for borders instead of lines.
GradientsUsing Gradients with nothing more than CSS (no images needed).
ShadowsAdding Shadows to elements.
Rounded ImagesAdding Rounded features to images with CSS.
ButtonsCreating and styling buttons with CSS.
PaginationCreating Pagination with CSS.
Responsive Mobile Design with CSS
Intro to Responsive Design
Understanding the concept of responsive design for mobile devices.
Grid ViewWhat is the grid view and why is it important?
Media QueriesShowing different web page designs based on different sized devices.
ImagesHow to resize images responsively for mobile devices.
Using Responsive FrameworksHow to use a framework like Bootstrap to shortcut your responsive programming.
Using the Bootstrap CSS Framework
Setting Up BootstrapHow to add Bootstrap to your website.
Basic Bootstrap UsageUnderstanding the basics of Bootstrap
Modifying BootstrapHow to modify the underlying bootstrap CSS code.
- 39 practical tutorials.
- Learn how to add and change colors of elements.
- Add background colors, images and borders.
- Understand the difference between margins and padding.
- Change the formatting and alignment of text.
- Style links, lists and manipulate fonts.
- Understand CSS pseudo-classes and how to use them.
- Use gradients, shadows and rounded corners.
- Add buttons and pagination for easy navigation.
- Make your design responsive for mobile devices.
- Setting up, using and modifying Bootstrap.
Once enrolled, our friendly support team and tutors are here to help with any course related inquiries.
View all reviews