HTML - <wbr> Tag

Previous
Quiz
Next

Introduction to <wbr> Tag

The HTML <wbr> tag is used to define a position within the text that the browser treats as a line break. This tag is useful when a word is too long and the browser might break it at the wrong place. You can use the <wbr> tag to identify word-break opportunities. This is a new tag included in HTML5

Syntax

Following is the syntax of <wbr> tag −

<wbr>

Attributes

The HTML <wbr> tag supports Global and Event attributes.

Example: Breaking Lengthy Word

Depending on the screen size, we allow breaking within some words if they are not visible on the viewport. This is done using the HTML <wbr> tag.

<!DOCTYPE html>
<html>
<body>
    <h1>tutorialspoint</h1>
    <h2> example of wbr Tag</h2>
    <p>tutorialspointPvtLtdHyderabadEasyToLearn 
       <wbr>acomputerscienceportalforTutorialsAndCourses.
    </p>
</body>
</html>

Example: Breaking Lengthy Breadcrumbs

Sometimes, we need to break breadcrumbs, when they become too lengthy to be visible on a regular viewport. In such cases, we allow them to break into multiple lines.

<!DOCTYPE html>
<html>
<body>
    <h1>tutorialspoint</h1>
    <h2> example of wbr Tag</h2>
    <p> http://this <wbr />.is <wbr />.a 
       <wbr />.really <wbr />.long <wbr />.example 
       <wbr />.com/With <wbr />/deeper <wbr />/level 
       <wbr />/pages <wbr />/deeper <wbr />/level 
       <wbr />/pages <wbr />/deeper <wbr />/level
       <wbr />/pages <wbr />/deeper <wbr />/level
       <wbr />/pages <wbr />/deeper <wbr />/level 
       <wbr />/pages </p>
</body>
</html>

Supported Browsers

Tag Chrome Edge Firefox Safari Opera
wbr Yes 1.0 Yes 12.0 Yes 3.0 Yes 4.0 Yes 11.7
html_tags_reference.htm
Print Page
Previous
Next
Advertisements