資訊基礎應用筆記/徐慕禾

電腦與網路資源

• 知識：
  標記應該用來描述類型或類型成員。 使用將 補充資訊加入至類型描述。 使用 cref 屬性，讓 DocFX 和 Sandcastle 這類文件工具為程式碼項目建立文件頁面的內部超連結。

標記的文字

是 IntelliSense 中型別的唯一資訊來源，也會顯示在 [物件瀏覽器] 視窗中。

使用 DocumentationFile 進行編譯，以處理檔案的檔批註。 若要根據編譯器產生的檔案來建立最終檔，您可以建立自訂工具，或使用 DocFX 或 >sandcastle之類的工具。

• 1. 什麼是 UTF-8？
  2. 
     以前電腦剛開始發展時，每一個國家都各自發展自己的文字系統，所以就會有中文系統日文系等，可是大家在發展的過程中並沒有相互參考文字在電腦裡的編碼方式，所以同一個碼在不同的地區文字系統裡並不代表同一個字，所以當妳開起非中文的語文編集碼時，就會出現一堆亂碼。
  3. 區分客戶端與伺服器端。
  4. 
     客戶端的控制元件和伺服器端的是對應的，伺服器端的頁面傳送給客戶端後，就解析成了 對應的html（就是客戶端）的控制元件。伺服器端控制元件是伺服器來解析的，客戶端控制元件是由瀏覽器解析的。伺服器控制元件就是 必須通過“網路”來連結伺服器實現的，

客戶端控制元件就是 在本地的網站就可以執行的。 客戶端：向使用者服務。 伺服器端：為客戶端服務。

• 1. 怎麼線上解壓縮 zip 檔？
  2. 
     本文要推薦的「Archive Extractor」是一款免費、微型且簡易的線上工具，可用來解壓縮超過70 種以上壓縮檔格式，包括7z、zipx、rar、tar、exe、dmg 等等，只要把檔案上傳，或是透過Google Drive、Dropbox 等雲端硬碟匯入，輸入網址就能進行解壓縮，將你需要的檔案拆開分別下載。
  3. 何謂 CC 授權？

為了讓大眾都可以自由使用，不受著作權法的限制，美國一個著名的法律學著在2001提出保留部分著作權利，其餘全都釋出給大眾使用。 將作品釋出給大眾使用。透過這種自願分享的方式，大家可以群力建立內容豐富、權利清楚、且便於散布的各式內容資源，嘉惠自己與其它眾多的使用者

• 1. 何謂綠色軟體？
  2. 
     定義 起初人們把「綠色軟件」定義為「把很冗余的資訊軟體清除」，特別是在中国大量擁有大量的病毒軟見。 只把好的系統流閜給使用著，所以冠上「綠色」之名。

• 1. 解釋十六進位與十進位的差別
  2. 
     對於接觸過電腦的人來說應該都不陌生，我們常用的進位包括：二進位、八進位、十進位與十六進位，它們之間區別在於數運算時是逢幾進一位。比如二進位是逢2進一位，十進位也就是我們常用的0-9是逢10進一位。

十六進位:，是計算機中數據的一種表示方法。同我們日常生活中的表示法不一樣。它由0-9，A-F組成，字母不區分大小寫。與10進位的對應關係是：0-9對應0-9；A-F對應10-15；N進位的數可以用0~(N-1)的數表示，超過9的用字母A-F。 Style屬性是什麼?

• 1. 
     

• 1. 解釋「色碼」 等雲端硬碟匯入，輸入網址就能進行解壓縮，將你需要的檔案拆開分別下載。
  2. 
     HEX 色碼是以十六進位值來代表不同色彩模式中的顏色的一種方式。十六進位色碼的格式為#RRGGBB，其中RR是紅色，GG是綠色，而BB則是藍色。這些十六進位整數可以落在00到FF的範圍內以指定顏色的強度。
  3. 解釋 ASCII
  4. 
     目前電腦中用得最廣泛的字元集及其編碼，是由美國國家標準局(ANSI)制定的ASCII碼，它已被國際標準化組織（ISO）定為國際標準，稱為ISO 646標準。適用於所有拉丁文字字母，ASCII碼有7位碼和8位碼兩種形式。

因為1位二進位數字可以表示（21=）2種狀態：0、1；而2位二進位數字可以表示（22）=4種狀態：00、01、10、11；

依次類推，7位二進位數字可以表示（27=）128種狀態，每種狀態都唯一地編為一個7位元的二進位碼，對應一個字元（或控制碼），

這些碼可以排列成一個十進位序號0～127。所以，7 位ASCII碼是用七位元二進位數字進行編碼的，可以表示128個字元。

• 技能：
  1. 顯示或隱藏檔案副檔名

Windows 7為了系統的安全，預設會隱藏重要的系統檔案和資料夾，且不顯示已知檔案類型的副檔名，有時候為了要編輯隱藏檔，需要顯示隱藏檔和副檔名的方法敘述如下： 1.開啟檔案總管，如圖示，檔案沒有顯示副檔名且有些系統檔案和資料夾被隱藏 2.點選「組合管理\資料夾和搜尋選項」，準備更改設定以顯示隱藏檔和副檔名。 3.在「檢視」的索引標籤，預設勾選「隱藏已知檔案類型的副檔名」、「隱藏保護的作業系統檔案」，且選擇「不顯示隱藏的檔案、資料夾或磁碟機」。 4.取消勾選「隱藏已知檔案類型的副檔名」。 5.取消勾選「隱藏保護的作業系統檔案」。 6.出現警告視窗，點選「是」。 7.點選「顯示隱藏的檔案、資料夾及磁碟機」。 8.點選「確定」。 9.如圖示，已經顯示隱藏的檔案和資料夾，且檔案也顯示副檔名。 10.檔案修改完成之後，依上述相反的步驟，將檔案和資料夾隱藏，如下圖所示，以保護系統檔案。

• 1. 用 google 找圖照
  2. 找圖的網址https://images.app.goo.gl/qfgSEuxYqT7FzxXE8(我頭皮好癢)
  3. 怎麼複製出含中文的網址
  4. 
     用chrome複製網址中文時,再把它貼上其它地方會出現這些看不懂的符號%A4%A4%A4%E5,有辨法貼上有中文網址列時,不要出現這些符號,直接用中文顯示,像firefox可以在網址列輸入about:config,那chrome可以嗎?

最簡單的方式就是少 copy 一個字元，就會保持原來的中文，如圖所示。然後自己補上 **http://** 跟少 copy 的那個字就行了。Firefox 跟 Chrome 都通用。

• 1. 找出綠色軟體市集
  2. 
     https://www.azofreeware.com/
• 範例：
• 英文：img srg=

維基共享資源

• 知識：
  1. 
     維基共享資源的宗旨是提供一個，「使所有人都可以使用公共領域和自由許可的教育媒體內容，並作為維基媒體基金會各項目的公共存儲庫存在」的媒體文件存儲庫。

維基共享資源是一個多語言項目。其默認語言是英語，但是註冊用戶可以將自己的用戶界面定製成已翻譯的版本，許多頁面也存在多種語言版本。我們鼓勵用戶協助翻譯。 詳情參見維基共享資源歡迎頁面以及社區門戶。歷史細節參見歷史項目計劃。

• 1. 維基共享資源大約有多少資源？
  2. 
     維基共享資源有來自世界各地的資源。

维基共享资源，是一个多媒体资料库。维基共享资源从2004年9月开始启动，它的目的是作为一个自由的图像、音乐以及可能还包括文献和演讲等的资源中心，并提供给所有的维基媒体计划使用。这个项目中的资源可以在所有的计划中调用。是指存放自由开放的图片、声音、及其他多媒体档案的地方，是维基媒体基金会的计划。上载的档案可在其他维基计划中使用，包括维基百科、维基教科书、维基新闻以及wiki.yeefe.com等。

• 技能：
  1. 
     可存放自由開放的圖片、聲音及其他多媒體檔案的地方，是維基媒體基金會的計劃。上載維基共享資源的檔案可在其他維基計劃中使用，包括維基百科、維基教科書、維基新聞等。截至2018年，維基共享資源擁有超過4400萬個多媒體檔案。
  2. 註解
  3. 
     丁丁

[[ ]] [ ]

