WEBVTT

00:00:00.535 --> 00:00:03.056
Let's see what else we can change
about the font.

00:00:03.440 --> 00:00:06.269
What if we want
this first paragraph to be bold?

00:00:06.531 --> 00:00:09.416
We could wrap the whole paragraph
in a `` tag.

00:00:09.532 --> 00:00:12.480
But that would be kind of an abuse
of a `` tag.

00:00:12.579 --> 00:00:14.112
We're not really trying to say

00:00:14.112 --> 00:00:16.322
that the whole first paragraph
is a highlight.

00:00:16.337 --> 00:00:18.628
We just think it might look better bolded.

00:00:18.641 --> 00:00:21.862
So instead, we should use
a CSS property: `font-weight`.

00:00:22.245 --> 00:00:27.562
Let's go up to the relevant CSS rule,
and say, `font-weight: bold`.

00:00:28.025 --> 00:00:29.345
Ta-da! It's bold.

00:00:29.917 --> 00:00:34.664
Now, what if we want to make
all of these lyrics italicized-- slanted?

00:00:34.782 --> 00:00:37.869
Once again, we could wrap them all
in an `` tag,

00:00:37.869 --> 00:00:42.372
because the browser always defaults
to giving `` italicized style.

00:00:42.555 --> 00:00:44.085
But we shouldn't do that,

00:00:44.085 --> 00:00:46.750
because that's kind of an abuse
of the `` tag.

00:00:46.842 --> 00:00:49.248
We're not trying to emphasize
the whole song.

00:00:49.392 --> 00:00:52.132
We just think 
it might look better italicized.

00:00:52.335 --> 00:00:55.983
So instead, we should use
a CSS property: `font-style`.

00:00:56.432 --> 00:00:59.529
Let's go up to our relevant rule,
`song-lyrics`,

00:00:59.529 --> 00:01:03.120
and say,
`font-style: italic`.

00:01:03.681 --> 00:01:05.645
Okay, great.

00:01:05.889 --> 00:01:08.926
Notice that we have a bunch
of font-related properties

00:01:08.926 --> 00:01:10.454
in one rule for our lyrics.

00:01:10.630 --> 00:01:13.870
We've got `font-family`, `font-size`,
and `font-style`.

00:01:13.954 --> 00:01:19.305
If we want, we can actually bundle them up
into a single property: `font`

00:01:19.305 --> 00:01:24.445
by just writing:
`font: italic 13px fantasy;`.

00:01:25.083 --> 00:01:28.772
Okay, and we can delete
the three properties that we used to have

00:01:28.992 --> 00:01:30.908
and everything looks the same.

00:01:31.092 --> 00:01:35.891
This is called a "shorthand property",
since as you can see, it's a lot shorter.

00:01:36.091 --> 00:01:37.667
But me, I don't like it.

00:01:37.667 --> 00:01:41.038
Because I always forget what order
to write the properties in,

00:01:41.038 --> 00:01:43.952
and it's just easier 
if I write them out one at a time.

00:01:44.196 --> 00:01:47.020
So I'm going to bring back
what I had before.

00:01:48.360 --> 00:01:51.951
It's up to you-- if you're a 
"shorthander" or a "longhander".

00:01:52.229 --> 00:01:54.816
The important thing
is to stay stylish.