javascript - Media Queries: How to target only tablet? -

I am doing some research on media queries and I understand the concept of mobile-first design.

I know, there are a lot of questions about media queries, but none of them targets my specific question.

In addition, I understand the concept of structuring my stylesheets with such media queries:

  / * small devices (tablets, 768 px and above) ) * / @ Media (minimum-width: 768 px) {...} / * Medium Devices (Desktop, 992 px and above) * / @ Media (minimum-width: 992 px) {...} / * Large Device (Large Desktops, 1200 px and above) * @@ Media (Minimum-width: 1200px) {...}  

Though the browser is stylish Regardless of T (width and height), there is really a need for my stylesheet that target only tablets is not secure enough to check browser-width (and not sure Which I am searching for) in 2015 where some tablets have a larger resolution than the old desktop.

Here's a list of things I've tried to overcome:

1. I created a list of "normal" tablet-resolution and just specified detailed media queries. This method failed with 1024px width of tablet (which is similar to older desktop browsers).
2. I read a lot about media queries and found that modern browsers (especially on tablets) sometimes ignore specifications as "media media is only screen" and most of the queries in the media query are.

1.) Is media a safe way to target bullets regardless of your resolution with questions?

2.) Is there a way to use JavaScript / gesture to detect the browser, if a browser is used on a tablet (touchscreen)?

Maybe there is a fixed CSS property or Javascript function which is "trigger" only on tablets (I'm out of ideas)? Thanks for your help.

You can use it:

  @ media only screen And (min-device-width: 768px) {}  

for ref :