Hi, and welcome to this Dream Move tutorial. My name is Daniel Walter Scott, and I'm a trainer here at Bring Your Own Laptop. Um, in this course, what we're gonna look at is CSS. What CSS will allow us to do is to style all of our HTML. So currently we've got our vintage camper page and we've got our H ones, our H twos, our paragraph tags, and some links, but we haven't been able to change the color or the size of the font. So this is what this next, next section is about.
So we're gonna create, um, uh, a separate sheet called a CSS sheet, which is short for cascading style sheet. And we're gonna style those fonts. So I've got this file here open for you. This is, um, one of my websites. It's the Bring Your Own Laptop website that I created for the Australian site. Now you can see it's kind of like our, uh, vintage camper.
It's quite simple images, everything's in line. But what I'll show you is I've created a CSS sheet. I've turned it off for the moment just to show you what it looks like without the CSS. So quite similar. There's a lot more, um, text in this version, but quite similar to the vintage Camper one. So what I'll do is I'll turn the CSS back on.
So let's find this view style rendering display style. So this is gonna turn my CSS back on. And can you see it's changed the site quite substantially. Okay. All the CSS styles, um, all the fonts, it styles the layout. And this, um, part of the tutorial, we're gonna look at just styling the fonts to start with.
We'll look at layout and the later one. So, um, let's have a look at split view. So on the right here is my HTML with a CSS applied. And this is what CSS looks like. It's quite similar to HTML, okay? But it's a little simpler, okay?
It's nice and easy to use. So on this right hand side here, um, I've got this bit of text highlighted, and you can see down the bottom here, it's called Blog two. Um, okay, so it's got this thing called blog two that I've added to it, just the name. Um, and over here I've styled blog two and I've told it to be a font size of 1.2 ems, which is the size of the font. I've given it a font family. So Museo Sands rounded, that's what I've decided for this one.
Um, it's got a tech shadow. So drop shadow, um, it's a white one that's over the side there. And these are the colors that make that work. And the line height is the leading or the space between lines and the font weight is how heavy it is. Um, so is it a light, is it medium? Is it a bold, is it a black?
So those are the things. Styling. Um, this, um, blog post two here, text. Okay? So I can make changes in my code in the CSS and watch an update on the right hand side. So I'm gonna change this to a bigger size.
So 1.7 and your watch over here, it updates to 1.7. Great. So that's what we're gonna do. We're gonna, um, create our, um, CSS sheet, okay? And we're gonna do some font styling and try and get our vintage camper site looking a little more trick. All right.
To see you in the next tutorial.