 Hey guys, what's up? This is Brian again, continuing our HTML tutorial. I thought it was about time we got into images. If you've been following along in the tutorial so far, we've learned how to make and manipulate different font attributes, hyperlinks, and linking between pages and just general how to build a simple web page. So let's learn what it takes to add an image. An image is quite literally an image. There's nothing real hard about it. Let's go find one. Let's go to images.google.com and I don't really know what to look for, so we'll just random. And let's see what we got here is Albert Einstein, kind of boring. Oh, Chuck Norris. Oh yeah, we're going to add Chuck to our web page. Now we'll just make a new folder called images. And if you're wondering, you store your website in a directory on your hard drive. I don't know if I covered that before, but it should be kind of self-explanatory. We'll save this as chuck.jpg in our images subfolder. And we go back to our web page. Now for the actual fun part. Adding images is actually extremely easy. We're just going to add in a couple hard returns here. Image is another one of those weird tags that does not have a start or finish. It just has a start. Now in some of the newer languages like ASP.not, which is actually Microsoft's version of ASP and all that fun stuff you haven't learned about yet, they do have certain close tags. But for standard HTML, there's no close tag. Now, do you remember what we named this? chuck.jpg. Save it, flip over to our web page, hit refresh. Now, where's Chuck? He didn't appear. Instead we have this annoying little box with a red X. Well, if you remember right, what happened is we made a folder called images. It's a very complex topic. I'm going to make it very simple. If you just put the file name chuck.jpg, it's going to look for it in the same path as the web page. In this case, index.html. So if chuck was here, it's going to look for it in the same path as the web page. In this case, index.html. So if chuck was here, it would appear fine, but he's not. He's in images. So we have to just quite simply modify the path. We'll put images slash chuck.jpg. Now there's another snazzy command called a base path, which we won't go into because it's rarely used anymore. It's pretty much industry standard to use the virtual path. Save our work. Refresh in Shazam. There's Chuck Norris in all of his 1970s glory. As you notice, there's nothing special about this picture. It's just Chuck Norris. Well, let's turn Chuck Norris into a link. To do that, we can just take our link command we've learned in another tutorial. And we're just going to link to youtube.com. Why not? I'm out of ideas. It's been a long day. Save this. So now we have a hyperlink going to youtube.com, and we're using Chuck Norris as the link. Now remember the last set of links we did, we used text. Click here to go to page two. You can actually use an image or pretty much any other object as a link. So we'll save our work, flip back over, refresh. Now you notice how Chuck's got this big box around him all of a sudden. Well, I'm using it in an Explorer, and yes, I know a lot of people out there hate IE. I'm just using it because it's the industry standard browser that comes with Windows, which is, you know, 92% of the base installs across the world. So if you're using Windows, you're going to have Internet Explorer. It's probably what you know. Love it or hate it. It's what I'm using. Anyways, when you click Chuck Norris, it goes to youtube.com. So let's go back. Well, let's say we want to get rid of this annoying box. How do we do that? We want to keep Chuck as a link, but we want to get rid of this box. That's simple. The image attribute, or I'm sorry, the image link has an attribute called border. We'll just set it to zero. Now we haven't actually talked about the structure of this tag yet. Let me move some of these out here so you can see. It's just, you know, bracket IMG denotes an image. SRC stands for source. The source is the path in quotes, the virtual path images slash chuck.jpg. And we're setting an attribute of border equals zero. When we go back here and we refresh, there's Chuck Norris. Still a hyperlink, no border. Ta-da, it works. So that's our image tutorial, kind of combined with a little bit of advanced hyperlinks. I hope you found this video educational and enjoying. Chuck Norris, if you're out there, I'm sorry, buddy, that's not your best picture. But that's the best I could do on such short notice. Thanks for watching.