Breaking News: Grepper is joining You.com. Read the official announcement!

@media css

Add Answer

haya huang answered on October 30, 2020 Popularity 10/10 Helpfulness 2/10

answer @media css

related css media screen

related @media

related media screen-html-css

related @media

@media css

Comment

.img-retina {
  background-image: url("img/example-img.jpg");
  background-size: 320px 320px;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),
       only screen and (   min--moz-device-pixel-ratio: 2),
       only screen and (     -o-min-device-pixel-ratio: 2/1),
       only screen and (        min-device-pixel-ratio: 2),
       only screen and (                min-resolution: 192dpi),
       only screen and (                min-resolution: 2dppx) {
    background-image: url("img/example-img@2x.jpg");
    background-size: 320px 320px;
}

Popularity 10/10 Helpfulness 2/10 Language css

Source: kia-king.com

Tags: css

Link to this answer
Share Copy Link

Contributed on Jul 05 2022

haya huang

0 Answers Avg Quality 2/10

Closely Related Answers

css media screen

Comment

/*display mobile when the browser window is 991px width or less*/
@media only screen and (max-width: 991px){
  	// example
    .mobile{
        display: block;
    }
}

Popularity 10/10 Helpfulness 10/10 Language css

Source: Grepper

Tags: css

Link to this answer
Share Copy Link

Contributed on Oct 30 2020

Apollo

0 Answers Avg Quality 2/10

@media

Comment

/* Extra small device (phones, 600px and down) */
@media screen and (max-width: 600px){
  
}
/* Small device (portrait tablets and large phones, 600px and up) */
@media screen and (min-width: 600px){
   
}
/* Media devices (landscape tablets, 768px and up) */
@media screen and (min-width: 768px){
   
}
/* Large devices (laptops/desktop, 992px and up) */
@media screen and (min-width: 992px){
   
}
/* Extra large devices (large laptops and desktop, 1200px and up */
@media screen and (min-width: 1200px){
  
}

Popularity 10/10 Helpfulness 7/10 Language javascript

Source: Grepper

Tags: css

Link to this answer
Share Copy Link

Contributed on Mar 26 2023

Cloudy Crocodile

0 Answers Avg Quality 2/10

media screen-html-css

Comment

Dimensions
X-Small	None	                    <576px
Small	            sm	            ≥576px
Medium	            md	            ≥768px
Large	            lg	            ≥992px
Extra large	        xl	            ≥1200px
Extra extra large	xxl	            ≥1400px */

Popularity 10/10 Helpfulness 2/10 Language css

Source: Grepper

Tags: css

Link to this answer
Share Copy Link

Contributed on Nov 04 2023

emre

0 Answers Avg Quality 2/10

@media

Comment

/* xs - устройства (до 576px) */
/* CSS для ширины, которая меньше 575px (включительно) */

/* sm-устройства (больше или равно 576px) */
@media (min-width: 576px) {
  /* CSS для: 576px <= ширины <= 767px */
}

/* md-устройства (больше или равно 768px) */
@media (min-width: 768px) {
  /* CSS для: 768px <= ширины <= 991px */
}

/* lg-устройства (больше или равно 992px) */
@media (min-width: 992px) {
  /* CSS для: 992px <= ширины <= 1119px */
}

/* xl-устройства (больше или равно 1200px) */
@media (min-width: 1200px) {
  /* CSS для: ширины >= 1200px */
}

Popularity 7/10 Helpfulness 2/10 Language css

Source: itchief.ru

Tags: css

Link to this answer
Share Copy Link

Contributed on Apr 02 2024

Frank Kapervud

0 Answers Avg Quality 2/10

@media css

Contents

More Related Answers

@media css

Closely Related Answers

css media screen

@media

media screen-html-css

@media

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.