原创 移動web開發學習整理
移動web flex彈性 案例 彈性攜程首頁 效果： .base.css body, div, span, p, ul, li, a, img, input, h1, h2, h3, h4, i { margin: 0;
2020-07-06 20:14:43
1
原创 博學谷案例練習
博學谷 效果圖： header模塊logo寫法 PS: logo作爲網站的標誌，應將其放在h1標籤中，以便搜索引擎找到它，描述信息通過 text-indent: -9999999px; overflow: hidden; 屬
2020-07-03 15:18:10
3
原创 小米首頁案例練習
小米商城 實現的效果 初始化css /* 初始化 */ /* * { margin: 0; padding: 0; box-sizing: border-box; } */ html,body,div
2020-06-30 08:01:02
原创 蘇寧易購首頁局部案例練習
蘇寧易購 index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" con
2020-06-25 05:03:01
原创 簡書首頁案例練習
簡書首頁案例練習 index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" c
2020-06-25 05:03:01
原创 學習日誌——2019/09/16
數據庫 數據庫概述 什麼是數據庫 數據庫就是一個 文件系統，只不過我們需要通過面令（SQL）來操作這個文件系統 數據庫是以一定方式儲存在一起、能與多個用戶共享、具有儘可能小的冗餘度、與應用程序彼此獨立的數據集合，可視爲電子化的
2020-06-17 09:01:11
原创 Grid網格佈局學習整理
Grid網格佈局 Grid佈局是一個二維佈局方法，縱橫兩個方向總是同時存在。 作用在grid容器上 作用在grid子項上 grid-template-columns grid-column-start gri
2020-06-16 01:02:01
原创 移動端開發基礎
Viewport視口 在移動端viewport視口就是瀏覽器顯示頁面內容的屏幕區域。在viewport中有兩種視口，分別表示爲， visual viewport（可視視口）和layout viewport（佈局視口）。 vi
2020-06-16 01:02:01
原创 網頁佈局拓展
等高佈局 利用margin-bottom負值與padding-bottom配合實現。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">
2020-06-02 20:02:41
原创 Flex彈性佈局學習整理
隨着移動互聯網的發展，對於網頁佈局來說要求越來越高，而傳統的佈局方案對於實現特殊佈局非常不方便，比如垂直居中。 2009年，W3C 提出了一種新的方案----Flex 佈局，可以簡便、完整、響應式地實現各種頁面佈局。目前，它已經
2020-05-31 19:06:59
原创 品優購案例練習（四）
品優購列表頁製作 列表頁面是新的頁面,我們需要新建頁面文件 list.html。 因爲列表頁的頭部和底部基本一致,所以我們需要把首頁中的頭部和底部的結構複製過來。 頭部和底部的樣式也需要,因此list.html中還需要引入com
2020-05-30 18:08:54
1
原创 css3- 兩面翻轉的盒子、3D導航欄、旋轉木馬
兩面翻轉的盒子 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="widt
2020-05-30 18:08:54
1
原创 網站後臺案例練習
正達建築內部管理平臺 採用BFC規範使左側固定，主體部分自適應 index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"
2020-05-30 18:08:54
原创 品優購案例練習（三）
推薦模塊 大子recom推薦模塊 recommend 裏面包含2個盒子，浮動即可 1號子recom-hd 2號盒子recom-bd ,注意裏面的小豎線 html <!-- 推薦模塊 recom start--> <di
2020-05-25 02:16:16
1
原创 品優購案例練習(一)
環境搭建 .base.css * { margin: 0; padding: 0; /* css3盒子模型 */ box-sizing: border-box; } /* em和i斜體的文字不
2020-05-21 23:04:54