Клавиша / esc

<cite>

Указывает на источник цитаты или названия произведений.

Время чтения: меньше 5 мин

Кратко

Скопировано

Тег <cite> используется для указания источников цитат, названий художественных произведений или объектов искусства.

Как пишется

Скопировано
        
          
          <p>  Из всех произведений Стивена Кинга  мне больше всего нравится цикл <cite>Тёмная башня</cite>.</p>
          <p>
  Из всех произведений Стивена Кинга
  мне больше всего нравится цикл <cite>Тёмная башня</cite>.
</p>

        
        
          
        
      
Открыть демо в новой вкладке

Как понять

Скопировано

<cite> необходимо использовать для:

  • ссылок на источник цитаты;
  • названий книг, статей, поэм и т. д.;
  • названий скульптур, картин, арт-объектов;
  • сносок на другие материалы.

Браузеры по умолчанию задают тексту внутри <cite> курсивное начертание при помощи font-style: italic.

<cite> не стоит использовать для оформления самих цитат, для этого подойдут теги <q> или <blockquote>.

Пример

Скопировано

Случаи, когда <cite> подойдёт идеально:

Название произведения:

        
          
          <p>  — Только что дочитал цикл <cite>Тёмная башня</cite>.  Я впечатлён! Где можно узнать о выходе новых книг?</p>
          <p>
  — Только что дочитал цикл <cite>Тёмная башня</cite>.
  Я впечатлён! Где можно узнать о выходе новых книг?
</p>

        
        
          
        
      

Ссылка на сайт:

        
          
          <p>  — За актуальными новостями можно следить на  <cite>    <a href="https://stephenking.com/upcoming/">сайте Стивена Кинга</a>  </cite>.</p>
          <p>
  — За актуальными новостями можно следить на
  <cite>
    <a href="https://stephenking.com/upcoming/">сайте Стивена Кинга</a>
  </cite>.
</p>

        
        
          
        
      

Название картины:

        
          
          <p>  — Спасибо! Я так впечатлился, что хочу подарить ему  оригинал <cite>Утра в сосновом бору</cite>.  Вы знаете, когда у него день рождения?</p>
          <p>
  — Спасибо! Я так впечатлился, что хочу подарить ему
  оригинал <cite>Утра в сосновом бору</cite>.
  Вы знаете, когда у него день рождения?
</p>

        
        
          
        
      

Источник цитаты:

        
          
          <blockquote>  <p>    Ваша работа заполнит большую часть жизни и единственный способ быть    полностью довольным — делать то, что по-вашему является великим делом.    И единственный способ делать великие дела — любить то, что вы делаете.  </p></blockquote><p>— Стив Джобс, <cite>Речь в Стенфорде</cite></p>
          <blockquote>
  <p>
    Ваша работа заполнит большую часть жизни и единственный способ быть
    полностью довольным — делать то, что по-вашему является великим делом.
    И единственный способ делать великие дела — любить то, что вы делаете.
  </p>
</blockquote>
<p>— Стив Джобс, <cite>Речь в Стенфорде</cite></p>

        
        
          
        
      

Указание раздела на сайте:

        
          
          <p>  — Вы можете найти ответ на том же сайте в разделе <cite>FAQ</cite>.</p>
          <p>
  — Вы можете найти ответ на том же сайте в разделе <cite>FAQ</cite>.
</p>

        
        
          
        
      
Открыть демо в новой вкладке

Случаи, в которых <cite> будет не лучшим выбором.

Автор не должен указываться как источник, нужно приводить ссылку на конкретный материал:

        
          
          <p>  <!-- Так не нужно  делать! -->  — Только что дочитал цикл «Тёмная башня»  за авторством <cite>Стивена Кинга</cite>.</p>
          <p>
  <!-- Так не нужно  делать! -->
  — Только что дочитал цикл «Тёмная башня»
  за авторством <cite>Стивена Кинга</cite>.
</p>

        
        
          
        
      

Для цитирования здесь лучше использовать тег <q>.

        
          
          <p>  <!-- Так не нужно  делать! -->  — Фраза <cite>Смерть, Стрелок, но не твоя</cite>  навсегда засела у меня в памяти.</p>
          <p>
  <!-- Так не нужно  делать! -->
  — Фраза <cite>Смерть, Стрелок, но не твоя</cite>
  навсегда засела у меня в памяти.
</p>

        
        
          
        
      
Открыть демо в новой вкладке