基礎(chǔ)班00php上課進(jìn)度

1、day1：偉大發(fā)明（蒸汽機(jī)，電視，電腦，互聯(lián)網(wǎng)）互聯(lián)網(wǎng)介紹，web 編程介紹，web 前端介紹html 設(shè)計(jì)網(wǎng)頁(yè)基本：表形與表意相結(jié)合。，編輯器，瀏覽器及工具：第一個(gè)網(wǎng)頁(yè)：o world。基本格式。幫助文檔：Html 手冊(cè).字體元素HTML4 參考手冊(cè).，strong b iu sub sup font address big small排版元素p br hr pre blockquote div span h1h6列表元素ul ol li dl dt dd案例：“關(guān)于”，“你要去哪里”補(bǔ)充介紹 xml，xhtml二進(jìn)制原理，字符編碼原理。day2：元素 a link base多元素 img

2、map area object embed表格元素 table tr th td caption thead tbody tfoot案例：“你要去哪里（帶）”，“地圖”表格案例：“課程表”，“參賽選手”day3：表單元素：form input button select option textarea案例：用戶登錄（簡(jiǎn)單），用戶頁(yè)（復(fù)雜）框架元素： frameset frame noframes iframe框架案例：企業(yè)三欄其它元素：style script綜合案例：當(dāng)當(dāng)?shù)卿?day4:html 設(shè)計(jì)目標(biāo)：讓內(nèi)容（包括文字和多）以一定的方式和一定的意義表現(xiàn)出來(lái)。html 的局限：當(dāng)需要呈現(xiàn)相

3、同內(nèi)容形式的時(shí)候，需要重復(fù)寫(xiě)大量的代碼，并且如果需要修改的時(shí)候，還是需要重復(fù)修改大量代碼，非常不靈活。（舉例：多項(xiàng)定義列表）css 出場(chǎng)：使用 css 可以解決上述問(wèn)題（舉例修改）引入案例：詞典（定義列表應(yīng)用）網(wǎng)頁(yè)設(shè)計(jì)的升華：頁(yè)面內(nèi)容與表現(xiàn)分離，內(nèi)容使用基本簡(jiǎn)單，只為表示基本含義與層次結(jié)構(gòu)，表現(xiàn)則使用 css 在另外的位置進(jìn)行設(shè)定。幫助文檔：CSS2.1 中文完全參考手冊(cè).css 基礎(chǔ)：基本語(yǔ)法形式，樣式分類（行內(nèi)，內(nèi)部，外部，導(dǎo)入），選擇器類型（【id，class，tag，通用】，偽類，偽元素，層級(jí)選擇器，分組選擇器），選擇器優(yōu)先級(jí)（行內(nèi)idclasstag通用）講樣式分類使用 2-3 個(gè)文

4、字效果，講選擇器分類使用 2-3 個(gè)效果文字/段落樣式：color, font-size，font-weight，font-family，font-style，line-height，letter-spacing， word-spacing，text-align，text-indent，vertical-align文本與字體樣式屬性案例：信息/參賽選手信息盒子模型基礎(chǔ)：盒子的形狀，盒子的寬高（width，height），盒子的padding，content）盒子基本案例：“30 元現(xiàn)金券等你拿”。盒子案例的局限：并列的盒子怎么辦？引出浮動(dòng)基本做法：左浮，右浮，清除浮動(dòng)：float，width，

5、heigh，案例：浮動(dòng)基本布局色塊頁(yè)：3 行，中間行分左右列。案例：瓜瓜網(wǎng)整體布局（margin，border，day5：盒子模型進(jìn)一步細(xì)化：盒子寬高列表，背景，背景定位，邊框細(xì)化，內(nèi)外邊距，層次關(guān)系。浮動(dòng)細(xì)化：布局的基本原理，浮動(dòng)的特性，清除浮動(dòng)的作用和方法。浮動(dòng)就是讓一個(gè)元素脫離其所在父盒子的正常文檔流，使其“浮”起來(lái)以致父盒子的邊框線框不住自己（但起始位置還是以其所在的位置為起點(diǎn)的）?？雌饋?lái)父盒子的高度中不再會(huì)去自動(dòng)計(jì)算該浮動(dòng)盒子所占據(jù)的高度。Css 其他屬性/高級(jí)特性：列表，定位，偽類案例：呱呱網(wǎng)頭部，導(dǎo)航，公告，banner 圖，呱呱網(wǎng)左邊 3 欄內(nèi)容day6：div 布局深入與總結(jié)

