在開發網站或者應用程序的時候,我們通常需要判斷設備的類型,以便針對不同設備進行不同的展示或者操作。這里介紹兩種方法來判斷設備類型。
一、使用JavaScript判斷設備類型
function isMobile() { if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) { return true; } else { return false; } }
上面的代碼中使用了正則表達式來判斷設備類型,如果是其中的任一一種,就返回true;否則返回false。使用方法如下:
if (isMobile()) { //移動設備展示代碼 } else { //PC端展示代碼 }
二、使用CSS媒體查詢判斷設備類型
@media screen and (max-width: 480px) { //移動設備樣式 } @media screen and (min-width: 481px) { //PC端樣式 }
上面的代碼使用@media來判斷設備類型,如果屏幕寬度小于等于480px,就應用第一個樣式;如果屏幕寬度大于480px,就應用第二個樣式。
總之,以上兩種方法可以根據實際情況自選,分別使用JavaScript和CSS來判斷設備類型并展示不同的樣式。
上一篇刪除線css做表格
下一篇判斷css是否有某個樣式