del в HTML


в HTML

Тег используется для выделения текста, который был удален в новой версии документа. Подобное форматирование позволяет отследить, какие изменения в тексте документа были сделаны. Браузеры обычно помечают текст в контейнере как перечеркнутый.

Синтаксис

Закрывающий тег

Атрибуты

Для этого тега также доступны универсальные атрибуты и события.

Пример. Использование тега

Спецификация ?

Спецификация Статус
WHATWG HTML Living Standard Живой стандарт
HTML5 Возможная рекомендация
HTML 4.01 Specification Рекомендация

Спецификация

Каждая спецификация проходит несколько стадий одобрения.

  • Recommendation ( Рекомендация ) — спецификация одобрена W3C и рекомендована как стандарт.
  • Cand >Возможная рекомендация ) — группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.
  • Proposed Recommendation ( Предлагаемая рекомендация ) — на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
  • Working Draft ( Рабочий проект ) — более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
  • Editor’s draft ( Редакторский черновик ) — черновая версия стандарта после внесения правок редакторами проекта.
  • Draft ( Черновик спецификации ) — первая черновая версия стандарта.

Особняком стоит живой стандарт HTML ( Living ) — он не придерживается традиционной нумерации версий, поскольку находится в постоянной разработке и обновляется регулярно.

Браузеры: Настольные Мобильные ?

Internet Explorer Chrome Opera Safari Firefox
4 1 3.5 1 1
Android Firefox Mobile Opera Mobile Safari Mobile
1 1 6 1

Браузеры

В таблице браузеров применяются следующие обозначения.

  • — элемент полностью поддерживается браузером;
  • — элемент браузером не воспринимается и игнорируется;
  • — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.

Число указывает версию браузреа, начиная с которой элемент поддерживается.

в HTML

Тег применяется для выделения части документа, которая была удалена в текущей версии. Часто этот тег используется в паре с тегом , который наоборот добавляет новую часть документа.

Эти два тега являются немного необычными для HTML, так как могут принимать вид блочного или встроенного элемента, в зависимости от места использования. Если они расположены внутри элемента, который может иметь только встроенные теги, то они тоже считаются inline-тегами. В противном случае они считаются блочными.

Обычно браузеры выделяют текст внутри этих элементов следующим образом: — перечеркнутый, — подчеркнутый.

Атрибуты

Личные атрибуты: нет.

  • accesskey — устанавливает клавишу быстрого доступа для фокусировки на HTML-элементе.
  • class — задает имя класса или классов тега, используемых в CSS (Каскадные таблицы стилей).
  • dir — указывает направление текста внутри элемента.
  • id — задает имя идентификатора HTML-тега, который может использоваться в качестве «якоря» или в таблицах стилей.
  • lang — указывает язык, на котором написан текст внутри HTML-элемента.
  • style — необходим для применения встроенных стилей CSS к тегу.
  • tabindex — устанавливает порядок табуляции между элементами (клавиша Tab ).
  • title — выводит всплывающую подсказку при наведении курсора мыши на HTML-элемент.

Тип тега

Модель тега: block (блочный, уровня блока), если содержит теги уровня блока. Inline (встроенный, уровня строки), если содержит теги уровня строки (встроенные). Может располагаться только внутри блочных или встроенных элементов.

Может содержать: block-теги или inline-теги, обычный текст и спецсимволы HTML (мнемоники), но не оба варианта одновременно.

Открывающий тег: необходим. Закрывающий тег: необходим.

HTML тег del

Тег определяет текст, который был удален в новой версии документа.

Для определения текста, добавленного в новую версию документа, можно использовать тег .

Теги и используются для обозначения изменений в тексте документа. Обычно браузеры обозначают удаленный текст перечеркиванием, а новый добавленный текст подчеркиванием.

Атрибут Описание
cite Определяет URL документа, объясняющего причину удаления
datetime Определяет дату и время удаления текста

Общие атрибуты

HTML пример

Текст с удаленной и новой вставленной частями:

CSS стили по умолчанию

Большинство браузеров будут отображать тег со следующими стилями

: The Deleted Text element

На этой странице

Элемент HTML представляет диапазон текста, который был удален из документа. Он может быть использован, например, при отображении «отслеживания изменений» или различий в исходном коде. Элемент представляет собой диапазон текста, который был добавлен в документ»> можно использовать для противоположной цели: указание текста, который был добавлен в документ.

The source for this interactive example is stored in a GitHub repository. If you’d like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

Этот элемент часто (но не обязательно) отображается с помощью применения зачеркнутого стиля к тексту.

Категории контента Фразовый контент или потоковый контент.
Разрешенный контент Прозрачный.
Пропуск тега Нет, открывающий и закрывающий теги обязательны.
Допустимые родители Любой элемент, который принимает фразовый контент.
Допустимые ARIA роли Любые
DOM интерфейс HTMLModElement


Атрибуты

Атрибуты этого элемента включают глобальные атрибуты.

cite URI для ресурса, который объясняет изменение (fнапример, протоколы соединений). datetime Этот атрибут устанавливает время и дату изменение и должен представлять собой строку с допустимой датой и временем (время не является обязательным параметром — параметр опционален). Если значение не может быть проанализировано как дата с опциональм временем, элемент не будет иметь соответствующей временной отметки. Формат строки без времени смотри в Format of a valid date string в Date and time formats used in HTML. Формат строки с датой и временем описан в Format of a valid local date and time string в Date and time formats used in HTML.

Примеры

Результат

This text has been deleted , here is the rest of the paragraph.

This paragraph has been deleted.

Проблемы доступности

Присутствие элемента del не определено в конфигурации по умолчанию большинством технологий чтения с экрана. Его можно задать, используя свойство CSS content , а также ::before и с помощью псевдоэлемента ::after .

Некоторые люди, использующие программы чтения с экрана, сознательно отключают определение контента, что создает дополнительную многословность. Поэтому важно не злоупотреблять этой техникой, применяя ее только в ситуациях, когда незнание контента, который был удален, может негативно повлиять на восприятие.

в HTML

9513 просмотра

5 ответа

2992 Репутация автора

В чем разница между и ? Я прочитал здесь , что существуют семантические различия между и , это относится к и ? Кроме того, как эти семантические различия, если таковые имеются, интерпретируются поисковыми системами и какие они влияют на ранжирование? Существуют ли другие теги, которые влияют на ранжирование поиска?

Ответы (5)

22 плюса

147248 Репутация автора

и оба они все еще существуют в спецификации HTML.

То есть они фактически представляют разные вещи семантически. В частности , будет использоваться, если у вас есть существующий документ и вы хотите указать текст, который был в документе, но был удален. Это будет отличаться от текста в документе, который не является точным, но это не было удалено (вы могли бы использовать для этого).

Вы не должны использовать и не зависеть ни от стиля, даже если у большинства браузеров есть их по умолчанию. Вы должны полагаться только на CSS для презентации.

Из-за меркурийности работы поисковых систем очень сложно сказать, будет ли один тег или другой элемент влиять на то, как создаются ключевые слова и индексируется ваш контент. Вы должны сосредоточиться на создании хорошего контента, который семантически корректен, и ваш рейтинг сайта будет следовать.

4 плюса

148433 Репутация автора

Нет никакой практической разницы между del и s , за исключением того, что имена тегов различны. Они имеют одинаковый рендеринг по умолчанию (overstruck text), и нет никаких доказательств какой-либо разницы в обработке браузерами или поисковыми системами, и нет причин ожидать таких различий, поскольку «семантические» определения являются неопределенными, а авторы не очень-то заботятся о них. Нет никаких доказательств каких-либо действий в поисковых системах по этим элементам — они работают с текстом и обычно игнорируют разметку текстового уровня, за исключением, возможно, некоторых элементов, которые можно расценивать как придающие их содержимому более высокий относительный вес на странице.

По умолчанию или «ожидаемый» рендеринг по умолчанию явно указан в разделе Rendering HTML5 CR: del, s, strike

Теоретическая разница заключается в том, что спецификации HTML и черновики говорят об их «значении», которое варьируется от одной версии HTML к другой.

Таким образом, вы можете использовать любой элемент или ни один из них. Превышение текста — не такая хорошая идея, так как он легко затрудняет чтение некоторых букв. Но если вам нужно переборщить (например, потому, что объявление должно содержать слишком высокую цену), это, пожалуй, безопаснее использовать strike , что является честным элементом презентации. Таким образом, вы избегаете даже теоретической возможности того, что какое-то программное обеспечение может интерпретироваться s или del каким-то особым образом, основываясь на чье-либо чтении HTML5 CR, возможно, возможно, отличающемся от ваших намерений, и, таким образом, может привести к некоторому рендерингу или обработке, что не соответствует вашей причине перечеканки. (Исторически s и strike были синонимами, но HTML5 CR делает произвольное различие между ними, делая s «семантические» и strike презентационный.)

плюса

51 Репутация автора

Я бы использовал их так, как они семантически определены: DEL для текста, который был удален, и S для текста, который теперь неточен, но не был удален.

Они могут в основном выглядеть одинаково, но могут обрабатываться по-разному с помощью экранных ридеров и других инструментов доступности. DEL может быть полностью проигнорирован (например: не считывается), а S может быть прочитан, но отличается от обычного текста.

2 плюса

3939 Репутация автора

После прочтения существующего ответа я оставил все еще смущенным, какой из них использовать в моем приложении. Мы согласны с тем, что в настоящее время они одинаковы, и разница в основном сводится к семантике. Документы MDN от Mozilla помогли мне прояснить семантику.

Я думаю, что это правильно для большинства случаев использования , и вот почему наряду с четырьмя соответствующими вариантами:

Понятно, что это устарело и, следовательно, неправильно использовать.

HTML Strikethrough Element ( ) создает текст с зачеркиванием или строкой. Используйте этот элемент для представления вещей, которые больше не актуальны или более не точны. Однако это не подходит при указании редактирования документа; для этого используйте « и» элементы, если это необходимо. **

HTML Deleted Text Element ( ) представляет собой диапазон текста, который был удален из документа. Этот элемент часто (но не обязательно) визуализируется с помощью сквозного текста.

Самый большой ключ для меня на этой странице состоит в том , что , например , предлагает два дополнительных (необязательных) атрибута: cite и datetime это имеет смысл в отношении изменения контекста документа. В качестве контрпримера, если бы я обновлял меню ресторана, ссылка на источник для продаваемого меню не кажется актуальным.

Нет тегов / использование CSS

Если ни один из приведенных выше вариантов не подходит для вашего случая использования, помните, что вы все равно можете определить собственный класс.

в HTML

The del element is used to mark up text that has been deleted from a document. It is useful if you want the original text to remain to provide a record of changes to the document over time.

There are two attributes that can be used to provide additional information about the reason a change was made to a document.

  • cite can be used to add a URL that further explains the reason for the change.
  • datetime can be used to specify the time when the change was made.

Правая Скобка ]

Энциклопедия веб разработчика. Все что интересно HTML, CSS, PHP, MySQL и не только !

HTML тег del


Описание
Тег HTML используется для разметки удаленного текста.

Результат будет следующий —

Конкретные атрибуты
HTML тег также поддерживает следующие дополнительные атрибуты −

Атрибут Значение Описание
cite URL Определяет URL-адрес другого документа, который объясняет, почему был удален текст.
datetime ГГГГММДД
HH: MM: SS
Определяет дату и время удаления текста.

Глобальный атрибут
Этот тег поддерживает глобальные атрибуты, описанные в HTML с атрибутом ссылка
Атрибуты событий
Этот тег поддерживает все атрибуты событий, описанных в события HTML ссылка

Тег del

Тег (англ. delete — удалить) — тег-контейнер, обозначает текст, как удаленный.
Может выступать как строчный или как блочный элемент в зависимости от контекста.

HTML: 3.2 | 4 / XHTML: 1.0 | 1.1

Синтаксис

Атрибуты

cite URL источника, поясняющего причину удаления информации
class определяет имя используемого класса
datetime дата и время изменения документа
dir определяет направление символов:
  • ltr — слева направо
  • rtl — справа налево
