2011-06-17 7 views
12

¿Cuál es la forma correcta de mostrar una blockquote de HTML5?Corregir HTML Blockquote

Tengo el siguiente:

<blockquote> 
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> 
    <cite>John Doe<br/>ACME Industries</cite> 
</blockquote> 

Pero no estoy seguro de si es correcto para colocar la citan DENTRO de la blockquote y querría estilo que appropiately pero si lo muevo fuera de la cita lo haría necesita envolverlo con un div para darle propiedades de estilo únicas. ¿Pensamientos? Gracias

También según: http://dev.w3.org/html5/spec/Overview.html#the-cite-element Debo utilizar <b> etiquetas para los nombres?

¿Sería correcto?

<div class="testimonial"> 
    <blockquote> 
     <p>The team worked closely with us to define our requirements, delivering the project over agreed phases to time and on budget</p> 
    </blockquote> 
    <p><b>John Doe</b><br />ACME Industries</p> 
</div> 
+0

Puede colocar cite dentro de la etiqueta blockquote como un atributo. Solo agréguela a la etiqueta blockquote (cite = "whatever.com"). – iamandrus

+0

Aquí hay URLs para hacer una copia de seguridad del comentario de Itamake sobre citar como un atributo http://www.w3.org/TR/html-markup/blockquote.html http://www.w3schools.com/html5/tag_blockquote.asp Pero tú no No tiene una URL para citar ... – mrk

+0

Debe leer http://wiki.whatwg.org/wiki/Cite_element – Knu

Respuesta

21

Basado en recent changes in the HTML specifications, esta es ahora la forma correcta de manejar blockquotes con cita.

<blockquote> 
    <p>Measuring programming progress by lines of code is like measuring aircraft building progress by weight.</p> 
    <footer> 
     — <cite><a href="http://www.thegatesnotes.com">Bill Gates</a></cite> 
    </footer> 
</blockquote> 
+1

esta debería ser la respuesta –

+1

Podría se malinterpreta pero la especificación parece decir que la cita debe estar dentro de un pie de página * o * elemento de cita en lugar de un elemento de cita dentro de un elemento de pie de página. –

+1

@MrFett el [espec] (http://www.w3.org/html/wg/drafts/html/master/grouping-content.html#the-blockquote-element) es en realidad un poco ambivalente sobre 'footer' plus 'cite', pero más abajo tienen un ejemplo exactamente igual al de esta respuesta. – mb21

0

Semánticamente el siguiente sentido, utilizar el atributo citar el interior del elemento blockquote citar una URL concreta, y el elemento (en línea) citan antes de la etiqueta blockquote terminando de este modo:

<div> 
<blockquote cite="http://example.com"> 
<p>The quick brown fox jumps over the lazy dog</p> 
<cite>Illustrative Shorthand</cite> by Linda Bronson (1888) 
</blockquote> 
</div> 

El zorro marrón rápido salta sobre el perro perezoso.

ilustrativo taquigrafía por Linda Bronson

Recuerde, blockquote es para citas largas, por lo que aunque lo anterior es técnicamente correcto, mejor sería:

<div> 
<q>The quick brown fox jumps over the lazy dog</q> 
<cite>Illustrative Shorthand</cite> by Linda Bronson (1888) 
</div> 

"El rápido zorro marrón salta sobre el perro perezoso " Taquigrafía ilustrativa de Linga Bronson

Si desea enfatizar el nombre del autor, puede usar b. Tenga en cuenta que la cita se utiliza para el nombre del libro, en este caso, Taquigrafía ilustrativa.

+1

¿Pero por qué la cita estaría dentro de la 'blockquote'? ya que la cita no es el texto citado ... – Cameron

4

Creo que su segunda forma es mejor que la primera. No creo que la atribución de la cita deba estar dentro del <blockquote>.

El uso de la etiqueta <b> depende de usted, probablemente sea técnicamente correcto según la especificación, pero es semánticamente inútil para todos los propósitos prácticos.

Por otro lado, el <br/> se ve mal, parece difícil justificar que se requiera un salto de línea semántica. Si desea mostrar el nombre y la organización en líneas separadas, entonces eso es de presentación y debe hacerse con CSS.

En caso de no utilizar el elemento <cite>, no sería correcto según las especificaciones de HTML5, pero ver http://24ways.org/2009/incite-a-riot por Jeremy Keith para un punto de vista alternativo.

es muy subjetiva, pero podría estar tentado a hacer algo como

<figure class="testimonial"> 
    <blockquote> 
     <p>The team worked closely with us to define our requirements, delivering the project over agreed phases to time and on budget</p> 
    </blockquote> 
    <figcaption class="attribution"> 
     <span class="name">John Doe</span> <span class="organisation">ACME Industries</span> 
    </figcaption> 
</figure> 
+0

¿Has consultado la respuesta de dallen a continuación? http://stackoverflow.com/a/19862672/29182 – Ziggy

+0

@Ziggy - Gracias, sí. Incluso he [estado discutiendo] (http://html5doctor.com/cite-and-blockquote-reloaded/?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+HTML5DoctorComments+%28Comments+for+HTML5+Doctor%29#comment -38766) con el editor de especificaciones. – Alohci

-1

Reconocimiento de la cita, en su caso, debe ser colocado fuera del elemento blockquote.

- Grupo de Trabajo de HTML del W3C

El W3C ofrece un montón de ejemplos de diferentes formas de atribuir las citas en bloque en this draft. También puede leer this blog article, que leo antes de venir aquí. El siguiente ejemplo se basa en su recomendación:

<blockquote> 
<p>Attribution for the quotation, if any, must be placed outside the blockquote element.</p> 
</blockquote> 
<p>— W3C HTML Working Group</p> 

Ellos van a dar un ejemplo usando <figure> y <figcaption> exactamente de la manera @Alohci lo utiliza above.

+1

Esto ya no es el caso. http://html5doctor.com/cite-and-blockquote-reloaded/ – dallen

+1

Mi respuesta está desactualizada, vea la respuesta de dallen http://stackoverflow.com/a/19862672/29182 – Ziggy

Cuestiones relacionadas