"If at first you don't succeed; call it version 1.0" :-Unknown

Pages

Sunday, July 10, 2011

The :first-line Pseudo-element

It a CSS Style tip.The "first-line" pseudo-element is used to add a special style to the first line of a text.First line depend on Window Size and Break point Not the next Dot (.).

Demo
<html>
<head>
<style type="text/css">
p:first-line
{
color:#ff0000;
font-variant:small-caps;
}
</style>
</head>
<body>
<p>www.simplyasp.blogspot.com/2010/06/show-image-from-database-and-mouse-over.html.</p>
</body>
</html>

Output






Note: The "first-line" pseudo-element can only be used with block-level elements.
Note: The following properties apply to the "first-line" pseudo-element:
  • font properties
  • color properties 
  • background properties
  • word-spacing
  • letter-spacing
  • text-decoration
  • vertical-align
  • text-transform
  • line-height
  • clear

Have a nice day... 'N happy Coding :)

No comments: