Can I use the maximum width of the device and the width of the device without the pixel ratio of the device?

Question

I have a mobile site that is being tested on any modern device. My view tag metafile:

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">

Question: Can I relay the value of the viewport (especially in width=device-width) and record media queries without values device-pixel-ratio.

Code example: I have a block that has a different layout, and the screen width is less 400px. Is it possible to use with such a viewport media queryas follows (1):

@media all and (max-width: 399px) {
    /* some css code */
}

Or like this (2):

@media all and (max-device-width: 399px) {
    /* some css code */
}

Or should I combine 1 or 2 with most of the values device-pixel-ratio(3) for each multimedia request:

only screen and (-webkit-min-device-pixel-ratio: 2)      and (max-width: 399px),
only screen and (   min--moz-device-pixel-ratio: 2)      and (max-width: 399px),
only screen and (     -o-min-device-pixel-ratio: 2/1)    and (max-width: 399px),
only screen and (        min-device-pixel-ratio: 2)      and (max-width: 399px),
only screen and (                min-resolution: 192dpi) and (max-width: 399px),
only screen and (                min-resolution: 2dppx)  and (max-width: 399px) { 
  /*some css code*/
}

: , width=device-width css . ?

Answer 1

:

• max-width max-device-width. .
• : . width=device-width (CSS-).
• : - , , , , .

:

CSS , , .

- , . CSS, . , iPhone , 320. ( 320 CSS.) 320 320 , device-pixel-ratio ( ) 1.

iPhone , 320 , device-pixel-ratio 2 640 . - .

, , . CSS 320 . , , -. .

. , 1000 , , 1000 320 . , , , 1000 , 1000px, 320px.

width=device-width initial-scale=1 , , 320, , .

minimum-scale=1, maximum-scale=1, user-scalable=no . , .

device-pixel-ratio . , . , device-pixel-ratio 1,5 2, .