How to add underline to canvas-type text using Fabric.js ?

How to Underline Text using CSS?

Last Updated : 14 Nov, 2024

To underline a text using CSS, the CSS text-decoration property is used with the value set to underline.

Using text-decoration

We use the text-decoration CSS property to underline a text using CSS. The text that is to be underlined is inserted in a <p> tag and the property is applied.

Syntax

text-decoration: underline;

HTML

<h1>Underlining Text using text-decoration property</h1>

<p>
  	GeeksforGeeks shows the
	<b style="text-decoration: underline;">
    	Underlined part
    </b>using CSS
</p>

Output

underlined-text

Example: Another example display underline text with text-decoration property.

HTML

<h1>Underlining Text using text-decoration property</h1>

<p style="text-decoration: underline;">
	This content is underlined using Text Decoration property
</p>

Output

underlined-text

How to add underline to canvas-type text using Fabric.js ?

yuvrajghule281

Improve

Article Tags :

Similar Reads

How to create Underline Input Text Field using CSS ?

Input Text Field can be underlined by implementing different approaches to applying a bottom border to an input text field, using various methods such as HTML and CSS. Styling input text fields is a crucial aspect of web development, and adding a bottom border is a common way to enhance the visual a

How to remove underline from a:before using CSS ?

The a:before is used to create an element before the content of the anchor tag and it displays underlined a:before part by default. To remove the underline from a:before using the text-decoration property of CSS and set element display to inline-block. Syntax: text-decoration:none; display:inline-bl

How to remove underline for anchors tag using CSS?

The anchor tag (<a>) is used to define hyperlinks in HTML, Removing the underline from the anchor (<a>) tags in CSS involves setting the text-decoration property to none. This can be done by targeting the anchor elements with a CSS rule like a { text-decoration: none; }, which removes th

How to underline all words of a text using jQuery?

To underline all words of a text using jQuery, you can wrap each word in a <span> tag and apply the CSS text-decoration property. This approach allows for individual styling of each word within a text element. ApproachCreate a basic structure for the web page. The CSS rule p span text-decorati

How to add underline to canvas-type text using Fabric.js ?

Enhancing text presentation on web canvases using Fabric.js involves various techniques, such as adding underlines for improved visual clarity and emphasis. These methods enable developers to customize text elements effectively, contributing to enhanced user experience and design flexibility in web

How to use Text as Background using CSS?

Using text as a background in CSS means creating a visual effect where large text is placed behind content, often appearing as a decorative or watermark-like element. This effect can be achieved by positioning, opacity adjustments, and layering techniques with CSS. Here we have some common methods t

How to bold the text using CSS ?

In HTML, we use the <b> and <strong> tags to make content bold. However, when it comes to styling text, CSS provides a more versatile way to achieve boldness through the font-weight property. This property allows you to set various boldness levels for your text to mark something importan

How to Set the Gap Between Text and Underlining using CSS ?

The gap between text and underlining is the space you can create between the text and underline, making it text easier to read and look better. Using text-underline-offset PropertyTo set the gap between text and its underline in CSS, use the text-underline-offset property. This property defines the

How to add shadow to text using CSS ?

The text-shadow property is used to add shadow to the text. The text-shadow property creates text shadows, specifying horizontal/vertical offsets, blur radius, and color for depth and emphasis. Note: We can customize text shadow by changing position, blur, and color for improved appearance and visua

How to underline a text content in HTML ?

Here are two methods to underline text in HTML. 1. Underlining text using <u> TagThe <u> tag is used to underline text content. It wraps the content to be underlined with a horizontal line beneath it. This tag is commonly used for hyperlinks or emphasized text. Syntax <u> Underline