From the course: CSS Shorts

Unlock this course with a free trial

Join today to access over 22,600 courses taught by industry experts.

Outline your text

Outline your text - CSS Tutorial

From the course: CSS Shorts

Start my 1-month free trial Buy for my team

Outline your text

“

- [Chris] Hi, this is Chris Converse, and in this episode, we'll create some outlined text for our webpage heading, complete with transparency within the letter forms. Now, at the time of this recording, there are a few browsers on the Windows desktop platform that don't support this technique. And these are IE 11 and the Edge browser. However, we'll set up the CSS so that those browsers will show the text in a solid color. So if you'd like to follow along, download the exercise files, and let's begin by opening the HTML file in a text editor. So once you have the HTML file open, you'll see that we have a pretty simple layout here. In the body area, we have the header with an h1. This is the heading that we're going to be styling into outlined text. And up in the head area, we have a link to style.css. So to begin to create this effect, let's go back to the exercise files. Let's find style.css and open that in our text editor. Let's scroll down a little bit. Let's find the h1 rule…

Contents