資訊基礎應用筆記/稚博

出自跨校選修
跳至導覽 跳至搜尋

電腦與網路資源

  • 知識:
    1. 什麼是 UTF-8? 萬國碼:網址原只能用英文,但後來發展到各國文字皆可用
    2. 區分客戶端與伺服器端。伺服器端的特徵:被動的角色(從)等待來自使用者端的請求、處理請求並傳回結果 使用者端的特徵:主動的角色(主)發送請求、等待直到收到回應
    3. 怎麼線上解壓縮 zip 檔? 只有 apple電腦需要
    4. 何謂 CC 授權? CC授權是免費的,無特定對象授權,只要遵守規則都可使用
    5. 何謂綠色軟體? 免安裝軟體,好處:不占空間、可以隨時移動到任何位置
    6. 解釋十六進位與十進位的差別 十進位是我們平常用的數字進位制,十六進位則是使用0~9和英文A~F(十進位制的10~15)表示,且逢十六進一。色碼使用十六進位制
    7. 解釋「色碼」 色碼就是代表顏色的代碼 像是:#000000 其他色碼也可以從網路上找到 色碼網站
    8. 解釋 ASCII wiki上找的
  • 技能:
    1. 顯示或隱藏檔案副檔名 <!--(不表現)-->
    2. 用 google 找圖照 照片
    3. 找照片的網址
    4. 怎麼複製出含中文的網址 在複製包含中文、非英的網址時,不要包含最後一個字,放到頁面上後再自行補回
    5. 找出綠色軟體市集 找阿榮福利社
  • 範例: 印度河谷圖章
  • 英文:img(圖像),src(搜尋),width(寬),height(高),png(無背景),jpg(圖片檔)

維基共享資源

  • 知識:
    1. 維基共享資源大約有多少資源? 目前有:74,352,928個
  • 技能:
    1. 註解
    2. 找圖照 file:
    3. 找縮圖網址
    4. 縮圖網址的格式
    5. 找某張圖被哪些 wiki 頁使用
    6. 找某人上傳的縮圖
    7. 用分類找圖
  • 範例:
  • 英文:

wiki

  • 知識:
    1. 什麼是 wiki ?
  • 技能:
    1. 怎麼打出角括號:< > &
    2. 註解
    3. 下段標
    4. 有序列點
    5. 無序列點
    6. 外部連結
    7. 內部連結
    8. 連續文字分段
    9. 嵌入圖照
    10. 嵌入 youtube 影片
    11. 嵌入非 youtube 影片
    12. 嵌入 wiki 頁
  • 範例:

HTML

  • 知識:
    1. 什麼是 HTML ?
    2. 什麼是 http ?
    3. http 和 https 的差別?
    4. 分辨顯示與原始碼
  • 技能:
    1. 看原始碼
    2. 註解
    3. 使用 html,head,body 三標籤
    4. 用 title 標籤,改變頁籤文字
    5. 指定 HTML 為 UTF-8 編碼
    6. p 標籤,font-size,font-family,text-align 三樣式
    7. 有序列點
    8. 無序列點
    9. span 標籤
    10. 做表格
      1. border-collapse 樣式
      2. 表格調中
    11. 超連結
    12. 連續文字分段
    13. 嵌入圖照
    14. 嵌入影片
    15. 水平線
    16. 標題一級到六級
    17. 區塊
  • 範例:
    1. 全班通訊錄
  • 英文:

CSS

  • 知識:
    1. 什麼是 CSS ? 用來定義樣式
  • 技能:
    1. style 屬性格式語法 <link href='stylecolor.css' rel='stylesheet' type='text/css'/>
    2. 如何樣式定義一次,引用多次
  • 範例:範例1 範例2
  • 英文: XML(Extensible Markup Language) HTML(HyperText Markup Language) SVG(Scalable Vector Graphics)

SVG

  • 知識:
    1. 什麼是 SVG ? 可縮放向量圖形
    2. 什麼是 XML ? 可延伸標記式語言
    3. 做一個 XML、HTML、SVG 三者的關係簡圖。
    4. 說明 SVG 的三個特性 1. XML語法,用書寫指示來畫圖。2. 二維向量圖形格式,不是點陣圖,無段縮放不會毛邊。3. 由W3C制定,是開放標準。
    5. 寫出 直線、多點成線、多邊形、圓、矩形 在 SVG 中的標籤名稱
    6. 找一張能用在教學上,維基共享資源的 SAG 圖,說明可以用來教什麼主題。
    7. Windows 上 SVG 楷書的名稱,或蘋果
  • 技能:
    1. 用 SVG 畫一個圓。
    2. 用 SVG 畫一個熊臉 請參考範例2
    3. 用 SVG 畫出「羅馬」兩個字 範例3
    4. 用 SVG 畫出「羅馬不是一天造成的」九個字,並用旋轉拉斜 範例3
    5. transform 屬性可以有四種操作:位移、旋轉、大小縮放、拉斜,寫出前三種操作(位移、旋轉、大小)的語法 範例4
    6. 在 SVG 原始碼中怎麼把一堆東西打包成群?
<?xml version='1.0' encoding='UTF-8' standalone='no'?>
<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' width='600' height='600'>
<g transform='translate(300,48) rotate(30) scale(1.7)'>
<polygon points='100,100 120,20 100,0 80,20' style='stroke:none;stroke-width:0;fill:yellow;'/>
<polygon points='100,100 120,20 100,0 80,20' style='stroke:none;stroke-width:0;fill:yellow;' transform='rotate(45 100 100)'/>
<polygon points='100,100 120,20 100,0 80,20' style='stroke:none;stroke-width:0;fill:yellow;' transform='rotate(90 100 100)'/>
</g>
</svg>
    1. 用 SVG 畫出一朵花,有三個花瓣一個花梗 範例6
    2. 用 SVG 畫出三朵花,每朵花都有三個花瓣一個花梗 範例6
    3. 用 SVG 畫出一個帶漸層色的方塊 範例7
    4. 用 SVG 畫一個用放射漸層表示的太陽 範例8
    5. 怎麼將紙上的手繪圖拍下來,並展開為平整的電子檔?

下載 Microsoft Lens 用 Microsoft Lens 拍下來 照片下載到電腦 用小畫家將手繪圖切邊 大家安裝 inkscape 1.02 版 開啟 inkscape

  • 「檔案/匯入」切邊的手繪圖
  • 「路徑/描繪點陣圖/亮度截止/『亮度臨界值』調到適當值/用『更新』測試/確定/關閉『描繪點陣圖』」
  • 用滑鼠移動新圖,刪掉品質差的那一個
  • 「檔案/文件屬性/『單位』調成px/將頁面調整成圖畫大小」
  • 「檔案/另存新檔」,如:瓷象1.svg
  • 以 Ctrl-4 關閉圖檔但不關 inkscape

用 emeditor 開 svg

  • 去掉 viewBox 整行
  • 找到圖形
  • 將圖形加上 transform='scale(0.1)' 縮小若干倍,另存成:瓷象2.svg

用 inkscape 開啟 瓷象2.svg

  • 「檔案/文件屬性/『單位』調成px/將頁面調整成圖畫大小」
  • 「檔案/另存新檔」,如:瓷象2.svg

抄 [http://jendo.org/files/6year/教學資源/社會/日本/Japan.html 日本 GIS], 在 經度:129.848,緯度:33.2137 處加「瓷象」, 並且連向介紹頁


    1. 怎麼使用 inkscape 將電子圖檔轉 SVG 向量圖?
    2. 怎麼使用 inkscape 將 SVG 圖多餘的邊切除?
    3. 怎麼對一張點陣圖進行「去背」?(png 檔可去背,jpg 檔無法去背) 沒教
    4. 怎麼找一張適合的 ICON ,並且是 SVG 格式的圖?
    5. 怎麼縮小一張 SVG 圖的大小?
    6. 怎麼改變一張 SVG ICON 圖的顏色?
    7. 怎麼將自己修改的 SVG ICON 圖,可以有網址,能讓 HTML 與 Wiki 頁引用? 上傳到檔案櫃
  • 範例:範例2 範例3 範例4 範例6 範例7 範例8
  • 英文:

GIS

  • 知識:
    1. 什麼是 GIS ? 地理資訊系統是地理+資訊系統 特定的空間進行管理、儲存、展示及分析
  • 技能:
  • 範例:
  • 英文: