CSS se utiliza para diseñar una página web para que sea más bella y atractiva para los usuarios.
Después de insertar un salto de página después de cada pie de página, se verá mejor y también evitará la repetición mediante el uso de la propiedad CSS page-break-after .
Sintaxis:
.foot {
page-break-after: always;
}
Page-break-after proporciona muchos más valores de propiedad:
- salto de página después: automático;
- salto de página después: siempre;
- salto de página después: evitar;
- salto de página después: izquierda;
- salto de página después: derecha;
- página-salto-después: anverso;
Ejemplo: Para insertar un salto de página después de todos y cada uno de los pies de página o de un elemento específico, usamos la propiedad page-break-after: always;
HTML
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.footer {
margin: 10px 0 0 0;
padding: 10px 0;
border-bottom: 1px dotted Black;
page-break-after: always;
}
body {
font-size: 1rem;
width: 40%;
margin: auto;
font-family: cormorant infant;
}
</style>
</head>
<body>
<h2>Welcome To GFG</h2>
<p>
GeeksforGeeks is my favorite site where
I can gain a lot of knowledge and can
also share my knowledge what I have
gained while learning. We can add more
paragraphs for content. This is just an
example to tell how to create a story
book like effect. More paragraphs,
content just for showing its best effect.
Some more paragraphs needed. Just some
more. Now you can see it.
</p>
<div class="footer">
This article tells about how to insert a
page break after every footer using CSS.
We can add more paragraphs as required.
</div>
</body>
</html>
Producción:
Hemos insertado un salto de página después de cada pie de página, lo que atraerá a los lectores a leer los contenidos de la página web.
Publicación traducida automáticamente
Artículo escrito por officialanupam1 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA