CODEWITHSUNDEEP
cssmedia-queries
Ashok Shah
Ashok Shah

Reputation: 956

What is the difference if I put media="screen" and not

I have seen lots of websites importing css like 

<link media="screen" rel="stylesheet" href="style.css" />

and some has 

<link rel="stylesheet" href="style.css" />

I really wonder what does it makes the difference if we put media="screen" attribute the link element.

Upvotes: 2

Views: 122

Answers (5)

Madan Bhandari
Madan Bhandari

Reputation: 2184

That stylesheet creates the styles for a printed version of the site, if you wanted a change in look when printed.

Upvotes: 0

Vikas Gourav
Vikas Gourav

Reputation: 11

Media type screen tells that the style.css should load only in case of screens like computer-screens, tablets, smart-phones, etc. The css will not load for print-preview or screen-readers.

Upvotes: 0

Shockwave
Shockwave

Reputation: 412

https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries

Media queries determine when the styles should apply. It depends on what device or medium the user is viewing your content on.

Upvotes: 1

bcr
bcr

Reputation: 3811

It's a media query. This one in particular only uses that style sheet when viewed on a traditional screen (ie not a screen reader). More info on MDN.

Upvotes: 1

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167172

There are multiple reasons:

  1. Most Important, when you print the page, the screen styles appear too.
  2. You can define the styles just for one particular media.
  3. Screen readers can have a different CSS media aural (deprecated) or speech.

Check Using Media Queries for more information.

Upvotes: 3

Related Questions