Skip to content
Related Articles

Related Articles

How to define media type of style tag in HTML5 ?

View Discussion
Improve Article
Save Article
Like Article
  • Last Updated : 02 Jun, 2022

In this article, we learn how to define the media type of the style tag in HTML5. 

Approach: The task can be simply done by using the media attribute of the <style> element. It is used to specify the style for specific devices like print media or speech. This attribute can accept several values. 


<style media="value">

HTML Code: Below code illustrates the media attribute to define the media type of the style tag in HTML5. The below code specifies that styles are for screen and print media devices. 


<!DOCTYPE html>
    <style type="text/css" media="screen">
        .heading {
            color: red;
        h2 {
            color: green;
            font-weight: bold;
    <style type="text/css" media="print">
        .heading {
            color: blue;
        h2 {
            color: green;
            font-weight: bold;
    <h1 class="heading">
        How to define the media type
        of the style tag in HTML5?


  • Screen version output:

Screen version

  • Print version output:

Print version

My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!