id уникальный идентификатор
lang определяет язык отображаемого документа
onclick щелчок на элементе
ondblclick двойной щелчок на элементе
onkeydown нажатие клавиши, когда элемент имеет фокус
onkeypress нажатие и освобождении клавиши, когда элемент имеет фокус
onkeyup освобождение ранее нажатой клавиши, когда элемент имеет фокус
onmousedown нажатие кнопки мыши, когда элемент имеет фокус
onmousemove движение указателя мыши, когда элемент имеет фокус
onmouseout смещение указателя мыши с элемента
onmouseover помещение указателя мыши на элемент
onmouseup освобождение ранее нажатой кнопки мыши, когда элемент имеет фокус
style задает встроенную таблицу стилей
title всплывающая подсказка

Пример

Рекомендации по использованию

  • закрывающий тег обязателен ( )
  • может содержать CDATA, строчные и блочные элементы
  • обязательных атрибутов нет
  • многие браузеры по умолчанию отображают содержимое тега перечеркнутым
  • не используйте тег просто для зачеркивания. Для этого воспользуйтесь таблицами стилей

Теги и используются для маркировки разделов документа, которые были вставлены или удалены для сравнения с другими версиями документа.

в HTML

9513 просмотра

5 ответа

2992 Репутация автора

В чем разница между и ? Я прочитал здесь , что существуют семантические различия между и , это относится к и ? Кроме того, как эти семантические различия, если таковые имеются, интерпретируются поисковыми системами и какие они влияют на ранжирование? Существуют ли другие теги, которые влияют на ранжирование поиска?

Ответы (5)

22 плюса

147248 Репутация автора

и оба они все еще существуют в спецификации HTML.

То есть они фактически представляют разные вещи семантически. В частности , будет использоваться, если у вас есть существующий документ и вы хотите указать текст, который был в документе, но был удален. Это будет отличаться от текста в документе, который не является точным, но это не было удалено (вы могли бы использовать для этого).

Вы не должны использовать и не зависеть ни от стиля, даже если у большинства браузеров есть их по умолчанию. Вы должны полагаться только на CSS для презентации.

Из-за меркурийности работы поисковых систем очень сложно сказать, будет ли один тег или другой элемент влиять на то, как создаются ключевые слова и индексируется ваш контент. Вы должны сосредоточиться на создании хорошего контента, который семантически корректен, и ваш рейтинг сайта будет следовать.

4 плюса

148433 Репутация автора

Нет никакой практической разницы между del и s , за исключением того, что имена тегов различны. Они имеют одинаковый рендеринг по умолчанию (overstruck text), и нет никаких доказательств какой-либо разницы в обработке браузерами или поисковыми системами, и нет причин ожидать таких различий, поскольку «семантические» определения являются неопределенными, а авторы не очень-то заботятся о них. Нет никаких доказательств каких-либо действий в поисковых системах по этим элементам — они работают с текстом и обычно игнорируют разметку текстового уровня, за исключением, возможно, некоторых элементов, которые можно расценивать как придающие их содержимому более высокий относительный вес на странице.

По умолчанию или «ожидаемый» рендеринг по умолчанию явно указан в разделе Rendering HTML5 CR: del, s, strike

Теоретическая разница заключается в том, что спецификации HTML и черновики говорят об их «значении», которое варьируется от одной версии HTML к другой.

Таким образом, вы можете использовать любой элемент или ни один из них. Превышение текста — не такая хорошая идея, так как он легко затрудняет чтение некоторых букв. Но если вам нужно переборщить (например, потому, что объявление должно содержать слишком высокую цену), это, пожалуй, безопаснее использовать strike , что является честным элементом презентации. Таким образом, вы избегаете даже теоретической возможности того, что какое-то программное обеспечение может интерпретироваться s или del каким-то особым образом, основываясь на чье-либо чтении HTML5 CR, возможно, возможно, отличающемся от ваших намерений, и, таким образом, может привести к некоторому рендерингу или обработке, что не соответствует вашей причине перечеканки. (Исторически s и strike были синонимами, но HTML5 CR делает произвольное различие между ними, делая s «семантические» и strike презентационный.)

плюса

51 Репутация автора

Я бы использовал их так, как они семантически определены: DEL для текста, который был удален, и S для текста, который теперь неточен, но не был удален.

Они могут в основном выглядеть одинаково, но могут обрабатываться по-разному с помощью экранных ридеров и других инструментов доступности. DEL может быть полностью проигнорирован (например: не считывается), а S может быть прочитан, но отличается от обычного текста.

