Open In App

CSS cue-before Property

Last Updated : 31 Mar, 2022
Improve
Improve
Like Article
Like
Save
Share
Report

The CSS cue-before property is used to define an auditory icon played before the element to distinguish and set the element.

Syntax:

cue-before: url|none;

Parameters: This property accepts two values as mentioned above and described below:

  • url: This parameter holds an auditory icon resource. If a user is not able to render the mentioned auditory icon then it will produce an alternative cue, such as a bell sound.
  • none: This parameter defines that no auditory icon is used.

Example 1:

HTML




<!DOCTYPE html> 
<html
  
<head
    <style
        .gfg { 
            cue-before: none; 
        
    </style
</head
  
<body style="text-align: center;"
    <h1 style="color: green;">GeeksforGeeks</h1
    <p class="gfg">CSS cue-before Property</p>
   
  
    <audio controls> 
        <source src
        type="audio/mp3"
    </audio
</body
  
</html


Output:

Example 2:

HTML




<!DOCTYPE html> 
<html
  
<head
    <style
        .gfg { 
            cue-before: url("bell.wav");  
        
    </style
</head
  
<body style="text-align: center;"
    <h1 style="color: green;">GeeksforGeeks</h1
    <p class="gfg">CSS cue-before Property</p>
   
  
    <audio controls> 
        <source src
        type="audio/mp3"
    </audio
</body
  
</html


Output  

Supported Browsers: This property is deprecated in CSS3 so the major browsers are not supported by this property.



Like Article
Suggest improvement
Share your thoughts in the comments

Similar Reads