La etiqueta p en HTML representa un párrafo. Es un elemento a nivel de bloque, lo que significa que el texto que está presente dentro de la etiqueta de párrafo se considera como un bloque y ocupa todo el ancho disponible. De forma predeterminada, el navegador aplica un salto de línea antes y después de la etiqueta p para separar los párrafos.
Podemos lograr esto agregando la siguiente definición de estilo:
p {
display:inline;
}
Ejemplo 1:
en este código, hemos utilizado el atributo de visualización y lo hemos configurado en línea, lo que cambiará el comportamiento predeterminado de la etiqueta de párrafo y hará que se comporte como un elemento en línea. Al usar la propiedad en línea podemos evitar la nueva línea.
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
p {
padding:5px;
border:1px solid black;
color:green;
font-size:24px;
}
#p2{
display:inline;
}
</style>
</head>
<body>
Random Text1
<p id="p1">Geeks for Geeks</p>
Random Text2
<p id="p2">Geeks for Geeks </p>
Random Text3
</body>
<script>
</script>
</html>
Producción:
Ejemplo 2:
en este código, hemos utilizado el estilo en línea para evitar la nueva línea con párrafos. El enfoque es el mismo que el anterior.
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
p {
padding:5px;
border:1px solid black;
color:green;
font-size:24px;
}
</style>
</head>
<body>
Random Text1
<p id="p2" style="display:inline">Text without new line </p>
Random Text3
</body>
<script>
</script>
</html>
Producción:
Navegadores compatibles:
- Google Chrome
- explorador de Internet
- Firefox
- Ópera
- Safari
Publicación traducida automáticamente
Artículo escrito por RitikGarg2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA