靜態 HTML 網站合集·
介紹
這是我設計的登陸頁面和部落格範本的集合。這些主題是基於 HTML、CSS、javascript、jquery 和 Bootstrap。我正在創建這個存儲庫作為一個作品集，以展示我作為前端 Web 開發人員的工作以獲得工作機會，無論是自由職業者、兼職、全職還是合約工作，這些設計只是我的設計的一個簡單部分工作因為我不能把我的客戶的作品放在這裡公開。如果您認為我的服務對您有用並且有興趣僱用我，請隨時給我發送電子郵件。
在此存儲庫中，您將找到以下設計
點擊主題名稱即可查看即時預覽，這些設計不用於個人或商業用途，僅用於展示目的（以展示我的前端技能）。
- Canox：簡單、乾淨、個人化、現代且專業的博客，非常適合製作專業部落格網站。
- Covid-19：Covid-19：用於查看冠狀病毒統計數據的簡單登陸頁面，並了解如何透過來自API 的即時統計數據和互動式地圖來查看各個國家/地區的最新統計數據來保護自己免受感染。這個設計是由設計師 Shahriar Hossain 設計的，我只是透過對設計進行一些更改以使其看起來更好，將設計轉換為前端程式碼。
- Konish：科技公司的美麗而簡單的登陸頁面。這項工作是我作為前端 Web 開發人員的第一份工作。
- 投影與碰撞：我在大馬士革大學資訊科技工程學院學習三年級的投影與碰撞計畫的網路資訊演示。
- Sass：科技公司的另一個登陸頁面。您可以在此處查看 Behance 上的簡報。
- Sellvas：雜誌和部落格模板主題，優雅乾淨的設計雜誌和部落格主題。它配備了建立美麗部落格和照片庫所需的一切，採用現代簡約設計，易於維護，每個細節都無可挑剔。該主題包含超過 10 種佈局變體以及許多帖子和錯誤頁面樣式，以匹配每種設計風格。
- 故事： 簡單乾淨的登陸頁面，用於查看古董和手工作品，該網站是由 Majd Shamm 設計的，但我將該設計轉換為靜態網站。
- Tieqode：一支由專業人士組成的團隊，擁有必要的業務和技術技能、良好的領導、經驗和知識，可以為客戶提供最佳的解決方案和服務。當我加入TIEQODE團隊時，我在他們的網站上工作，您可以在此處查看網站。
- 婚禮：婚禮活動的現代而美麗的登陸頁面。
關於這些主題
這些設計的主要特點
- HTML5、CSS3、Javascript、jQuery 和 Bootstrap。
- 漂亮的視差效果。
- 有效的腳本和組織良好的程式碼。
- 簡約、現代、簡潔的設計。
- 使用免費的Google字體，如 Roboto 和 Raleway。
- 所有文件都有很好的註釋，以便於編輯。
- 支援輪播滑塊。
- 包括 jquery 和 CSS3 效果。
- 下拉式選單和普通選單也針對行動裝置進行了最佳化。
- 支援麵包屑導航，以實現更好的導航。
- 跨瀏覽器相容。
- 很棒的字體和 Ion 圖標集成。
- 帖子格式支援。
- 貼文下方的相關貼文。
- 包括作者框。
- 自訂錯誤 404 頁面。
使用的 JavaScript 函式庫
在這些主題中，有一些Javascript文件導入，所有需要的文件和插件都包含在專案文件中，這些文件和插件是：
- jQuery：jQuery 是一個快速、小型且功能豐富的 JavaScript 函式庫。它透過可在多種瀏覽器上運行的易於使用的 API，使 HTML 文件遍歷和操作、事件處理、動畫和 Ajax 等事情變得更加簡單。憑藉多功能性和可擴展性的結合，jQuery 改變了數百萬人編寫 JavaScript 的方式。
- Bootstrap：免費開源 CSS 框架，針對響應式、行動優先的前端 Web 開發。它包含基於 CSS 和 JavaScript 的版面、表單、按鈕、導航和其他介面元件的設計模板。
- Owl Carousel：是一個庫，幫助我在網站中製作具有漂亮過渡效果和樣式的滑塊。
- 視差：是一項現代功能，我使用此功能在滑鼠滾動時向佈局添加良好的視差效果。
- Font Awesome 和 Ion Icon：網站上使用的向量圖示和社交標誌。 Font Awesome 是網路上最受歡迎的圖標集和工具包，38% 使用第三方字體腳本的網站都使用它，而Ion Icons 是一款高級設計的圖標，可在網頁、iOS、Android 和桌面應用程式中使用。它支援 SVG 和網頁字體。
- Mixitup：用於動畫 DOM 作業的高效能、無依賴函式庫，讓您能夠透過精美的動畫來過濾、排序、新增和刪除 DOM 元素。 MixItUp 與您現有的 HTML 和 CSS 配合得很好，使其成為響應式佈局的絕佳選擇，並與內聯流、百分比、媒體查詢、Flexbox 等相容。
- TypedJs：一個類型庫。輸入任何字串，然後觀察它以您設定的速度鍵入，退格所鍵入的內容，然後為您設定的任意數量的字串開始一個新句子。
- 最後，在
main.js檔案中，我收集了上述所有內容：我實作了一些外掛程式來在主題中建立效果。這些插件已打包，因此我不需要手動編輯文件中的任何內容。唯一需要知道的是如何呼叫該方法。
使用的圖像和插圖
設計中使用的所有圖像都是100%免費的，但這僅用於演示目的，我使用了以下網站的圖像、圖標和插圖：
