HTML <cite> Tag
To define a citation the HTML tag is used. For a piece of creative work, quoted content, books, websites, a research paper, a blog spot, painting, etc. we need references or titles. The HTML <cite> tag thus provides the source of a quote or content. It renders its content in the italic form on the browser. Using CSS, it can be overridden.
Syntax:
<cite>Cited Content</cite>
<cite>Cited Content</cite>
<cite>Cited Content</cite>
Example:
<!DOCTYPE html>
<html>
<head>
<style>
blockquote{
background-color: crimson;
color: white;
padding: 10px;
margin-right: 25px;}
cite{
color: crimson;}
</style>
</head>
<body>
<h1>Motivational Quotes</h1>
<blockquote
cite="https://www.inc.com/jeff-haden/75-inspiring-motivational-quotes-for-being-happier.html">
If you look to others for fulfillment, you will never be fulfilled. If your happiness depends on money, you will never be happy with yourself. Be content with what you have; rejoice in the way things are. When you realize there is nothing lacking, the world belongs to you.
</blockquote>
<cite>-Lao Tzu</cite>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
blockquote{
background-color: crimson;
color: white;
padding: 10px;
margin-right: 25px;}
cite{
color: crimson;}
</style>
</head>
<body>
<h1>Motivational Quotes</h1>
<blockquote
cite="https://www.inc.com/jeff-haden/75-inspiring-motivational-quotes-for-being-happier.html">
If you look to others for fulfillment, you will never be fulfilled. If your happiness depends on money, you will never be happy with yourself. Be content with what you have; rejoice in the way things are. When you realize there is nothing lacking, the world belongs to you.
</blockquote>
<cite>-Lao Tzu</cite>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
blockquote{
background-color: crimson;
color: white;
padding: 10px;
margin-right: 25px;}
cite{
color: crimson;}
</style>
</head>
<body>
<h1>Motivational Quotes</h1>
<blockquote
cite="https://www.inc.com/jeff-haden/75-inspiring-motivational-quotes-for-being-happier.html">
If you look to others for fulfillment, you will never be fulfilled. If your happiness depends on money, you will never be happy with yourself. Be content with what you have; rejoice in the way things are. When you realize there is nothing lacking, the world belongs to you.
</blockquote>
<cite>-Lao Tzu</cite>
</body>
</html>
Explanation:
In the above example, we are using the HTML <cite> tag to provide the source of the quote. CSS is also used for styling.
Tag-specific attributes:
There is no specific attribute for the HTML <cite> tag.
Global Attributes:
All the Global attributes are supported by the HTML <cite> tag.
Event Attributes:
All the Event attributes are supported by the HTML <cite> tag.
Supporting Browsers:
Chrome, IE, Firefox, Opera, and Safari.