2 плюса

3939 Репутация автора

После прочтения существующего ответа я оставил все еще смущенным, какой из них использовать в моем приложении. Мы согласны с тем, что в настоящее время они одинаковы, и разница в основном сводится к семантике. Документы MDN от Mozilla помогли мне прояснить семантику.

Я думаю, что это правильно для большинства случаев использования , и вот почему наряду с четырьмя соответствующими вариантами:

Понятно, что это устарело и, следовательно, неправильно использовать.


HTML Strikethrough Element ( ) создает текст с зачеркиванием или строкой. Используйте этот элемент для представления вещей, которые больше не актуальны или более не точны. Однако это не подходит при указании редактирования документа; для этого используйте « и» элементы, если это необходимо. **

HTML Deleted Text Element ( ) представляет собой диапазон текста, который был удален из документа. Этот элемент часто (но не обязательно) визуализируется с помощью сквозного текста.

Самый большой ключ для меня на этой странице состоит в том , что , например , предлагает два дополнительных (необязательных) атрибута: cite и datetime это имеет смысл в отношении изменения контекста документа. В качестве контрпримера, если бы я обновлял меню ресторана, ссылка на источник для продаваемого меню не кажется актуальным.

Нет тегов / использование CSS

Если ни один из приведенных выше вариантов не подходит для вашего случая использования, помните, что вы все равно можете определить собственный класс.

Блог → Сравнение ins, del и s

Еще со времен древнего HTML2 у нас появилась возможность семантически обозначать добавление и удаление информации, используя элементы и соответственно. Несмотря на кажущуюся простоту, эти элементы имеют глубокий смысл, его мы рассмотрим в статье. Так же я хочу провести сравнение и сопоставление и элемента , который был возвращён обратно в HTML5 из стилей шрифта.

Использование ins и del

Определения этих двух элементов очень просты:

  • Элементы ins и del представляют собой изменения, сделанные в документе.
  • Элемент ins представляет собой дополнение к документу.
  • Элемент del представляет собой удаление из документа

Так о каких изменениях идёт речь? Вы можете использовать эти элементы для:

  • Записи изменений в официальных документах, таких как протоколы собрания или законные акты.
  • Пометки изменений в статье – в дополнение к журналистским корректировкам, что помогает сохранить редакционную целостность и избежать «переписывания материала».
  • Обозначения различий между двумя версиями документа (разница), к примеру, для обозначения редакционных корректировок.
  • Обозначения значительного добавления или удаления контента, о котором необходимо знать людям, читающим документ.

В некоторых случаях изменения должны быть точно обозначены. Однако стоит помнить, что если изменений много, то их обозначение становится непрактичным (или невозможным) – поэтому используйте эти элементы только в тех случаях, когда это действительно необходимо.

Условные границы параграфа

Элементы и необычны тем, что они могут содержать фразаобразующий или потоковый контент (говоря языком HTML 4, они могут быть строчными (inline) или блочными (block-level)). Вот пример вставленного параграфа, содержащего удаление фразаобразующего контента:

See the Pen ImAFl by Andrey Siaglo (@webmolot) on CodePen.

Заметьте, что по умолчанию браузер отображает эти элементы как строчные, и для того, чтобы изменить стиль на блочный, Вам необходимо будет добавить display: block .

Также, нам необходимо убедиться, что каждый элемент или является либо строчным, либо блочным, но никак не то и другое одновременно. Например, нельзя начать в середине одного параграфа, и закончить в середине следующего.

See the Pen beJxG by Andrey Siaglo (@webmolot) on CodePen.

Атрибуты datetime и cite

Элементы и также могут содержать два дополнительных атрибута, datetime и cite. Datetime используйте для регистрации даты (и как вариант — времени) совершённого изменения. В атрибуте cite содержится URL-ссылка на более подробную информацию об изменении.

See the Pen GrAou by Andrey Siaglo (@webmolot) on CodePen.

Как правило, datetime и cite скрытые данные, но их можно сделать видимыми, предварительно украсив через css.

See the Pen suqAK by Andrey Siaglo (@webmolot) on CodePen.

Или даже лучше – можно добавить сноску, например:

See the Pen aFqgx by Andrey Siaglo (@webmolot) on CodePen.

