製作一個響應式網頁用到的東西(jQuery和bootstrap)

準備復原一個網站

網址

相關的jQuery和bootstrap
個人是在菜鳥教程手冊網上學習的 、查找資料的,可以供參考

學習筆記

因爲個人在做一個網頁的時候,因爲能力不夠,原生的JS寫的不夠好,不能很好的展現我需要表達的東西,所以引入了jQuery和bootstrap。下面是個人對一些東西的用法:

logo選擇

可以在阿里巴巴矢量圖標庫找到並選擇的;
但我個人是在手冊網定製的logo。

bootstrap

做網頁都得有精美的CSS, bootstrap有衆多的模板可供選擇
然後就是我運用的一些模板

頁面排版

文筆有限直接上代碼吧

<div class = "container">  <!-- 建立一個容器-->
		
</div>

這個是創建一個容器,然後東西都寫在裏面就OK

響應式

原話是這樣的:Bootstrap 提供了一些輔助類,以便更快地實現對移動設備友好的開發。這些可以通過媒體查詢結合大型、小型和中型設備,實現內容對設備的顯示和隱藏。
我的個人理解是:在不同的顯示器展示不同的效果。

導航欄

說實話 我在製作網頁時 導航欄的確困擾了我很長時間
糾結他的CSS,糾結他的響應式。
當然,截至我寫這個的時候,還是沒有解決。

不過有一些自己的思路:
1.在不同的媒體條件設置不同的CSS,以求達到響應式(不知道可不可行)
2.使用jQuery當點擊圖標時,觸發某一個函數,使隱藏的元素顯示出來,還要設置不同的z-index,以免出現重疊
3.也可以設置滾動監聽來達到同樣的效果

除此之外的個人學習

輪播圖的製作也存在一點問題
對於bootstrap的class使用還是存在一些不解,自己寫了網頁才發現,寫CSS的能力特差,需要加強





第一次寫博客,如果有不準確的地方,請大佬指正!
發佈了12 篇原創文章 · 獲贊 12 · 訪問量 1407
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章