CSS Tutorial for Beginners - 55 - first Selector - Selectors Part 8 Video Lecture | Learn CSS: A Comprehensive Tutorial for Web Developers - Front-End Programming

we're going to wrap up our marathon
section on selectors and we're going to
look at the first selectors in CSS and
the first one we're going to look at is
the first letter selector and you
guessed it it selects the first letter
in an element now you'll notice that
this particular pseudo selector needs a
double colon and basically that is to
differentiate this type of pseudo
selector from other pseudo classes we're
not going to get into the very lengthy
reason why it's not really necessary
just remember when you want to use the
first letter selector you need a double
colon now we're going to go ahead and
target our paragraph elements of our
paragraph elements so we're going to go
ahead and increase the size and you'll
see that sometimes in paragraphs where
they'll increase the size of the first
letter and make it bold so let's just go
ahead and do that here so let's go ahead
and set the font weight to bolt and then
let's increase the font size and we'll
set this to 24 pixels that looks pretty
good okay so let's go ahead and save
this let's refresh our page and there
you can see the first letter and all of
our paragraphs are now bold and they are
a larger font size now one of the more
recent selectors is the first-line
selector and that is very handy if you
want to do some responsive CSS
development and you guessed it it allows
you to select the first line in a
particular element this might be useful
if you have a bunch of banners and you
want to highlight the first line or if
you have an advertisement and you want
to bring attention to the very first
line to grab people's attention it can
be very useful for things like that so
let's go ahead and we'll just copy and
paste this rule set here so we don't
have to type everything over again now
the big difference is for this pseudo
selector we actually only use one colon
so that's all we use and let's go ahead
and set this to first line and let's go
ahead and change the color to red so we
want to bring some attention to the
first line in each one of our paragraphs
and again you could select any element
with text that you want we could select
our h2 elements or h1 elements whatever
we want so let's go ahead and save this
let's refresh our page and there you can
see every single line now is selected so
that looks pretty good okay I will see
you guys in the next video thank you