Убедитесь в необходимости использования del при удалении контента. Возможно вам необходимо просто закомментировать контент посредством или удалить его из HTML источника.

Элемент s

В спецификации s описывается следующим образом:

Элемент представляет собой контент, который либо больше не является точным, либо больше не является актуальным.

Изначально, элементы s и его предшественник strike являлись элементами стиля шрифта. Они практически перестали использоваться в HTML 4 и совсем не используются в HTML 5. Однако, некоторые случаи семантического использования получили шанс на вторую жизнь. Например, для отметки первоначальной цены какого-либо товара на распродаже, а также обозначения окончания периода времени. К примеру, при продаже первой партии билетов на какое-либо мероприятие. Данный контент является источником полезной информации, поэтому удалять её мы не хотим. Однако мы хотим подчеркнуть, что данная информация более не является точной. Ещё один пример использования — это использование устаревшей, но всё ещё значимой информации, которая не является результатом редактирования.

Например, если бы элемент s использовался для Кикстартера, это могло бы выглядеть следующим образом:

s против del

Уверен, кто-то обязательно отметит в комментариях, что элемент s уже наступает на семантические пятки элемента del :)

Однако, существует едва различимая, но существенная разница. Элементы ins и del используются для отображения редакционных изменений и, как правило, это касается уже опубликованных страниц.

Элемент s используется для обозначения информации, которая уже не является точной, либо актуальной, однако, всё ещё является ценной.

Ян Хиксон описывает разницу таким образом:

Иными словами, посредством получается документ, который не содержит текст. А при использовании , не может быть документа без текста, потому что текст всё ещё является частью документа, с той разницей, что он отмечен, как старый.

Оформление ins, del, и s

По умолчанию, стили браузера представляют собой следующее:

  • : text-decoration: underline ( пример )
  • : text-decoration: line-through ( пример )
  • : text-decoration: line-through ( пример )

Используемое по умолчание оформление ins очень похоже на обозначение ссылки. Что ещё хуже, используемые по умолчанию стили del и s — идентичны (несмотря на то, что их редко можно встретить вместе). Для понимания контекста необходимо визуально выделить эти элементы.

Фразаобразующий стиль ins и del

Вот некоторые стили, которые я использую для ins и del:

See the Pen gIkLe by Andrey Siaglo (@webmolot) on CodePen.

See the Pen ypsGc by Andrey Siaglo (@webmolot) on CodePen.

Потоковый стиль ins и del

По умолчанию, элементы и воспринимаются браузерами как строчные, и поэтому стилизуются соответствующим образом. Если Вы хотите использовать блочный стиль CSS, Вам необходимо будет применить display: block . Однако, визуального оформления, как в примере выше, для блочных элементов может быть недостаточно. Для них я использую следующие стили:

See the Pen cwqou by Andrey Siaglo (@webmolot) on CodePen.

Заключение

Итак, подведём итоги: мы рекомендуем Вам использовать и для редактирования существующего документа, однако только в том случае, если обозначение изменений играет важную роль для тех, кто просматривает страницу. Используйте для обозначения информации, которая более не актуальна или не точна, однако, удаление данной информации негативно скажется на смысле. Обязательно уделите внимание стилизации этих элементов во избежание путаницы. Наконец, заметьте, что и могут использоваться для строчного или блочного контента (но не для того и другого одновременно), тогда как может использоваться только для строчного контента.

Я заметил, что авторы часто забывают добавлять дату публикации к своим статьям, причём они потом вынуждены приложить немало усилий, чтобы эти статьи оставались актуальными. Если Вы делаете также, и могут превратиться из редко используемых элементов в элементы, которые будут Вам очень полезны для обозначения изменений. Что касается , то ему суждено оставаться одним из тех неясных, но полезных элементом, который Вам вряд ли когда-либо понадобится, но которому Вы всегда будете рады, если он будет у Вас в нужный момент.

Итак, что Вы думаете? Вы использовали данные элементы? А после прочтения статьи будете использовать? Предлагайте свои способы их стилизации. Оставляйте свои комментарии!

Илон Маск рекомендует:  Iis справочник по включениям на стороне сервера
Понравилась статья? Поделиться с друзьями:
Кодинг, CSS и SQL