Expanded Library

HTML and CSS Playbook

HTML and CSS are the fundamental tools for communicating to an Internet audience. This course will teach you a bunch of plays for your playbook and show you how to solve some interesting challenges you’ll face with HTML and CSS.

Preview this course

What you'll learn

In this course, HTML and CSS Playbook, you will learn tactics to solve challenges in web page development using HTML and CSS. First, you'll look at more than twenty different problems and solutions that come up in developing compelling user interfaces on the web. Next, you'll learn solutions that include masking inputs to ease the load on the user, creating HTML which is accessible to all audiences. Finally, you'll see how to work with custom fonts to create effective text for your pages, and much, much more. By the end of the course, you'll have the skills and knowledge to tackle these and many other common HTML and CSS challenges needed to create powerful web pages.

Table of contents

Course Overview

1min

Course Overview 1m

Setting up Our GitHub Repo for Success

9mins

Setting up Our GitHub Repo for Success 9m

Make CSS Like Proper Code with SASS

15mins

Make CSS Like Proper Code with SASS 15m

Three Ways to Center Elements

10mins

Three Ways to Center Elements 10m

Create a Collapsible List without Script

8mins

Create a Collapsible List without Script 8m

Make Your HTML Accessible to Everyone

9mins

Make Your HTML Accessible to Everyone 9m

Five Ways to Make Your Text More Readable

7mins

Five Ways to Make Your Text More Readable 7m

Work with Custom Fonts

5mins

Work with Custom Fonts 5m

Filter Your Inputs with Simple HTML

10mins

Filter Your Inputs with Simple HTML 10m

Work Effectively with Semantic HTML

13mins

Work Effectively with Semantic HTML 13m

Know What Works in Which Browsers

10mins

Know What Works in Which Browsers 10m

Use a UI Framework like Bootstrap

10mins

Use a UI Framework Like Bootstrap 10m

Create Compelling Animations Using Only CSS

15mins

Create Compelling Animations Using Only CSS 15m

Reduce Your HTTP Requests with CSS Image Sprites

10mins

Reduce Your HTTP Requests with CSS Image Sprites 10m

Create Powerful Graphics with SVG in HTML

20mins

Create Powerful Graphics with SVG in HTML 20m

Control Your Capitalization with CSS

9mins

Control Your Capitalization with CSS 9m

Make Your Links Target Different Media and Devices

12mins

Make Your Links Target Different Media and Devices 12m

Replace These Zombie Tags with Something Better

11mins

Replace These Zombie Tags with Something Better 11m

Restrict File Types in Upload Inputs

7mins

Restrict File Types in Upload Inputs 7m

Select Multiple Files with Upload Inputs

5mins

Select Multiple Files with Upload Inputs 5m

Create Simple Data Visualization with HTML and CSS Only

14mins

Create Simple Data Visualization with HTML and CSS Only 14m

Take Control Over Mobile Presentations with Media Targets

9mins

Take Control Over Mobile Presentations with Media Targets 9m

Conclusion

6mins

Conclusion 6m

About the author

Ready to upskill? Get started

Ready to skill up
your entire team?

10

Subscriptions

Continue to checkout Continue to checkout

Cancel

With your Pluralsight plan, you can:

With your 30-day pilot, you can:

Access thousands of videos to develop critical skills
Give up to 10 users access to thousands of video courses
Practice and apply skills with interactive courses and projects
See skills, usage, and trend data for your teams
Prepare for certifications with industry-leading practice exams
Measure proficiency across skills and roles
Align learning to your goals with paths and channels

Ready to skill up
your entire team?

10

Subscriptions

Continue to checkout

Cancel

With your Pluralsight plan, you can:

With your 30-day pilot, you can:

Access thousands of videos to develop critical skills
Give up to 10 users access to thousands of video courses
Practice and apply skills with interactive courses and projects
See skills, usage, and trend data for your teams
Prepare for certifications with industry-leading practice exams
Measure proficiency across skills and roles
Align learning to your goals with paths and channels