6、：內(nèi)容與表現(xiàn)分離，分塊，整體到局部，標(biāo)準(zhǔn)流與非標(biāo)準(zhǔn)流，絕對(duì)定位，層疊順序，塊元素與行元素的轉(zhuǎn)換。常見(jiàn) bug 及兼容性調(diào)試案例為主：呱呱網(wǎng)其余部分有時(shí)間可補(bǔ)充：inline-block 布局，設(shè)計(jì)一個(gè)新站點(diǎn)（佳能首頁(yè)）day7:javascript 介紹：發(fā)展歷程，代碼形式，運(yùn)行機(jī)制o world 程序，write 和 alert 使用基本語(yǔ)則：一條語(yǔ)句結(jié)束，注釋，區(qū)分大小寫(xiě)，代碼規(guī)范（層次縮進(jìn)）變量，數(shù)據(jù)類型（string, number, null, undefined|object, array）變量名規(guī)則表達(dá)式與運(yùn)算符（算術(shù)，比較，邏輯，位，字符串，賦值，其他），運(yùn)算符的優(yōu)先級(jí)，括號(hào)的

7、使用案例：求三角形的斜邊，一元二次方程根的求解，賦值傳值傳值，字符相加day8：流程控制之分支結(jié)構(gòu)：if，switch，案例：給成績(jī)進(jìn)行評(píng)價(jià)， 顯示幾，流程控制之循環(huán)結(jié)構(gòu)：for，while，do whireak 與 continue，案例：1-100 范圍內(nèi)能被 3 整除的數(shù)的和，1-100 范圍內(nèi)既能被 3 整除又不能被 7 整除的數(shù)有哪些，星號(hào)金字塔，99 乘法表，黑白紅球各多少，函數(shù)：概念，定義，調(diào)用，參數(shù)，返回值，變量作用域，系統(tǒng)內(nèi)部函數(shù)案例：已知 r 求圓的面積；已知兩直角邊求斜邊；已知長(zhǎng)寬是否閏年，表面積；給定年份判斷day9：內(nèi)置對(duì)象：String, Math, Date，Ar

8、ray案例：用戶名只能是字母且不超過(guò) 10 個(gè)；限制用戶上傳文件的類型；隨機(jī)輸出 5 個(gè) 1-100之間的整數(shù)； 跟電腦玩石頭剪子布；1000 天之后是哪一天；到現(xiàn)在為止你活了多少天了？假設(shè) 30 歲你要“功成名就/成名立萬(wàn)/成家立業(yè)”，你還有多少天去奮斗？數(shù)組：概念，定義，取值，賦值，循環(huán)（for 和for in），二維數(shù)組，數(shù)組遍歷，數(shù)組常用方法案例：求一個(gè)整數(shù)數(shù)組的平均值；求一個(gè)整數(shù)數(shù)組中的奇數(shù)的個(gè)數(shù)和偶數(shù)的個(gè)數(shù)；求一個(gè)整數(shù)數(shù)組中的最大值和最小值以及各自的下標(biāo)；交換一個(gè)數(shù)組中最大值和最小值的位置；將一個(gè)整數(shù)數(shù)組的奇數(shù)都乘以 2；將一個(gè)數(shù)組的元素順序“反轉(zhuǎn)”過(guò)來(lái)。案例：求一個(gè) 3 行 4

