¿Podemos agregar un <span> dentro de la etiqueta H1?

96

¿Es un método adecuado utilizar la etiqueta span dentro de la etiqueta H1?

<h1>
    <span class="boardit">Portfolio</span>
</h1>

Expandir fragmento

Sé que podemos escribirlo de esta manera ... y también sigo la siguiente sintaxis en mi propio sitio web ...

<h1 class="boardit">
  <span>Portfolio</span>
</h1>

Expandir fragmento

Sin embargo, solo quería saber la forma más limpia de html.

html

— Codeobsesión
fuente

3

@fireeyed creo que quiere seguir lo que es correcto, me refiero a la semántica de la etiqueta.

— dpp

2

No olvide marcar la respuesta como aceptada si tiene la información que desea

— Pranay Rana

Poner intervalos en los encabezados presenta problemas con el ajuste de palabras. ¿Alguien más ha observado esto?

— Rafael

1

¿Alguna vez ha intentado ajustar un texto que está en un lapso? ¿Y qué hay de ajustar el texto que está en cualquier elemento de bloque? @Rafael

— Daniel Springer

180

Sí tu puedes.

HTML4 tiene esto que decir :

<!ENTITY % heading "H1|H2|H3|H4|H5|H6">
<!--
  There are six levels of headings from H1 (the most important)
  to H6 (the least important).
-->

<!ELEMENT (%heading;)  - - (%inline;)* -- heading -->

Y %inline;es:

<!ENTITY % inline "#PCDATA | %fontstyle; | %phrase; | %special; | %formctrl;">

E %special;incluye <span>.

El HTML actual tiene esto que decir :

Contenidos de contenido Contenido de
redacción

Y el contenido de fraseo incluye <span>.

— mu es demasiado corto
fuente

1

El enlace de "HTML5 tiene esto que decir" está roto :(

— mehulkar

@mehulkar Gracias por avisarme, debería arreglarse ahora.

— mu es demasiado corto

30

Sí tu puedes. Puede usarse para formatear una parte de un bloque h1:

<h1>Page <span class="highlight">Title</span></h1>

Si el estilo se aplica a todo el bloque h1, hago esto:

<h1 class="highlight">Page Title</h1>

— mnsr
fuente

1

@dpp ¿por qué debería uno evitar el uso de nombres de presentación?

— nu Everest

agradable, gracias

— Joimee Cajandab

3

Sí, normalmente está bien usar un spanarchivo h1. spanes un elemento en línea, por lo que generalmente está bien usarlo dentro de cualquier cosa (¡que permita elementos dentro de él!)

Y realmente no hay una forma más limpia de hacerlo a veces, digamos si solo desea diseñar una parte del h1.

Por otro lado ... no lo hagas si no es necesario, ya que es un poco feo :)

— Dave
fuente

2

Sí, está bien, pero ¿por qué no?

   <h1 class="boardit">
      Portfolio
   </h1>

¿Si eso es todo lo que estás haciendo?

— Simón Sarris
fuente

1

No es todo. La solicitud es para diseñar solo una parte del encabezado.

— Daniel Springer

1

Sí tu puedes. El tramo se muestra en línea, por lo que no debería afectar el estilo del H1.

— geetfun
fuente

0

Sí, podemos usar la etiqueta span con etiquetas de encabezado y no tiene nada de malo. De hecho, esto se usa ampliamente para diseñar etiquetas de encabezado, especialmente para colorear una palabra o letra en particular.

— Touhid Rahman
fuente

0

Sí, podemos usar la etiqueta span con etiquetas de encabezado y no tiene nada de malo. De hecho, esto se usa ampliamente para diseñar etiquetas de encabezado, especialmente para colorear una palabra o letra en particular.

— Touhid Rahman
fuente

-2

<h1 style="display:inline;">Bold text goes here</h1> 
<span style="display:inline;">normal text goes here</span>

Piense en las líneas anteriores - Funcionó para mí - use display: inline prop

— takrishna
fuente

¿Qué tiene esto que ver con la pregunta?

— Quentin

3

@Quentin Creo que se refería a sugerir que el encabezado sea un elemento en línea. Una buena idea, si es factible.

— Daniel Springer

2

Esta respuesta no debe ser rechazada ya que resuelve el problema, aunque no es lo que se pregunta directamente. +1 para la solución.

— Achala Dissanayake