最近遇到一個需求，做一個有底部導航的頁面，頁面上的內容要求一屏展示（盡量不要有滾動），同時還要兼容1366768 、1440900、1920*1080這些屏幕，能不能用代碼來實現呢？首先底部的導航欄只要將頂部的導航欄用定位定在頁面的底部就可以了。（導航欄可以再菜鳥聯盟中查到*各種的都有）然后，兼容1366768 、1440900、1920*1080這些屏幕的話一般就是寫媒體查詢用三個節點就可以了媒體查詢的具體代碼為： @media screen and (min-width: 1000px) and (max-width:1367px){/*兼容1366*768*/
.body{ background: #000;
}/*這里是樣式*/
}
@media screen and (min-width: 1367px) and (max-width:1441px){/*兼容1440*900*/
.body{ background: #000;
}/*這里是樣式*/
}
@media screen and (min-width: 1441px) and (max-width:1920px){/*兼容1920*1080*/
.body{ background: #000;
}/*這里是樣式*/
}
2 回答
慕無忌1623718
TA貢獻1744條經驗 獲得超4個贊
首先底部的導航欄將頂部的用相對定位position:fixed;定位在頁面的底部就可以了。導航欄可以到菜鳥聯盟查到*各種的都有
其次是要兼容1366768 、1440900、1920*1080這些屏幕一般使用媒體查詢
具體代碼如下：
@media screen and (min-width: 1000px) and (max-width:1367px){/*兼容1366*768*/
.body{ background: #000;
}/*這里是樣式*/
}
@media screen and (min-width: 1367px) and (max-width:1441px){/*兼容1440*900*/
.body{ background: #000;
}/*這里是樣式*/
}
@media screen and (min-width: 1441px) and (max-width:1920px){/*兼容1920*1080*/
.body{ background: #000;
}/*這里是樣式*/
}- 2 回答
- 0 關注
- 1316 瀏覽
添加回答
舉報
0/150
提交
取消