• 1. 找圖照
  2. 
     https://commons.wikimedia.org/wiki/%E9%A6%96%E9%A1%B5#/media/File:2017.08.29.-02-Anglersee_Huettenfeld-Lampertheim--Grosse_Sumpfschwebfliege-Weibchen.jpg
  3. 找縮圖網址
  4. 
     https://upload.wikimedia.org/wikipedia/commons/5/5c/M%C3%BCnchen_1_Milliarde_1923.jpg
  5. 縮圖網址的格式
  6. 
     https://upload.wikimedia.org/wikipedia/commons/thumb/5/5c/M%C3%BCnchen_1_Milliarde_1923.jpg/195px-M%C3%BCnchen_1_Milliarde_1923.jpg
  7. 找某張圖被哪些 wiki 頁使用
  8. 
     https://commons.wikimedia.org/wiki/File:ROCA_Special_Assault_Vehicle_Rear_View.jpg
  9. 
     https://commons.wikimedia.org/wiki/File:VAO-ARA.jpg
  10. 
      到共享資源最上面搜尋妳要的圖片，然後點選全浴檔案即可找到妳要的資料。

• 1. 找某人上傳的縮圖
  2. 
     https://commons.wikimedia.org/wiki/File:Pomn%C3%ADk_padl%C3%BDm_ve_Hvozdci_(Q66565878)_02.jpg
  3. 用分類找圖
• 範例：https://commons.wikimedia.org/wiki/File:Rue_Albert_Camus_(Amiens)_01.jpg
• 英文：COMMONS、jpg

wiki

• 知識：
  1. 
     有史以來規模最大、閱讀量最多的參考工具書──維基百科（Wikipedia），即將於1月15日迎來上線20周年。作為任何人都可以編輯的免費網路百科全書，維基百科包含志願者以300多種語言編寫的條目數量達到5500萬。網絡分析公司Alexa指出，維基百科是全球最受歡迎網站第13位，領先Reddit、Netflix和Instagram。

維基百科是全球前50熱門網站排行裡，唯一的非營利機構網站，它無視矽谷巨擘靠經營網站成功的秘訣，沒有股東、沒有廣告、沒有讓創辦人成為億萬富翁，僅靠非營利慈善機構「維基媒體基金會」（Wikimedia Foundation）維持運作，並吸引越來越多的普通民眾志願貢獻，使維基百科自然地茁壯發展

• 1. 什麼是 wiki ？
• 技能：
  1. 
     wiki泛指可快速尋找到可用確實的資料。Wiki 是一種支援社群共同創作的網頁系統，在Web 的基礎上可以對Wiki 進行新增、 修改、瀏覽、版本比較…等功能。
  2. 怎麼打出角括號：< >
  3. 
     原為數學用的符號，有括線、括弧兩種。括線用於數字之上，形為－；括弧用於數字之外，如（）、〔〕。今亦普遍被用於文章書寫上。
  4. 註解
  5. 
     角括號

這是一個臨時條目列出關於角括號的相關資訊，因為字典百科目前沒有這個字詞的條目。 登入或創建一個新帳號以開始編輯角括號條目。

• 1. 下段標
  2. 
     是二進位制 其應該這樣寫才規範1100（2） 二進位制是：從右往左起第n個數 分別對應2的n-1次方 0則跳過去 各個位數對應值相加，所以1100（2）這個二進位制數=2的3次方+2的2次方+2的0次方+2的0次方=12這個十進位制數
  3. 有序列點
  4. 
     在數學上, 若一個拓撲空間裏，每個無窮序列都有收斂子序列，則稱該拓撲空間序列緊（英語：sequentially compact）。 雖然對於度量空間，緊等價於序列緊，但是對於一般的拓撲空間來說，緊（英語：compact）和序列緊是兩個不等價的性質。
  5. 無序列點
  6. 
     无序列表是一个没有特定顺序的列表项的集合，也称为项目列表。在无序列表中，各个列表之间属于并列关系，没有先后顺序之分，它们之间以一个项目符号来标记
  7. 外部連結
  8. 
     外部連結是超連結，來源非自身網址之外的任何網址。

外部連結是指向外部網址的連結。 頂級SEO專家們認為外部連結是排名權重最重要的來源。 外部連結通過“連結權重”（排名權力）不同於內部連結，因為搜尋引擎認為他們是第三方投票。 頂級SEO專家們不認為“標題”連結屬性會是於排名因素之一。

• 1. 內部連結
  2. 
     內部連結是指向（目標）與連結所在的網址（來源）皆是相同網址，簡單的說，內部連結就是同一網站的另一個網頁。

• 1. 連續文字分段
  2. 
     頁面上文字的外觀是由一個複雜的互動程序來決定的，稱為排版。InCopy 會使用選取的單字間距、字母間距、字符縮放比例以及連字選項，以最能支援指定參數的方式來編排文字。

