「2022論壇/開幕」修訂間的差異
跳至導覽
跳至搜尋
(→議程人員) |
|||
行 4: | 行 4: | ||
*國立台灣大學物理所碩士班學生 | *國立台灣大學物理所碩士班學生 | ||
*南機場魔豆學院志工 (協助自學生寫桌遊輔助程式) | *南機場魔豆學院志工 (協助自學生寫桌遊輔助程式) | ||
− | *振鐸學會 RWD&APP 計畫執行人 | + | *振鐸學會 RWD & APP 計畫執行人 |
*程式(Python,C,C++,R) 自學者 | *程式(Python,C,C++,R) 自學者 | ||
+ | ===簡單介紹為何需要RWD APP=== | ||
+ | *如今3C產品發展迅速,手機、平板的開發已經大大改變我們瀏覽網頁與接收資訊的習慣。過去的網頁設計只需要考慮電腦螢幕大小,如果直接在手機或平板等不同寬度的螢幕上瀏覽就會讓使用者感到不方便,而響應式網站(RWD)的設計就能解決相關的問題。本講題主要介紹RWD與應用程式(APP)的開發心路歷程與具體執行實例。 | ||
+ | ===簡介RWD需要改變的檔案(html css javascript)=== | ||
+ | *html:超文本標記語言(HyperText Markup Language,簡稱:HTML),主要是寫出網頁的架構,有兩個重點分別如下: | ||
+ | **巢狀結構:HTML的形式會是一層一層包起來的樣子,如右方的gif範例。<div style='float:right;'><img src='http://jendo.org/uploadFiles/%E5%85%A8%E6%B0%91%E7%A7%91%E5%AD%B8%E5%B9%B3%E5%8F%B0/RWD/HTML.gif' width='400' height='240' /><br/></div><br/>像是<title>my bio</title>、<nowiki><h1>this is my bio</h1>和<p>bla bla bla...</p></nowiki>是最內層,分別被<head>...</head>與<body>...</body>夾住,整個又被<html>...</html>包起來。 | ||
+ | **屬性資料:我也可以在HTML程式碼中,直接賦予它屬性,比如說給他名字(id)、給他分類(class)、或先設定他的長寬(height、width)等等。<br/><img src='http://jendo.org/uploadFiles/%E5%85%A8%E6%B0%91%E7%A7%91%E5%AD%B8%E5%B9%B3%E5%8F%B0/RWD/html-example.jpg' width='400' height='150' /> | ||
+ | *css | ||
+ | *javascript | ||
+ | ===簡介RWD改變時重要的訣竅=== | ||
+ | ===簡介APP的環境與限制=== | ||
+ | ===簡介APP開發的內容=== | ||
+ | ===開發至今的心路歷程=== |
於 2022年5月4日 (三) 11:06 的修訂
目錄
議程人員
林芸伍
- 國立台灣大學物理所碩士班學生
- 南機場魔豆學院志工 (協助自學生寫桌遊輔助程式)
- 振鐸學會 RWD & APP 計畫執行人
- 程式(Python,C,C++,R) 自學者
簡單介紹為何需要RWD APP
- 如今3C產品發展迅速,手機、平板的開發已經大大改變我們瀏覽網頁與接收資訊的習慣。過去的網頁設計只需要考慮電腦螢幕大小,如果直接在手機或平板等不同寬度的螢幕上瀏覽就會讓使用者感到不方便,而響應式網站(RWD)的設計就能解決相關的問題。本講題主要介紹RWD與應用程式(APP)的開發心路歷程與具體執行實例。
簡介RWD需要改變的檔案(html css javascript)
- html:超文本標記語言(HyperText Markup Language,簡稱:HTML),主要是寫出網頁的架構,有兩個重點分別如下:
- 巢狀結構:HTML的形式會是一層一層包起來的樣子,如右方的gif範例。
像是<title>my bio</title>、<h1>this is my bio</h1>和<p>bla bla bla...</p>是最內層,分別被<head>...</head>與<body>...</body>夾住,整個又被<html>...</html>包起來。 - 屬性資料:我也可以在HTML程式碼中,直接賦予它屬性,比如說給他名字(id)、給他分類(class)、或先設定他的長寬(height、width)等等。
- 巢狀結構:HTML的形式會是一層一層包起來的樣子,如右方的gif範例。
- css
- javascript