HTML | controls Attribute
The HTML controls Attribute is used to specify that the audio and video controls must be displayed. It is a Boolean attribute and also new in HTML5. We can use this attribute in two tags <audio> and <video>
The controls attribute includes the following properties on <audio> tag:
- Play
- Pause
- Seeking
- Volume
The controls attribute includes the following properties on <video> tag:
- Play
- Pause
- Seeking
- Volume
- Fullscreen toggle (for video only)
- Captions/Subtitles (for video only, when available)
- Track (for video only, when available)
Syntax:
<element controls>
Below example illustrates the use of controls attribute in <audio> element.
Example:
<!DOCTYPE html>
< html >
< head >
< title >
HTML Audio controls Attribute
</ title >
</ head >
< body style = "text-align: center" >
< h1 style = "color: green" >
GeeksforGeeks
</ h1 >
< h2 style = "font-family: Impact" >
HTML Audio controls Attribute
</ h2 >
< br >
< audio id = "Test_Audio" controls autoplay>
< source src =
type = "audio/ogg" >
< source src =
type = "audio/mpeg" >
</ audio >
</ body >
</ html >
|
Output:
Below example illustrates the use of controls attribute in <video> element.
Example:
<!DOCTYPE html>
< html >
< head >
< title >HTML video controls Attribute</ title >
</ head >
< body >
< center >
< h1 style = "color:green;" >GeeksforGeeks</ h1 >
< h3 >HTML video controls Attribute</ h3 >
< video width = "400" height = "200" controls >
< source src =
type = "video/mp4" >
< source src =
type = "video/ogg" >
</ video >
</ center >
</ body >
</ html >
|
Output:
Supported Browsers: The browser supported by HTML controls Attribute are listed below:
- Google Chrome 4.0
- Internet Explorer 9.0
- Firefox 3.5
- Safari 4.0
- Opera 10.5
Last Updated :
08 Jul, 2019
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...