不同的導航欄樣式時，在移動或桌面

Question

有沒有辦法按照自己的視口更改導航欄？

例如，當你的視口1024×768你會顯示它內置桌面尺寸和更多第一導航欄，但如果你的視口比分辨率較低，顯示「移動友好'導航欄。

Answer 1

您可以使用媒體查詢：

在CSS：

@media (min-width:768px) and (min-height:1024px) { 
/*Desktop css*/ 
} 
@media (max-width:768px) and (max-height:1024px) { 
/*Mobile css*/ 
} 

或在外部樣式表：

<link rel="stylesheet" media="(min-width:768px) and (min-height:1024px)" href="desktop.css"> 
<link rel="stylesheet" media="(max-width:768px) and (max-height:1024px)" href="mobile.css">