InCopy 提供兩種排版方法: 「Adobe 段落視覺調整」(預設值) 和「Adobe 單行視覺調整」(兩者皆顯示在「控制」面板選單中)。您可以在「段落」面板選單、「齊行」對話框或是「控制」面板選單中，選取要使用的排版方法。

• 1. 嵌入圖照
  2. (br)問：Illustrator(Ai)或ＰＤＦ檔，為何要圖片嵌入，不嵌入會怎麼樣嗎？

答：若檔案內有圖片的話，必須記得＂嵌入圖片＂，不嵌入的話，檔案寄過來會導致圖片遺失、掉圖，我們用ＡＩ開啟檔案（.ai 及.pdf 都會有此問題）時會看不到圖片。

步驟1：檢查及辨別圖片是否嵌入

未嵌入，滑鼠游標移至圖片上時，會出現藍色交叉的線。

已嵌入，滑鼠游標移至圖片上時，藍色交叉的線會消失。

• 1. 嵌入 youtube 影片

https://www.youtube.com/watch?v=sFolv_or9s8&t=163s

• 1. 嵌入非 youtube 影片

https://www.gimyvod.cc/vod-play-id-24155-sid-1-pid-1.html

• 1. 嵌入 wiki 頁
• 範例：https://commons.wikimedia.org/wiki/%E9%A6%96%E9%A1%B5

CSS

