From the course: HTML: Images and Figures
Join today to access over 24,800 courses taught by industry experts.
Autonumbering figures with CSS - HTML Tutorial
From the course: HTML: Images and Figures
Autonumbering figures with CSS
- [Instructor] When a document like a manual or scientific paper is written. Often times, captions include a prefix like figure one, figure two, and so on. Let me show you what I mean. By searching Google Scholar for web design, I'll scroll down a bit and look at this article about sitemaps and storyboards. And if I scroll down, here's figure two with a caption below it. Let's add figure numbers to the figures we created in the preceding video. In our HTML, we could type the words figure one, figure two and so on inside each fig caption. But the browser can do that for you with CSS. To start the process, lets establish a name to counter in the CSS for the body element and reset it to zero. You do that by specifying the counter reset property and the name of the counter. And figure counter seems like a pretty good name. The next step is to specify the text to be added before the text inside each fig caption element. So I say fig caption before and when that occurs, the first thing to…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.