Q

<q>: The Inline Quotation element #

::: section-content The <q> HTML element indicates that the enclosed text is a short inline quotation. Most modern browsers implement this by surrounding the text in quotation marks. This element is intended for short quotations that don't require paragraph breaks; for long quotations use the <blockquote> element. :::

Try it #

::: section-content ::: iframe ::: {.output-header .border-rounded-top}

HTML Demo: <q> #

Reset :::

::: {#warning-no-script .warning-container} ::: warning The interactive example cannot be shown because JavaScript is disabled. ::: :::

::: {#warning-mathml-not-supported .warning-container .hidden} ::: warning The interactive example cannot be shown because MathML is not supported by your browser. ::: :::

::: {#editor-container .editor-container .tabbed-shorter .hidden .border-rounded-bottom editor-type=“tabbed”} ::: {#tab-container .section .tabs} ::: {#tablist .tab-list role=“tablist”} HTML

CSS

JavaScript :::

::: {#html-panel .section .hidden tabindex=“0” role=“tabpanel” aria-labelledby=“html” aria-hidden=“true”} ::: {#html-editor}

When Dave asks HAL to open the pod bay door, HAL answers: I’m sorry, Dave. I’m afraid I can’t do that.

::: :::

::: {#css-panel .section .hidden tabindex=“0” role=“tabpanel” aria-labelledby=“css” aria-hidden=“true”} ::: {#css-editor} q { font-style: italic; } ::: :::

::: {#js-panel .section .hidden tabindex=“0” role=“tabpanel” aria-labelledby=“js” aria-hidden=“true”} ::: {#js-editor} ::: ::: :::

::: {#output .output-container}

Output #

::: :::

::: {.section .console-container .hidden aria-hidden=“true”}

Console Output #

![] clear console

::: {#console .console} ::: :::

::: {#html-output .output .editor-tabbed} %html-content% ::: ::: :::

Attributes #

::: section-content This element includes the global attributes.

cite

The value of this attribute is a URL that designates a source document or message for the information quoted. This attribute is intended to point to information explaining the context or the reference for the quote. :::

Examples #

::: section-content ::: code-example [html]{.language-name}

<p>
  According to Mozilla's website,
  <q cite="https://www.mozilla.org/en-US/about/history/details/">
    Firefox 1.0 was released in 2004 and became a big success.
  </q>
</p>

::: :::

Result #

::: section-content ::: {#sect1 .code-example} ::: iframe ::: ::: :::

Technical summary #

::: section-content

Content categoriesFlow content, phrasing content, palpable content.
Permitted contentPhrasing content.
Tag omissionNone, both the starting and ending tag are mandatory.
Permitted parentsAny element that accepts phrasing content.
Implicit ARIA rolegeneric
Permitted ARIA rolesAny
DOM interfaceHTMLQuoteElement
:::

Specifications #

::: _table #

Specification #

HTML Standard
[# the-q-element]{.small}


:::

Browser compatibility #

::: _table Desktop Mobile


    Chrome    Edge   Firefox   Internet Explorer   Opera   Safari   WebView Android   Chrome Android   Firefox for Android   Opera Android   Safari on IOS   Samsung Internet

q 1 12 1 Yes 15 3 4.4 18 4 14 2 1.0 :::

See also #

::: section-content

::: _attribution © 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/q{._attribution-link} :::