html - qué - <h1>,<h2>,<h3>... etiquetas, en línea dentro de los párrafos(<p>)
tags h1 ejemplos (6)
Estás haciendo mal uso de las etiquetas de encabezado .
Debe usar etiquetas <span>
con clases de CSS.
Lo probé y lo que sucede es que cuando Firefox ve una etiqueta <h1>
no válida dentro de <p>
, automáticamente cierra la etiqueta <p>
. Puedes ver esto claramente en Firebug.
Estoy tratando de tener etiquetas <hx>
dentro de párrafos, como:
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pulvinar tincidunt neque, at blandit leo mattis vitae. Cras <h2>placerat</h2> justo vel risus porta cursus. Nullam eget sem nibh. Sed <h3>mattis</h3> facilisis rhoncus. Morbi sit amet nisl lectus.</p>
Pero siempre tengo un salto de línea antes de cada uno de ellos, incluso aplicando todos estos, y combinaciones de las siguientes declaraciones:
h1, h2, h3, h4, h5, h6 {
display:inline !important;
text-transform:none;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
clear:none;
color:inherit;
margin:0;
padding:0;
}
Entonces, ¿qué puedo hacer para que las etiquetas pasen desapercibidas en línea con el texto? Ahora mismo me sale algo como
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam pulvinar tincidunt neque, en blandit leo mattis vitae. Cras
Placeres justo en el porta porta. Nullam eget sem nibh. Sed
mattis facilisis rhoncus. Morbi se sienta amet nisl lectus.
Gracias
PD: por cierto estoy usando el tema de marco de blueprint para drupal.
La etiqueta <p>
solo puede contener elementos en línea. Las etiquetas de encabezado son elementos a nivel de bloque y no pueden ir dentro de las etiquetas <p>
incluso cuando las estiliza para mostrar en línea.
Son semánticamente incorrectos dado este uso de todos modos: los párrafos no deben tener encabezados flotando aleatoriamente dentro de ellos. Considere el uso adecuado de las etiquetas <em>
y <strong>
, o si realmente no son lo que está tratando de describir, use las etiquetas <span>
con clases específicas.
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam
pulvinartincidunt neque, at blandit leo mattis vitae.
Cras <em>placerat</em> justo vel risus porta cursus. Nullam eget
sem nibh. Sed <strong>mattis</strong> facilisis rhoncus. Morbi sit
amet nisl lectus.</p>
Las etiquetas "H" son para encabezados, títulos, para mostrar un punto de ruptura en un tema. Las etiquetas "p" son para controlar longitudes de texto juntas, cada párrafo separado obtendrá una "p". Las etiquetas "span" solo deben ir dentro de las etiquetas "p", se usan para mostrar el énfasis dentro del párrafo, pero están limitadas cuando se trata del estilo css. Desafortunadamente, debe seguir la estructura html de estas etiquetas, de lo contrario tendrá algo diferente en cada navegador.
Las etiquetas p se rompen automáticamente tan pronto como el analizador html alcanza las etiquetas hx. Si realmente desea hacer esto, debe cerrar la etiqueta p antes de la etiqueta hx. luego configura p y hx para mostrar en línea!
SLaks tiene razón. No debes usar el encabezado del párrafo. Sin embargo, si realmente lo necesita (en caso de que esté escrito por otra persona). Puedes resolver el problema configurando p
para que esté en línea también. Que funcionará.
Simplemente coloque una etiqueta h2 al comienzo del párrafo. Por ejemplo. <p>The p tags are automatically breaking as soon as the html parser reaches the hx tags. if you really want to do this you must close the p tag before the hx tag. then set p and hx to display inline!</p>
<p>The p tags are automatically breaking as soon as the html parser reaches the hx tags. if you really want to do this you must close the p tag before the hx tag. then set p and hx to display inline!</p>
es el para y queremos que se rompa automáticamente con la etiqueta h1.
<p><h2></h2>The p tags are <h1>automatically breaking</h1> as soon as the html parser reaches the hx tags. if you really want to do this you must close the p tag before the hx tag. then set p and hx to display inline!</p>
pero no podemos lograr el estilo que le dimos a la etiqueta p, ya que la etiqueta p se rompe automáticamente.
Nota: la etiqueta h1 debe tener el estilo de
h1{ display:inline; !important}