first-letter {font-size:42px; width:200px;} : Pseudo Class « Style Basics « HTML / CSS






  1. HTML / CSS
  2. Style Basics
  3. Pseudo Class

first-letter {font-size:42px; width:200px;}

 

<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

<head>
  <title>CSS Example</title>
<style type='text/css'>
p.pageOne:first-letter {font-size:42px; width:200px;}
p.pageOne:first-line {font-weight:bold;}
</style>

</head>

<body>
<p class="pageOne">there was a pseudo-class that allowed you to specify a different rule for the first letter of an element's content, and another that allowed you to specify a different rule for the whole of the first line. 
</p>
</body>
</html>








Related examples in the same category

1.The first-child Structural Pseudo-Class
2.Dynamic Pseudo-Class Selectors
3.first-letter and :first-line Pseudo-Elements
4.Dynamic pseudo-classes
5.Structural pseudo-classes
6.:target pseudo-class
7.h1::before, h1::after content: "::";
8.The first-child pseudo-class
9.Using the first-letter pseudo-element to create a "drop cap" letter
10.Link Pseudo-Class Example
11.:before and :after Pseudo-elements
12.Use Pseudo-Classes
13.First-letter Pseudo-element
14.Creating a drop cap using a CSS pseudo-element
15.First Line and Letter
16.p:first-line{font-weight:bold;}
17.tr:first-child
18.Set style for a:link and a:visited