9、列的二維數(shù)組的平均值及最大值和最小值，并交換其位置，求一個(gè)二維數(shù)組的“周邊元素的和”。day10：對(duì)象介紹：對(duì)象就是一個(gè)具體的“物體”，這個(gè)物體有自己的特性特征特點(diǎn)（屬性）和功能/行為/動(dòng)作（方法）。網(wǎng)頁(yè)中的對(duì)象：html對(duì)象DOM 介紹，htmlDom，Dom 控制網(wǎng)頁(yè)，操作 Dom 對(duì)象的屬性和樣式案例：讓一個(gè) div 變得“面目全非”。事件 event：概念，事件源，事件處理程序，事件名稱，事件對(duì)象瀏覽器差異，事件類型案例：燈泡開(kāi)關(guān)切換案例：網(wǎng)頁(yè)版計(jì)算器（自動(dòng)計(jì)算，onblur）案例：登錄提示：文字，顏色，背景，進(jìn)出邏輯案例：事件鏈：在一個(gè)輸入框中進(jìn)行如下操作并顯示所有經(jīng)歷過(guò)的事件并顯示

10、到 textarea中：鼠標(biāo)進(jìn)入后點(diǎn)擊獲得焦點(diǎn)并輸入一個(gè)字符“a”然后再鼠標(biāo)點(diǎn)擊外部區(qū)域離開(kāi)該輸入框。案例：移動(dòng)瞄準(zhǔn)：onload 的時(shí)候?qū)⒕W(wǎng)頁(yè)的一個(gè)區(qū)域初始化為“黑為瞄準(zhǔn)狀態(tài)并時(shí)刻顯示坐標(biāo)。案例：點(diǎn)出滿天小星星：每點(diǎn)擊一下，就“創(chuàng)建一個(gè) img 對(duì)象”，鼠標(biāo)進(jìn)入后變day11：BOM 介紹，BOM 結(jié)構(gòu)window 對(duì)象：若干方法。其他 window 子對(duì)象：location, history, screen, navigator,案例 1：點(diǎn)擊按鈕彈出小窗 q 口自動(dòng)彈出窗口。案例 2：切換。案例 3：網(wǎng)頁(yè)時(shí)鐘（如果要求時(shí)鐘在一分鐘之后就自動(dòng)停掉，怎么辦？）案例 4：根據(jù)用戶顯示器的分辨率

11、載入不同的網(wǎng)頁(yè)，并根據(jù)用戶使用的瀏覽器不同也給出不同的提示：IE 用戶提示“你 out 了，現(xiàn)在流行火狐呢”，F(xiàn)F 用戶提示“你很時(shí)髦啊，緊跟時(shí)代腳步”day12:網(wǎng)頁(yè) DOM 內(nèi)置對(duì)象：法大全。Element，body，forms，images，links，all，及找對(duì)象的辦擴(kuò)展：table 對(duì)象：table-rows-row-cells-cell。DOM 基礎(chǔ)：含義，結(jié)構(gòu)與層次關(guān)系，節(jié)點(diǎn)（node，對(duì)比：元素，素 1，文本 2，屬性 3），對(duì)象），節(jié)點(diǎn)類型（元常用屬性：ChildNodes，attributes, nodeName, nodeValue, nodeType）,Child,

12、 lastChild, nextSibling, previousSibling, parentNode;常用方法：getribute(), setribute(), hasChildNodes(), createElement(), createTextNode(),appendChild(), removeChild(), insertBefore(), cloneNode(),案例 1：“看你能堅(jiān)持多久”。案例 2：基于 table 的用戶管理系統(tǒng)案例 3：表單驗(yàn)證：當(dāng)當(dāng)?shù)卿洠?dāng)當(dāng)day13：html5 新知識(shí)與應(yīng)用：html5 支持度測(cè)試：htt/test/html5/index.ht

13、ml瀏覽器統(tǒng)計(jì)： http:/data/browser新語(yǔ)義：舉例：http/view/297739.htmfooter，header，nav（純語(yǔ)義 article（文章：外部文章區(qū)），：腳部，頭部，導(dǎo)航），section（分區(qū)，區(qū)塊，文章的“節(jié)”）， aside（邊欄：相關(guān)參考區(qū)），details（詳細(xì)內(nèi)容：與 summary 配合，表示顯示的“概要/標(biāo)題”，點(diǎn)擊打開(kāi)關(guān)閉內(nèi)容），hgroup（標(biāo)題組：對(duì)標(biāo)題time（時(shí)間或日期，純語(yǔ)義）進(jìn)行組合），與資源：audio（聲音：mp3, ogg, wav），（：ogg, mpeg4）source（為 audio 和定義資源），embed（嵌入內(nèi)

