DEV Community

Cover image for Media Attribute in HTML
aryan015
aryan015

Posted on

Media Attribute in HTML

#css #tailwindcss #html #wordpress

Syntax

  1. This will include styles.css only if the screen width is 600 pixels or less. 
<link rel="stylesheet" href="styles.css" media="screen and (max-width: 600px)">
Enter fullscreen mode Exit fullscreen mode

Possible Use-case 

<link rel="stylesheet" href="desktop-styles.css" media="screen and (min-width: 1024px)">
<link rel="stylesheet" href="mobile-styles.css" media="screen and (max-width: 600px)">
Enter fullscreen mode Exit fullscreen mode

It will help organize your code little bit.

Top comments (0)

Read next

louisfacun profile image

How to Implement Sticky Navigation in Next.js/React.js with react-intersection-observer

Louis Facun -

darkwiiplayer profile image

How I write CSS selectors

𒎏Wii 🏳️‍⚧️ -

ridoy_hasan profile image

Responsive Design with Tailwind CSS

Ridoy Hasan -

hoainhoblogdev profile image

CSS 2024 Breakthrough: Redefining Animations with animation-timeline: view()

Hoài Nhớ ( Nick ) -