• 1. 什麼是css?
     cSS的中文名稱也有許多種如:串樣式列表、級聯樣式表、串接樣式表、層疊樣式表、階層式樣式表。 是用來為結構化文件（如HTML文件或XML應用）添加樣式（字型、間距和顏色等）的電腦語言，由W3C定義和維護。 目前最新版本是CSS2.1，為W3C的推薦標準，優點為:網頁的讀者和作者都可以使用CSS來決定檔案的顏色、字型、排版等顯示特性。CSS最主要的目的是將檔案的內容與顯示分隔開來
  2. style屬性是什麼?
     style 屬性規定元素的行內樣式（inline style）。
     style 屬性將覆蓋任何全局的樣式設定，例如在 Scale Up
     • 1. 說明 SVG 的三個特性

     SVG從1999年由一組加入W3C的公司啟動開發，與之前1998年提交給W3C的標準（PGML、VML）構成競爭。SVG從這兩個格式吸取了經驗。[4]

     SVG允許3種圖形物件類型：向量圖形、點陣圖像以及文字。圖形物件——包括PNG、JPEG這些點陣圖像——能夠被編組、設計、轉換及整合進先前的彩現物件中。文字可以在任何適用於應用程式的XML命名空間之內，從而提高SVG圖形的搜尋能力和無障礙性。SVG提供的功能集涵蓋了巢狀轉換、裁剪路徑、Alpha通道、濾鏡效果、模板物件以及可延伸性。

     SVG嚴格遵從XML語法，並用文字格式的描述性語言來描述圖像內容，因此是一種和圖像解析度無關的向量圖形格式。

     SVG格式具有以下優點： 圖檔可讀，易於修改和編輯（理論上如此，但實際上卻是因為各種不同的SVG檔編輯器而可能儲存成不易解讀的SVG檔案）。 與現有技術可以互動融合。例如，SVG技術本身的動態部分（包括時序控制和動畫）就是基於SMIL標準。另外，SVG檔案還可嵌入JavaScript（嚴格地說，應該是ECMAScript）指令碼來控制SVG物件。 SVG圖形格式可以方便的建立文字索引，從而實現基於內容的圖像搜尋。 SVG圖形格式支援多種濾鏡和特殊效果，在不改變圖像內容的前提下可以實現點陣圖格式中類似文字陰影的效果。[5] SVG圖形格式可以用來動態生成圖形。例如，可用SVG動態生成具有互動功能的地圖，嵌入網頁中，並顯示給終端使用者。

     • 1. 寫出 直線、多點成線、多邊形、圓、矩形 在 SVG 中的標籤名稱
     • 1. 找一張能用在教學上，維基共享資源的 SVG 圖，說明可以用來教什麼主題。

     https://commons.wikimedia.org/wiki/%E9%A6%96%E9%A1%B5 認識其他國家的地理特色、地形與風景，了解當地的人文特色等等的。

     • 1. Windows 上 SVG 楷書的名稱，或蘋果
     • 技能：按兩下 Finder 裡的字體，然後在隨後開啟的字體預覽視窗裡，按一下「安裝字體」。當 Mac 驗證完字體並開啟「字體簿」app 之後，即表示該字體已安裝完畢可供使用。
       1. 用 SVG 畫一個圓。

     html { font-size: 16px;} body { font-family: sans-serif; }

     .contain {

      display: flex;
      justify-content: center;
      padding: .65rem;
      box-sizing: border-box;
     

     }

     • 1. 用 SVG 畫一個熊臉
     • 1. 用 SVG 畫出「羅馬」兩個字

     在開始繪圖前，我們必須先了解畫布 (canvas) 網格，或著是說座標空間。在前一頁教學中的 HTML 範本有一個寬150 pixels (像素)、高150 pixels 的畫布。如右圖，你在畫布預設網格上繪圖，網格上 1 單位相當於畫布上 1 pixel，網格的原點 (座標 (0, 0) ) 坐落於左上角，所有元素定位皆相對於此左上角原點，所以藍色方塊的位置為從左往右推 x pixels、從上往下推 y pixels (亦即座標 (x, y) )。現在我們先專注在預設設定上，之後我們會看到如何轉換原點位置、旋轉網格以及縮放網格。

     • 1. 用 SVG 畫出「羅馬不是一天造成的」九個字，並用旋轉拉斜

     1 2 3 4 5

     • 1. transform 屬性可以有四種操作：位移、旋轉、大小縮放、拉斜，寫出前三種操作(位移、旋轉、大小)的語法

     說明：運用 CSS level 3 (CSS 3) 的 transform 特性 (CSS properties) ，直接就可以旋轉、歪斜、放大、縮小、移動元素 (elements) 的 box ，甚至 3D 的迴旋、透視。包括整個元素所有的內容也都隨之變形，不再侷限只能在僵硬的矩形框，對網頁排版及設計上會有很大的彈性和突破，而且對網頁正常的編排不會有相互排擠問題，一格黏接一格耗時費工的殘腦時代終將走入歷史。本篇僅先就 2D transform 的部分討論。 適合：有 HTML 及 CSS 語法基礎概念者。 共有 2 個特性值，每個值之間以至少一個半形空格間隔。 2 個值可以是尺寸值 (length) 或 % (百分比) 或方位關鍵字 (keywords) ； % 以元素本身的 box 尺寸為百分比計算基準。 使用尺寸值或 % ，依序表示參考點橫座標 (x) 、縱座標 (y) 。 padding-box 的左上角座標為 (0,0) 。 預設值為 50% 50% ；就是在 box 中心點。 使用方位關鍵字 (center, top, right, bottom, left) ，依據字意即可表示方向和位置，所以 2 個值沒有順序問題。 如果省略第 2 個值，會視為 center (50%) 。 適用元素：transformable element。 適用媒體： visual

     • 1. 在 SVG 原始碼中怎麼把一堆東西打包成群？

     iconfont解決了我們以前大量使用小圖示帶來的種種問題，但是也有自身的各種缺陷。比如不支援多色，不同瀏覽器下的表現不同，需要做各種相容等。

     不久的將來iconfont應該會被svg symbol技術替換。本文就是介紹如何在網頁中使用SVG圖示。順帶一提螞蟻金服的Ant.Design已經把方案從原來的字型圖示轉到SVG圖示。

     • 1. 用 SVG 畫出一朵花，有三個花瓣一個花梗
       2. 用 SVG 畫出三朵花，每朵花都有三個花瓣一個花梗
       3. 用 SVG 畫出一個帶漸層色的方塊
       4. 用 SVG 畫一個用放射漸層表示的太陽
       5. 怎麼將紙上的手繪圖拍下來，並展開為平整的電子檔？
       6. 怎麼使用 inkscape 將電子圖檔轉 SVG 向量圖？
       7. 怎麼使用 inkscape 將 SVG 圖多餘的邊切除？
       8. 怎麼對一張點陣圖進行「去背」？(png 檔可去背，jpg 檔無法去背)
       9. 怎麼找一張適合的 ICON ，並且是 SVG 格式的圖？
       10. 怎麼縮小一張 SVG 圖的大小？
       11. 怎麼改變一張 SVG ICON 圖的顏色？
       12. 怎麼將自己修改的 SVG ICON 圖，可以有網址，能讓 HTML 與 Wiki 頁引用？
     • 範例：
     • 英文：