Применить другую таблицу стилей в зависимости от используемой операционной системы - PullRequest
0 голосов
/ 26 марта 2020

У моего сайта есть детали, дизайн которых очень чувствителен к тому, как они выглядят до пикселя.

http://sandhals.ca/

На самом деле, мне кажется, что маленькие всплывающие окна от зависания отображаются нормально по ссылке выше, если вы работаете в MacOS. Тем не менее, они не работают на Windows. Вместо этого, если я отрегулирую пиксели так, как они есть:

http://sandhals.ca/index2/index

Кажется, они работают. Вопрос, однако, как я могу записать что-либо в мой HTML или мой CSS, чтобы настроить числа в зависимости от операционной системы? Есть идеи или предложения?

1 Ответ

1 голос
/ 26 марта 2020

Вам понадобится Javascript. Добавьте это в конец вашего шаблона или после загрузки документа. Вы можете стилизовать документ на основе классов тела.

<script> 
    var OSName="Unknown OS"; 
    if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows"; 
    if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS"; 
    if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX"; 
    if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux"; 

    document.body.classList.add( OSName);
</script>
...