Pages

View Pages:

CSS Pseudo-elements for :first-letter and :first-line

:first-letter and :first-line are css pseudo-elements, only be applied to the block elements such as div, p, ul, table etc...

:first-letter
CSS:
div:first-letter{
     color:#ff0000;
}

HTML:
<div>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text</div>

OUTPUT:
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum
has been the industry's standard dummy text.

:first-line
CSS:
div:first-line{
     color:#ff0000;
}

HTML:
<div>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text</div>

OUTPUT:
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum
has been the industry's standard dummy text.

No comments:

Post a Comment