14、容，外部插件），功能性：mark（標(biāo)記文字，突出顯示）， progress（進(jìn)度條），新表單元素：input type=”date/datetime/url/number/time/range/k”datalist（數(shù)據(jù)列表：表示可選數(shù)據(jù)表，配合 inputtext使用，設(shè)置其 list=”xxid”），output（輸出區(qū)，語(yǔ)義性質(zhì)，表現(xiàn)類似 span，但作為表單使，當(dāng)然可以上傳到 server），新屬性：hidden,contenteditable，placeholder本地：window.localStorage.lastname=Smith;/localStorage.setItem(

15、lastname, smith);/localStorage.setItemlastname=smith;sesStorage.lastname=John;：var v1 = localStorage.lastname，localStoragelastname，localStorage.getItem(lastname”);sesStorage.lastname，sesStorage lastname，sesStorage.getItem(“l(fā)astname”);清除： localStorage.removeItem(“l(fā)astname”)；localStorage.clear();canva

16、s（畫(huà)布），畫(huà)布應(yīng)用：.geementI (canvas1); /畫(huà)布對(duì)象canvas1 =cntxt = canvas1.getContext(2d); /畫(huà)布對(duì)象上的“畫(huà)筆”，所有圖形都用它“畫(huà)”出來(lái)/畫(huà)線cntxt.moveTo(20,20);/將畫(huà)筆移動(dòng)到某點(diǎn) cntxt.strokeStyle = #ff0000; /設(shè)置畫(huà)筆填充樣式 cntxt.lineWidth = 3;/設(shè)置線寬cntxt.lineTo(100,50);/畫(huà)到點(diǎn) 100，50 cntxt.lineTo(50,100);/再畫(huà)到點(diǎn) 50，100/畫(huà)線cntxt.stroke();/畫(huà)矩形圖案：cntxt.stro

17、keStyle = rgb(255,0,0); /填充色cntxt.strokeRect(350,20,50,30);/畫(huà)矩形框：左上角位置，寬高cntxt.fillStyle = rgb(255,0,0);/填充色cntxt.fillRect(110,20,150,100);/畫(huà)矩形塊：左上角位置，寬高cntxt.clearRect(120,40,60,60);/“挖矩形塊”：左上角位置，寬高繪制路徑：就是連續(xù)畫(huà)一些線，然后最后會(huì)將第一根的起始和最后一根線的末尾連起來(lái)成為閉合的區(qū)塊并可以將其填充顏色或其他beginPath()/開(kāi)始路徑。cntxt.moveTo(320,300); /將畫(huà)筆

18、定位到某處，此時(shí)還可以設(shè)置畫(huà)筆的顏色，粗細(xì)lineTo(x,y);/或 arc(x, y, radius, startAngle, endAngle,lockwise)。/畫(huà)一系列線closePath()/關(guān)閉路徑，實(shí)際就是使用當(dāng)前線形自動(dòng)將首尾連接/或 fill()；/畫(huà)線或填充stroke()/繪制圓?。篶ntxt.arc(x, y, radius, startAngle, endAngle,lockwise)/圓心坐標(biāo) x，y，半徑，起始角度（弧度），終止角度（弧度），順/逆(false/true)時(shí)針）/弧度指以圓心為原點(diǎn)，以 x 方向?yàn)槠鹗季€，順時(shí)針?lè)较虻慕嵌龋ɑ《龋ヾay14-day15：呱呱網(wǎng)首頁(yè)：html+css+js 的綜合應(yīng)用 當(dāng)當(dāng)網(wǎng)動(dòng)態(tài)效果：html+css+js 綜合應(yīng)用day16：系統(tǒng)模式（單機(jī)，CS/模式，BS/模式）網(wǎng)絡(luò)原理（ip，dns，hosts 文件）