From the course: CSS Shorts

Unlock this course with a free trial

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

Add a QR code for print

Add a QR code for print - CSS Tutorial

From the course: CSS Shorts

Start my 1-month free trial Buy for my team

Add a QR code for print

“

- [Chris] Hi, this is Chris Converse, and in this episode we'll add a QR code and a URL to a web page when it's printed. We'll use CSS to detect when the page is being printed then we'll add the graphics and text using pseudo elements. If you'd like to follow along, download the exercise files. We'll begin by opening the HTML file in the text editor. Once you have the HTML file open, you'll see we have a simple layout to start with. In the code, in the head area, we have a link to style that CSS which we'll be opening in a moment. Inside of the body area we have an article with an image, an H1, a paragraph, and a footer. At this point I do have one media query in the CSS file. If we come over to the HTML page, then come down and print, you'll see I've set the background to be white and the fonts to be black. Now what we're going to do is go into our exercise files. Let's open up style.css in our text editor and let's add a few additional properties to change some content in the…

Contents