Title1
Title2
Title3
Login
Link
Search
教學頻道
中信金融管理學院
點二下資訊社
新化社區大學
GAS+購物車開發
GAS專案
GAS+購物車開發
Google表單實戰電商購物車
GAS+LineBot開發
外帶內用管理
購物車管理
線上打卡系統管理
萬用表單5
LineBot 線上書籍
PHP專案
網站程式設計-PHP(10502)
網站程式設計-PHP
PHP SMARTY 樣板引擎
SMARTY樣板
課程教材
雲端工具入門
行動應用企劃人員養成班
萬用表單5
GAS+LineBot開發
研習
萬用表單5
鐵人賽-Google Apps Script整合運用
GAS+LineBot開發
樂齡3C學習不斷電
臺東專科學校
GAS 開發 LineBot 自動接單系統
德鍵
112行動應用企劃人員養成班
111網頁前端設計工程師培訓班
110網頁前端設計工程師培訓班
網頁前端設計工程師培訓班
old
網頁前端設計與開發運用培訓班
Javascript & JQUERY
免費釋出專案
萬用表單
自動資料查詢
台南社大
113-01-雲端工具入門
112-02-AI自動管理
112-01-用QRCODE打造自動化環境
110-01-用雲端打造自動化環境
用雲端打造自動化環境
Google雲端智慧王
讓雲端工具提昇工作效率
Google 速學工作術
台南市總圖
教你如何使用LINE Bot機器人增加工作效率
Google雲端工具基礎應用
Google雲端工具進階應用
工作自動化與行銷(台南社大)
全部教材
台南市人力發展中心
Google工具應用實務班
企業課程
鐳達實業有限公司
GAS研習-20200726
中正大學-GAS研習
將軍圖書館
Google雲端工具基礎應用
Google雲端工具進階應用
南方創客
GitHub 衍伸應用
Google 應用工作術
永康社大
用雲端打造自動化環境(110-春季班)
用雲端打造自動化環境
南關社大
電腦、手機生活應用
遠端桌面
公司業務
傳送檔案
adwcleaner
W10 更新
客戶網站
最近完工
深雋設計有限公司
新化社大校務系統
靚品科技有限公司
5C Precision Co., Ltd.
BALANCE 1
RWD網站
東北關廟麵
曼馱有限公司
永宸昕有限公司
昌美實業社
形象網站
勇信機械有限公司
GAS專案
聯絡我們&案件委託
所有書籍
「網站程式設計-PHP」目錄
MarkDown
1. bootstrap(上)
1. bootstrap(上)
1-1 bootstrap 介紹
1-2 網頁組成
1-3 導覽列
1-4 backstretch jquery plugin
1-5 上課軟體
1-6 FILEZILLA檔案傳輸軟體
2. Bootstrap(下)
2-1 HTML 語法
2-2 CSS 樣式表
2-3 課後練習
2-4 nav.html
3. PHP開發環境
3-1 sublime text操作技巧
3-2 index.php
3-3 Uniform Server設定
4. PHP簡介與語法
4-1 課後練習(4)
5. PHP邏輯判斷
5-1 if else ifelse 邏輯判斷語句 範例
5-2 foreach 範例
5-3 課後練習(5)
6. MYSQL
6-1-1 MySQL管理工具
6-2-2 建立資料庫
6-2-3 上傳管理工具
6-2-4 登入ＭySql
6-2-5 修改資料庫預設編碼
6-2-6 新增資料表
6-3 讓PHP連上MySQL
6-3-1 sqlConfig.php
6-3-2 mysql 與 mysqli 撈資料的差異
6-4 常和select一起用的PHP的函數
6-5 課後練習
6-6 課後 練習參考
7. 規劃商品展示資料結構
7-1-1 首頁草稿
7-1-2 商品展示草稿
7-1-3 關於我們草稿
7-1-4 聯絡我們草稿
7-2-5 ugm_kind
7-2-6 ugm_prod
7-2-7 ugm_contact
7-2-8 ugm_system
7-2-9 ugm_files
7-3 假圖
8. 導入PHP樣板引擎
8-1 smarty 樣板引擎
8-2 smarty 空白架構
8-3 config.php
8-4 smarty.php
8-5 nav.php
8-6 theme.html
8-7 Smarty 保留變數
9. 製做「登入後台」畫面
9-1 修改config.php 讓遠端與本機同時使用
9-1-1 空白php的架構
9-2-2 $_SESSION
9-3 表單
9-4 實做
10. 資訊通知中心
10-1 實做
11. 選單管理(上)
11-1 adminer.php 建立資料表
11-2 nav.php
11-3 後台程式框架
11-4 表單
11-4-1 表單架構
11-4-2 Bootstrap 元件架構
11-5 新增記錄
11-6 顯示單筆
12. 選單管理(下)
12-1 列表
12-2 編輯表單
12-3 更新記錄
12-4 刪除記錄
12-5 mysqli
12-6 微調
13. 整理成框架
13-1 套用至前台nav.php
13-2 整理後台nav_m.php 過程
13-3 nav_m.php 完成
13-4 選單的樣板
14. 輪播圖管理(上)
14-1 slider.php
14-2 修改樣板
14-3 增加後台選單
14-4 自動更新
15. 輪播圖管理(下)
15-1 檔案上傳
15-2 樣板增加「上傳表單」
16. 套用至前台輪播圖
17. 商品類別、商品管理
17-1 kind.php
17-2 增加商品資料表
18. 商品管理後台
18-1 op_list 樣板
18-2 op_list()函數
18-3 op_form 樣板
18-4 op_form()函數
18-5 op_insert()函數
18-6 op_show樣板
18-7 op_show()函數
18-8 op_update()函數
18-9 op_delete()函數
18-10 get_block_prod()函數
18-11 前台 index.php 樣板
19. 附註
19-1 日期套件
19-2 ckeditor 網頁編輯器
19-3 表單驗證
19-4 拖曳排序
19-5 分頁
19-6 function.php
19-7 Superslides 輪播
19-8 Google map
20. 線上補充
20-1 GOOGLEMAPS API
1-2 網頁組成
網站程式設計-PHP ========== 1. 網頁開發框架「BOOTSTRAP3」 [Bootstrap 3 中文手冊](https://kkbruce.tw/bs3/) 2. [Bootstrap 3 下載](https://github.com/twbs/bootstrap/releases/download/v3.3.1/bootstrap-3.3.1-dist.zip) 下載後解壓縮，即可使用。 3. 空白的網頁架構 用文字編輯器(sublime、notepad++) 將下列範本存為index.html ``` <pre class="brush:as3;"> <html lang="zh-TW"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Bootstrap 基礎範本 Template</title> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- HTML5 shim and Respond.js 讓 IE8 支援 HTML5 元素與媒體查詢 --> <!-- 警告：Respond.js 無法在 file:// 協定下運作 --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]--> <!-- jQuery (Bootstrap 所有外掛均需要使用) --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <!-- 依需要參考已編譯外掛版本（如下），或各自獨立的外掛版本 --> <script src="js/bootstrap.min.js"></script> </head> <body> <h1>哈囉, 世界!</h1> </body> </html> ``` 4. 容器 <span style="color:#FF0000;">.container</span> 用於自適應且固定寬度的容器。 ``` <pre class="brush:as3;"> <div class="container"> ... </div> ``` <span style="color:#FF0000;">.container-fluid</span> 用於 100% 寬度的容器，橫跨可視區域的全部寬度。 ``` <pre class="brush:as3;"> <div class="container-fluid"> ... </div> ``` 5. 列、欄、格 ``` <pre class="brush:as3;"> <div class="row"> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> </div> <div class="row"> <div class="col-md-8">.col-md-8</div> <div class="col-md-4">.col-md-4</div> </div> <div class="row"> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> </div> <div class="row"> <div class="col-md-6">.col-md-6</div> <div class="col-md-6">.col-md-6</div> </div> ``` </body></html>
1. bootstrap(上)