Как достоверно отличить на стороне клиента с мобильника смотрят сайт или с десктопа?

Question

[Роман]

Хочу размер шрифта прописать в CSS в зависимости от того, смотрят ли с мобильника, или с ноутбука.

На разрешение экрана ориентироваться - это такое себе, в данном случае.

А что еще можно сделать на стороне клиента? (бэк пока что вообще не предполагается)

Можно ли как-то средствами чистого CSS все это разрулить, без помощи JS?

Спасибо.

Comments

[Rustam Bainazarov]

Не очень хорошая практика. Все пользуются размером viewport и меняются стили в соответствии с ним. И всем всё обычно нравится.

К вопросу: 100% методов нет. И тем паче через CSS. CSS может получить только размер viewport, разрешение экрана устройства и плотность DPI.

[Сергей delphinpro]

Я бы сказал — это хреновая практика. В современном мире не нужно ориентироваться на устройство, нужно ориентироваться на вьюпорт. Сайт/приложение должно по дефолту адекватно отображаться везде.

[Роман]

Рустам Байназаров, ок, спасибо!

[alex-1917]

Роман, пжлста

[сергей кузьмин]

User-Agent хедер https://developers.whatismybrowser.com/

Answer 1

[xmoonlight]

https://vanseodesign.com/css/media-queries/

Answer 2

[Николай Шкрылев]

Попробуйте что-то типа этого hgoebl.github.io/mobile-detect.js

Answer 3

[Антон]

А user агент, который определяет Андроид/Айфон не подходит?
www.useragentstring.com/pages/useragentstring.php

<?php
$iPod    = stripos($_SERVER['HTTP_USER_AGENT'],"iPod");
$iPhone  = stripos($_SERVER['HTTP_USER_AGENT'],"iPhone");
$iPad    = stripos($_SERVER['HTTP_USER_AGENT'],"iPad");
$Android = stripos($_SERVER['HTTP_USER_AGENT'],"Android");
if( $iPod || $iPhone || $iPad ){
    echo "ios";
}else if($Android){
    echo "android";
}

Хотя, так себе решение.
Мне по душе медиа-запросы, шрифты в em.