Índice

Pseudoclases de párrafo

1. :first-letter

Esta pseudoclase :first-letter permite definir la apariencia de la primera (y solo de la primera) letra de un párrafo. Se logra un efecto de letra capital.

Ejemplo

<!DOCTYPE html>  
<html lang="es">  
<head>  
<title>Html5</title>  
<meta charset="UTF-8">   
<style type="text/css">  
#box { border: 1px solid black;  
       margin-left: 30px;  
       width: 200px;  
       padding: 10px;}  
.letracapital:first-letter { margin-right: 5px;  
                             font-size: 4em;}  
</style>  
</head>  
<body>  
<div id="box">  
<div class="letracapital">He aquí un texto que ilustra 
el efecto de letra capital que podemos obtener con: first-letter.</div> 
</div>  
</div>  
</body>  
</html>
images/CAP18IMG05.png

2. :first-line

Esta pseudoclase :first-line permite definir la apariencia de la primera (y solo de la primera) línea de un párrafo.

La longitud de la primera línea es variable y dependerá del ancho del elemento caja, del tamaño ...