檢視資訊基礎應用/張鈞祺的原始碼

[[分類:資訊基礎應用]]


====圖片====
<!--[[File:Piranha face.jpg|203px]]-->
<img src='https://upload.wikimedia.org/wikipedia/commons/thumb/7/74/Piranha_face.jpg/203px-Piranha_face.jpg' />

===已記住的英文單字=== 
table	table	表
 
row	tr	列

diamond	td	格

hyper	html	超

text	html	文字，文件

markup	html	標記

languagehtml	語言

head	head	頭

title	title	標題

body	body	身體

rowspan

colspan

===9月12日===
練習.今天學到如何建立"筆記頁"

用字母調出光的三原色red green blue

紅 # foo

綠 # ofo

藍 # oof

白 # fff

黑 # ooo

使用table、td、tr來製做基本表格。製做同學基本資料

===9月19日===

屬性值

設定HTML表格的字體、顏色、大小、粗細、高度 、寬度等。

顏色table,td {border:     solid 1px;}。

{border:顏色深淺#16ef dashed 表格粗細16px;}。

高度 rowspan。

寬度colspan。

Cascading Style Sheets(簡寫CSS）的用途是什麼

===9月26日===

*

#png不失真 公開格式
#jpg jepg 失真 壓縮
#gif可動畫 只有256色



*井號、星號、等號、中括號；
*用空白行分段。
例如：
<table class=nicetable>
<tr><th>語法</th><th>顯示</th><th>說明</th></tr>
<tr>
<th><pre>
#AAA
#BBB
#CCC
</pre></th>
<th>
#AAA
#BBB
#CCC
</th>
<th>井號</th>
</tr>
<tr>
<th><pre>
*AAA
*BBB
*CCC
</pre></th>
<th>
*AAA
*BBB
*CCC
</th>
<th>星號</th>
</tr>
<tr>
<td><pre>
*AA
*#AA1
*#AA2
*BB
*#BB1
*#BB2
</pre></td>
<td>
*AA
*#AA1
*#AA2
*BB
*#BB1
*#BB2
</td>
<th>先星後井</th>
</tr>
<tr>
<td><pre>
#AA
#*AA1
#*AA2
#BB
#*BB1
#*BB2
</pre></td>
<td>
#AA
#*AA1
#*AA2
#BB
#*BB1
#*BB2
</td>
<th>先井後星</th>
</tr><tr>
<td><pre>
==中標==
===小標===
====小小標====
=====加粗標=====
======超小標======
</pre></td>
<td>
<p style='font-size:150%;border-bottom:1px solid #aaa;'>中標</p>
<p style='font-size:132%;font-weight:bold;'>小標</p>
<p style='font-size:116%;font-weight:bold;'>小小標</p>
<p style='font-size:100%;font-weight:bold;'>加粗標</p>
<p style='font-size:80%;font-weight:bold;'>超小標</p>
</td>
</table>

===10月3日===
履歷表
自我介紹
http://6years.jendo.org/~%E5%BC%B5%E9%88%9E%E7%A5%BA/TesT.html

===10月17日===
寫HTML>用WORD讀>存DOCX或PDF>去7-11列印 markup 提供指示 XML想要 標籤的人自己發明標籤 二十個就夠了 不夠記 微軟的規格 不會重複
<>是標籤
HTML4之前不行
HTML5才可以
帶META指令
BODY外面做定義
BODY中做顯示部份
黑盒子
margin(邊沿)：
margin:上 右 下 左;　margin:上下 左右;　margin:上 左右 下;　margin:四個邊同樣値;
padding(內距)：
padding:auto;：讓瀏覽器自己去設定
padding:%;：讓瀏覽器自己去設定，跟邊界元素有關。兩者不建議使用。
padding:上 右 下 左;　padding:上下 左右;　padding:上 左右 下;　padding:四個邊同樣値;
border(邊框)：
顏色
紅紅綠綠藍藍
紅綠藍

===10月24日===
*svg放大不毛邊
*用程式碼構成一張圖
*步驟
*#宣告格式(版本 字格式 是否獨立存在)
*#SVG開始(格式、長寬)
*#SVG結束
*今日學會使用
**polyline
**polygon
**circle(作業小熊)




<circle cx='200' cy='400' r='140' style='fill: #FFFF00;stroke:black;stroke-width:2;fill-opacity:1'/> 
<circle cx='200' cy='400' r='110' style='fill: #EEFFBB;stroke:black;stroke-width:2;fill-opacity:1'/> 

 
  <circle cx='120' cy='120' r='60' style='fill: #FFFF00;stroke:black;stroke-width:2;fill-opacity:1'/>
  <circle cx='280' cy='120' r='60' style='fill: #FFFF00;stroke:black;stroke-width:2;fill-opacity:1'/>
  <circle cx='120' cy='120' r='40' style='fill:#DDAA00 ;stroke:black;stroke-width:2;fill-opacity:1'/>
  <circle cx='280' cy='120' r='40' style='fill:#DDAA00 ;stroke:black;stroke-width:2;fill-opacity:1'/>
  <circle cx='200' cy='200' r='120' style='fill: #FFFF00;stroke:black;stroke-width:2;fill-opacity:1'/>
  
  <circle cx='150' cy='180' r='12' style='fill:black;stroke:black;stroke-width:2;fill-opacity:1'/>
  <circle cx='250' cy='180' r='12' style='fill:black;stroke:black;stroke-width:2;fill-opacity:1'/>
   	#0000FF 
  <circle cx='150' cy='181' r='5' style='fill:#0000FF;stroke:black;stroke-width:2;fill-opacity:1'/>
  <circle cx='250' cy='181' r='5' style='fill:#0000FF;stroke:black;stroke-width:2;fill-opacity:1'/>
   	
  <circle cx='200' cy='240' r='50' style='fill:#FFFFBB;stroke:black;stroke-width:2;fill-opacity:1'/>
  <circle cx='200' cy='213' r='10' style='fill:black;stroke:black;stroke-width:2;fill-opacity:1'/>
  <circle cx='200' cy='256' r='25' style='fill:#FF0000;stroke:black;stroke-width:2;fill-opacity:1'/>
  
<ellipse cx='120'cy='395' rx='60' ry='40' style='fill: #FFFF00;stroke:black;stroke-width:2;fill-opacity:1'/> 
<ellipse cx='280'cy='395' rx='60' ry='40' style='fill: #FFFF00;stroke:black;stroke-width:2;fill-opacity:1'/> 
<circle cx='175' cy='395' r='25'  style='fill: #FFFF00;stroke:black;stroke-width:2;fill-opacity:1'/> 
<circle cx='225' cy='395' r='25'  style='fill: #FFFF00;stroke:black;stroke-width:2;fill-opacity:1'/> 

</svg>
**小熊由16個圓和2個橢圓組成
什麼是SVG
可縮放向量圖形（英語：Scalable Vector Graphics，SVG）是一種基於可延伸標記式語言（XML），用於描述二維向量圖形的圖形格式。SVG由W3C制定，是一個開放標準，這是通用的定義
<img src='http://6years.jendo.org/~%E5%BC%B5%E9%88%9E%E7%A5%BA/ring.sug.html' />

===10月31日===
停課

===11月7日===

*今日練習：
<img src='http://6years.jendo.org/~%E5%BC%B5%E9%88%9E%E7%A5%BA/%E5%B0%8F%E8%8A%B1.svg' />
====SVG編寫製做====
*1：開啟fielzilla，連線至站台
*2：home>www>SVG，在這個資料夾中，建立新檔案。
*3：命名為：flower(記得要加入副檔名.svg)
*4：寫入程式碼。

===11月14日===
====線形漸層====
*可固定Y或X來達到向下或向左的漸層
*用polygon points畫出箭頭，用漸層的ID來引入
*offset屬性用來定義漸層的開始和結束位置，其 100% 是指整個漸層範圍。
*stop-color 屬性用來定義顏色，也可以做為 style 的樣式。
*stop-opacity 屬性決定透明度，也可以做為 style 的樣式。
*今日成品：
<img src ="http://6years.jendo.org/~%E5%BC%B5%E9%88%9E%E7%A5%BA/water3.svg">
=====漸層=====
*漸層由一種以上的顏色所組成，由一種顏色慢慢轉成另一種顏色，設定好顏色之後，再以ID的形式給漸層。
*漸層(又稱為「漸變」)是指將構成元素的形狀或色彩做次第改變的層層變化。例如，同一種形狀的漸大或漸小、同一種色彩的漸濃或漸淡，均屬於漸層的形式變化，而在這些漸增或漸減的層次變化中，即能具現出漸層的美感。
*漸變的基本原理與反覆相類似，但由於其中或形或色的漸次改變，使得畫面較具活潑性，予人生動輕快的感受。中國建築中的寶塔；樂曲中音量的漸強漸弱；文學小說中情節高潮的堆且；大會舞隊型的漸次縮小或擴大……等，都是漸層形式原理的例子。

===11月21日===

'''線性貝茲曲線''' 
給定點'''P'''<sub>0</sub>、'''P'''<sub>1</sub>，線性貝茲曲線只是一條兩點之間的直線。這條線由下式給出：

:<math>\mathbf{B}(t)=\mathbf{P}_0 + (\mathbf{P}_1-\mathbf{P}_0)t=(1-t)\mathbf{P}_0 + t\mathbf{P}_1 \mbox{ , } t \in [0,1]</math>
且其等同於線性插值。
#一次：<img src='https://upload.wikimedia.org/wikipedia/commons/0/00/B%C3%A9zier_1_big.gif' width='240px' height='*' />

'''二次方貝茲曲線'''
二次方貝茲曲線的路徑由給定點'''P'''<sub>0</sub>、'''P'''<sub>1</sub>、'''P'''<sub>2</sub>的函數'''B'''（''t''）追蹤：
: <math>\mathbf{B}(t) = (1 - t)^{2}\mathbf{P}_0 + 2t(1 - t)\mathbf{P}_1 + t^{2}\mathbf{P}_2 \mbox{ , } t \in [0,1]</math>。

TrueType字型就運用了以貝茲樣條組成的二次貝茲曲線。

#二次：<img src='https://upload.wikimedia.org/wikipedia/commons/3/3d/B%C3%A9zier_2_big.gif' width='240px' height='*' />　<img src='https://upload.wikimedia.org/wikipedia/commons/6/6b/B%C3%A9zier_2_big.svg' width='240px' height='*' />

'''三次方貝茲曲線'''
'''P'''<sub>0</sub>、'''P'''<sub>1</sub>、'''P'''<sub>2</sub>、'''P'''<sub>3</sub>四個點在平面或在三維空間中定義了三次方貝茲曲線。曲線起始於'''P'''<sub>0</sub>走向'''P'''<sub>1</sub>，並從'''P'''<sub>2</sub>的方向來到'''P'''<sub>3</sub>。一般不會經過'''P'''<sub>1</sub>或'''P'''<sub>2</sub>；這兩個點只是在那裡提供方向資訊。'''P'''<sub>0</sub>和'''P'''<sub>1</sub>之間的間距，決定了曲線在轉而趨進'''P'''<sub>2</sub>之前，走向'''P'''<sub>1</sub>方向的「長度有多長」。

#三次：<img src='https://upload.wikimedia.org/wikipedia/commons/d/db/B%C3%A9zier_3_big.gif' width='240px' height='*' />　<img src='https://upload.wikimedia.org/wikipedia/commons/8/89/B%C3%A9zier_3_big.svg' width='240px' height='*' />

'''四次方貝茲曲線''' 
#四次：<img src='https://upload.wikimedia.org/wikipedia/commons/a/a4/B%C3%A9zier_4_big.gif' width='240px' height='*' />　<img src='https://upload.wikimedia.org/wikipedia/commons/b/bf/B%C3%A9zier_4_big.svg' width='240px' height='*' />

'''五次方貝茲曲線''' 
#五次：<img src='https://upload.wikimedia.org/wikipedia/commons/0/0b/BezierCurve.gif' width='240px' height='*' />

===11月28日===
*作業一：

*作業二：畫出一個矩形、一個弧、一個星形或多邊形。
*作業三：<img src ="http://6years.jendo.org/~%E5%BC%B5%E9%88%9E%E7%A5%BA/%E6%81%90%E9%BE%8D.svg">
*工具箱：

===12月5日===
*鍵盤
<table class=nicetable>
<tr><th>指法</th><th>作用</th></tr>
<tr><td>Del</td><td>刪除物件</td></tr>
<tr><td>Home</td><td>物件升到最上層</td></tr>
<tr><td>End</td><td>物件降到最下層</td></tr>
<tr><td>PAGE-UP</td><td>物件升到上一層</td></tr>
<tr><td>PAGE-DOWN</td><td>物件降到下一層</td></tr>
<tr><td>ALT + 滑鼠點擊</td><td>在不同層的物件中跳動</td></tr>
<tr><td>CTRL + B</td><td>顯/隱捲動條</td></tr>
<tr><td>CTRL + 方向鍵來</td><td>垂直/水平捲動畫布</td></tr>
<tr><td>CTRL中鍵滾輪</td><td>拉近、拉遠</td></tr>
<tr><td>SHIFT中鍵滾輪</td><td>水平捲動畫布</td></tr>
<tr><td>CTRL右鍵</td><td>拉近</td></tr>
<tr><td>SHIFT右鍵</td><td>拉遠</td></tr>
<tr><td>CTRL + N</td><td>建新檔</td></tr>
<tr><td>CTRL + O</td><td>開舊檔</td></tr>
<tr><td>ALT + TAB</td><td>檔案間切換</td></tr>
<tr><td>CTRL + Z</td><td>回復上一步</td></tr>
<tr><td>CTRL + SHIFT + Z</td><td>重做你上一個動作</td></tr>
<tr><td>F1~F9</td><td>工具箱中九個工具</td></tr>
<tr><td>F10</td><td>打開選單</td></tr>
<tr><td>F11</td><td>收放全螢幕</td></tr>
<tr><td>F12</td><td>收放對話框</td></tr>
<tr><td>CTRL + Shift + F</td><td>叫用Fill and Stroke對話框</td></tr>
<tr><td>Ctrl + Shift + A</td><td>叫用「對齊」對話框</td></tr>
<tr><td>選物 + 方向鍵</td><td>移動2個像素(用SHIFT快10倍)</td></tr>
<tr><td>選物 + ALT + 方向鍵</td><td>移動1個像素</td></tr>
<tr><td>選物 + &lt;和&gt;</td><td>中心點縮(50%)放(200%)</td></tr>
<tr><td>選物 + ALT + &lt;和&gt;</td><td>微縮放</td></tr>
<tr><td>選物 + [和]</td><td>旋轉15度(加CTRL一次轉90度)</td></tr>
<tr><td>選物 + ALT + [和]</td><td>微旋轉</td></tr>
<tr><td>Shift + 滑鼠點擊</td><td>選擇/排除選擇(配合範圍選擇)好幾個物件</td></tr>
<tr><td>ESC</td><td>取消全部選擇</td></tr>
<tr><td>Ctrl + A</td><td>選擇本圖層所有物件</td></tr>
<tr><td>CTRL + G</td><td>建立群組</td></tr>
<tr><td>CTRL + U</td><td>解散群組</td></tr>
<tr><td>CTRL + Shift + G</td><td>解散群組</td></tr>
<tr><td>CTRL + 滑鼠點擊</td><td>選用群組中的物件加以編輯</td></tr>
<tr><td>CTRL + Shift + 滑鼠點擊</td><td>選用群組中的多個物件加以編輯</td></tr>
<tr><td>CTRL＋F1</td><td>漸層工具</td></tr>
<tr><td>F7</td><td>吸管</td></tr>
<tr><td>Ctrl + D</td><td>複製</td></tr>
</table>

===12月13日===
===12月20日===
===12月27日===
===1月2日===
圖形計算機(一)
*基本圖紙：
*#圖寬：$draw->W，預設601。
*#圖高：$draw->H，預設401。
*#原點距左上角：$draw->x0,$draw->y0，預設(200,200)。
*#x每單位幾點：$draw->xu，預設15。
*#y每單位幾點：$draw->yu，預設15。
*#x每幾單位畫一個刻度：$draw->xGraduate，預設1。
*#y每幾單位畫一個刻度：$draw->yGraduate，預設1。
*#x每幾刻度標示一數字：$draw->xScale，預設1。
*#y每幾刻度標示一數字：$draw->yScale，預設1。
*#秀出直角座標系：$draw->coordinate，預設1。
*#函式描點密度：$draw->pointDensity，預設20。
*#函式取樣點：$draw->xs，預設'-1;0;1';
*基本圖：$draw->圖形[]=array(array(…),其他屬性);
*#多邊形：$draw->polygons[]=array('points'=>array(array(×,×),array(×,×),array(×,×)),'width'=>'線寬');
*#線段：$draw->lineSegments[]=array(array(×,×),array(×,×),'color'=>'顏色','dash'=>'5 5');
*#字：$draw->alnums[]=array(array(×,×),'word'=>'字');
*#圓：$draw->circles[]=array(array(×,×),'radius'=>半徑,'fill'=>'顏色','fill-opacity'=>'1');，預設半徑3。
*#楕圓：$draw->ellipses[]=array(array(×,×),'rx'=>x半軸,'ry'=>y半軸,'color'=>'顏色');
*#弧：$draw->arcs[]=array(array(×,×),array(×,×),'rx'=>x半軸,'ry'=>y半軸,'color'=>'顏色','arrowEnd'=>1);

===1月9日===
圖形計算機(二)

*多項式：
*#基本：<br/>$draw->functions[]=array('functionName'=>'polynomialEquation','argument'=>array(×,×,×,…),'color'=>'red');
*#$draw->xs='×;×;×;…';：各點 x 值。
*#標y值：在functions[]中加'xToy'=>$draw->xs,
*#標點：在functions[]中加'x2y'=>$draw->xs,
*#斜率：在functions[]中加'tangentPoint'=>$draw->xs,
*#面積：在functions[]中加'area'=>$draw->xs,
*[http://6years.jendo.org/~丁志仁/svg/polynomialEquationIn.php 互動式圖形計算機]
*[https://www.google.com.tw/search?q=1/((1-(x/300000)^2)^(1/2))，(1-(x/300000)^2)^(1/2) google圖形計算機]

====涵式表示====
    function test(){
    alert("這個網頁有毒")
    }
    test();

====涵式====
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="utf=8"></meta>
    <title>Javascript</title>
    <script type="text/javascript">
    function test(message){
    alert(message)
    }
    test("你受到不明病毒感染");
    test("WINDOWS系統將關閉");
 test("DSJFDSFAJPFJSAOITAEWORUEWPOOCKSADOFJKDSLKFJDKSPLFAJLFJSALDFFIDSFAOI;LKFASSSFLSAFKLSFDLAKSJFDSLKFJSDLKDSAFLDSJSLJFD;J;KJDSJ;FDSJ;;KJDSF;J;JFDS;J;JFDS;JFDFD;J;JF;LJF;LJFD;JFJ;FD;LD;JFJODIJREIUT09UFDIFDJLKKJDSFJKLFKJKJJFDSJFLKJDSLKJ;F;JDJFDJKFDJ;K");
    </script>
    </head>
    <body> 
    </body>
    </html>

====多項式====

===1月16日===
'''寫筆記'''

===1月23日===
'''寫筆記'''








==1 環境以工具==
====1.1 一、環境====
====1.2 二、工具與設定====
'''firefox

firefox優點  

 1. 不容易中毒
 
 2. 有精選網站功能


firefox缺點
 
 1. 沒有自己的搜尋引擎
 
 2. 歷史紀錄資料不好找'''

filezilla
EmEditor

==2 HTML與HTTP==

'''HTTP

HTTP的發展是由提姆·柏內茲-李於1989年在歐洲核子研究組織（CERN）所發起

HTML

HTML的首個公開描述出現於一個名為「HTML標籤」的檔案中，由提姆·柏內茲-李於1991年底提及'''

==3 wiki==
<table class=nicetable>
<tr><th>語法</th><th>顯示</th><th>說明</th></tr>
<tr>
<th><pre>
#AAA
#BBB
#CCC
</pre></th>
<th>
#AAA
#BBB
#CCC
</th>
<th>井號</th>
</tr>
<tr>
<th><pre>
*AAA
*BBB
*CCC
</pre></th>
<th>
*AAA
*BBB
*CCC
</th>
<th>星號</th>
</tr>
<tr>
<td><pre>
*AA
*#AA1
*#AA2
*BB
*#BB1
*#BB2
</pre></td>
<td>
*AA
*#AA1
*#AA2
*BB
*#BB1
*#BB2
</td>
<th>先星後井</th>
</tr>
<tr>
<td><pre>
#AA
#*AA1
#*AA2
#BB
#*BB1
#*BB2
</pre></td>
<td>
#AA
#*AA1
#*AA2
#BB
#*BB1
#*BB2
</td>
<th>先井後星</th>
</tr><tr>
<td><pre>
==中標==
===小標===
====小小標====
=====加粗標=====
======超小標======
</pre></td>
<td>
<p style='font-size:150%;border-bottom:1px solid #aaa;'>中標</p>
<p style='font-size:132%;font-weight:bold;'>小標</p>
<p style='font-size:116%;font-weight:bold;'>小小標</p>
<p style='font-size:100%;font-weight:bold;'>加粗標</p>
<p style='font-size:80%;font-weight:bold;'>超小標</p>
</td>
<th>段落標題，等號多標題小</th>
</tr>
<tr>
<td><pre>
=大標=
</pre></td>
<td>
<p style='font-size:188%;border-bottom:1px solid #aaa;'>大標</p>
</td>
<th>請不要用，這是留<br/>給議程題目用的。</th>
</tr>
<tr>
<td><pre>
[http://jendo.org 振鐸網站]
格式：[URL 連結說明]
</pre></td>
<th>
[http://jendo.org 振鐸網站]
</th>
<th>外部連結：一層中<br/>括號包著 URL，空<br/>白後放連結說明。</th>
</tr>
<tr>
<td><pre>
[[首頁|這是首頁]]
格式：[[頁面名稱|連結說明]]
中括號內也可只寫頁面名稱
</pre></td>
<th>
[[首頁|這是首頁]]
</th>
<th>內部連結：兩層中括<br/>號包著「頁名」，豎<br/>槓(|)後放連結說明。</th>
</tr>
<tr>
<td><pre>
[[檔案:Go top.gif]]
格式：[[檔案:檔名|圖長|圖寬|…]]
</pre></td>
<th>
[[檔案:Go top.gif]]
</th>
<th>
插入圖照也是內部連結<br/>
。所以請先上傳圖照。<br/>
請勿非法上傳圖照。</th>
</tr>
</table>
<!--
<tr>
<th><pre>
</pre></th>
<th>
</th>
<th></th>
</tr>
</table>
-->

==4 CSS==
==5 SVG==
====5.1 一、概述====
'''1：開啟fielzilla，連線至自己的站台管理員''' 

'''2：home>www>SVG，在這個資料夾中，建立新檔案。'''

'''3：命名，然後記得要加入副檔名.svg'''

'''4：寫入程式碼。'''

====5.2 二、基本架構====


<pre><?xml version='1.0' encoding='UTF-8' standalone='no'?>
<svg xmlns='http://www.w3.org/2000/svg' version='   ' width='  ' height='  '>
	


&lt;</svg></pre>

====5.3 三、文字====
svg文字範例

<img src ="http://6years.jendo.org/~%E5%BC%B5%E9%88%9E%E7%A5%BA/%E5%BC%B5%E9%88%9E%E7%A5%BA.svg">

內碼

<pre><?xml version='1.0' encoding='UTF-8' standalone='no'?>
<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='130' height='90'>
	&lt;<text x='40' y='50' style='font-family:kaiti;fill:#00ff00'>張</text>
        &lt;<text x='55' y='50' style='font-family:kaiti;fill:#ff0000'>鈞</text>
        &lt;<text x='70' y='50' style='font-family:kaiti;fill:#0000ff'>祺</text>

&lt;</svg></pre>

====5.4 四、位移、旋轉、縮放、歪斜====
====5.5 五、群組====
====5.6 六、定義一次，引用多次====
====5.7 七、漸層====
====5.7.1 (一)線性漸層====

<img src ="http://6years.jendo.org/~%E5%BC%B5%E9%88%9E%E7%A5%BA/%E8%97%8D%E7%B6%A0.svg">

<pre><?xml version='1.0' encoding='UTF-8' standalone='no'?>
<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='500' height='500'>
<defs>
	<linearGradient id='LG' x1='50%' y1='0%' x2='0%' y2='50%'>
		<stop offset='0%' style='stop-color:#00FF00;stop-opacity:1' />
		<stop offset='100%' style='stop-color:#00FFFF;stop-opacity:1' />
	</linearGradient>
</defs>
<rect width='500' height='500' x='0' y='0' stroke='red' fill='url(#LG)' />

&lt;</svg></pre>

====5.7.2 (二)放射漸層====
<img src ="http://6years.jendo.org/~%E5%BC%B5%E9%88%9E%E7%A5%BA/%E7%B1%83%E7%90%83.svg">


<pre><?xml version='1.0' encoding='UTF-8' standalone='no'?>
<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='750' height='750'>
<defs>
	<radialGradient id='r2' cx='50%' cy='50%' r='50%'>
		<stop offset='0%' stop-color='#99FFFF'></stop>
		<stop offset='30%' stop-color='#66FFFF'></stop>
		<stop offset='70%' stop-color=' #5599FF '></stop>
		<stop offset='100%' stop-color='#0000FF'></stop>
	</radialGradient>
</defs>
<circle cx='200' cy='200' r='200' fill='url(#r2)'/>

&lt;</svg></pre>

====5.8 八、柔焦濾鏡====
====5.9 九、path====
====5.10 十、動畫====

==6 Inkscape==
Inkscape是一套向量圖形編輯器，以自由軟體授權發布與使用。該軟體的開發目標是成為一套強力的繪圖軟體，且能完全遵循與支援XML、SVG及CSS等開放性的標準格式。Inkscape是一套跨平台性的應用程式，Windows、Mac OS X、Linux及類UNIX版等作業系統。

<img src ="http://6years.jendo.org/~%E5%BC%B5%E9%88%9E%E7%A5%BA/%E6%81%90%E9%BE%8D.svg">

==7 GIS==
'''GIS基本指令'''

<pre><meta content='text/html;charset=utf-8' http-equiv='Content-Type'>
<script type='text/javascript' src='http://maps.google.com/maps/api/js?sensor=false'></script>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js'></script>
<script type='text/javascript' src='http://www.pittss.lv/jquery/gomap/js/jquery.gomap-1.3.3.min.js'></script>
<script>
$(function(){
	$('#map').goMap({
		zoom:17,
		markers:[

		],
	}); 
});
</script>
&lt;<div align=center id='map' style='height:550px; width:900px;'>239新北市鶯歌區永明街58號</div></pre>

==8 圖形計算機==
PHP是一種開源的通用電腦手稿語言，尤其適用於網路開發並可嵌入HTML中使用。PHP的語法借鑑吸收C語言、Java和Perl等流行電腦語言的特點，易於一般程式設計師學習。PHP的主要目標是允許網路開發人員快速編寫動態頁面，但PHP也被用於其他很多領域。
PHP最初是由勒多夫在1995年開始開發的；現在PHP的標準由the PHP Group維護。PHP以PHP License作為許可協議，不過因為這個協議限制了PHP名稱的使用，所以和開放原始碼許可協議GPL不相容