資訊基礎應用/張鈞祺
目錄
圖片
已記住的英文單字
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色
- 井號、星號、等號、中括號;
- 用空白行分段。
例如:
語法 | 顯示 | 說明 |
---|---|---|
#AAA #BBB #CCC |
|
井號 |
*AAA *BBB *CCC |
|
星號 |
*AA *#AA1 *#AA2 *BB *#BB1 *#BB2 |
|
先星後井 |
#AA #*AA1 #*AA2 #BB #*BB1 #*BB2 |
|
先井後星 |
==中標== ===小標=== ====小小標==== =====加粗標===== ======超小標====== |
中標 小標 小小標 加粗標 超小標 |
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制定,是一個開放標準,這是通用的定義
10月31日
停課
11月7日
- 今日練習:
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 的樣式。
- 今日成品:
漸層
- 漸層由一種以上的顏色所組成,由一種顏色慢慢轉成另一種顏色,設定好顏色之後,再以ID的形式給漸層。
- 漸層(又稱為「漸變」)是指將構成元素的形狀或色彩做次第改變的層層變化。例如,同一種形狀的漸大或漸小、同一種色彩的漸濃或漸淡,均屬於漸層的形式變化,而在這些漸增或漸減的層次變化中,即能具現出漸層的美感。
- 漸變的基本原理與反覆相類似,但由於其中或形或色的漸次改變,使得畫面較具活潑性,予人生動輕快的感受。中國建築中的寶塔;樂曲中音量的漸強漸弱;文學小說中情節高潮的堆且;大會舞隊型的漸次縮小或擴大……等,都是漸層形式原理的例子。
11月21日
線性貝茲曲線 給定點P0、P1,線性貝茲曲線只是一條兩點之間的直線。這條線由下式給出:
- <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>
且其等同於線性插值。
- 一次:
二次方貝茲曲線 二次方貝茲曲線的路徑由給定點P0、P1、P2的函數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字型就運用了以貝茲樣條組成的二次貝茲曲線。
- 二次:
三次方貝茲曲線 P0、P1、P2、P3四個點在平面或在三維空間中定義了三次方貝茲曲線。曲線起始於P0走向P1,並從P2的方向來到P3。一般不會經過P1或P2;這兩個點只是在那裡提供方向資訊。P0和P1之間的間距,決定了曲線在轉而趨進P2之前,走向P1方向的「長度有多長」。
- 三次:
四次方貝茲曲線
- 四次:
五次方貝茲曲線
- 五次:
11月28日
- 作業一:
- 作業二:畫出一個矩形、一個弧、一個星形或多邊形。
- 作業三:
- 工具箱:
12月5日
- 鍵盤
指法 | 作用 |
---|---|
Del | 刪除物件 |
Home | 物件升到最上層 |
End | 物件降到最下層 |
PAGE-UP | 物件升到上一層 |
PAGE-DOWN | 物件降到下一層 |
ALT + 滑鼠點擊 | 在不同層的物件中跳動 |
CTRL + B | 顯/隱捲動條 |
CTRL + 方向鍵來 | 垂直/水平捲動畫布 |
CTRL中鍵滾輪 | 拉近、拉遠 |
SHIFT中鍵滾輪 | 水平捲動畫布 |
CTRL右鍵 | 拉近 |
SHIFT右鍵 | 拉遠 |
CTRL + N | 建新檔 |
CTRL + O | 開舊檔 |
ALT + TAB | 檔案間切換 |
CTRL + Z | 回復上一步 |
CTRL + SHIFT + Z | 重做你上一個動作 |
F1~F9 | 工具箱中九個工具 |
F10 | 打開選單 |
F11 | 收放全螢幕 |
F12 | 收放對話框 |
CTRL + Shift + F | 叫用Fill and Stroke對話框 |
Ctrl + Shift + A | 叫用「對齊」對話框 |
選物 + 方向鍵 | 移動2個像素(用SHIFT快10倍) |
選物 + ALT + 方向鍵 | 移動1個像素 |
選物 + <和> | 中心點縮(50%)放(200%) |
選物 + ALT + <和> | 微縮放 |
選物 + [和] | 旋轉15度(加CTRL一次轉90度) |
選物 + ALT + [和] | 微旋轉 |
Shift + 滑鼠點擊 | 選擇/排除選擇(配合範圍選擇)好幾個物件 |
ESC | 取消全部選擇 |
Ctrl + A | 選擇本圖層所有物件 |
CTRL + G | 建立群組 |
CTRL + U | 解散群組 |
CTRL + Shift + G | 解散群組 |
CTRL + 滑鼠點擊 | 選用群組中的物件加以編輯 |
CTRL + Shift + 滑鼠點擊 | 選用群組中的多個物件加以編輯 |
CTRL+F1 | 漸層工具 |
F7 | 吸管 |
Ctrl + D | 複製 |
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日
圖形計算機(二)
- 多項式:
- 基本:
$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,
- 基本:
- 互動式圖形計算機
- 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日
寫筆記