梅竹典藏并推薦 好友春天沒來專著
潛心研學(xué),不負老師一片慈心善賜。
克己敬業(yè),回報圣賢滿腔仁愛厚德。
——梅竹題記
“代碼入門教程”目錄
章節(jié)
標(biāo) 題
內(nèi) 容 簡 介
前言前言略
第一章
代碼基礎(chǔ)知識
略
1/1
認識撰寫文章處的兩種頁面“文字圖片編輯頁面”與“代碼編輯頁面”
1/2
什么是代碼認識代碼、認識標(biāo)簽。
1/3
怎樣學(xué)代碼有信心、有恒心、講究方法。
1/4
標(biāo)簽認識標(biāo)簽、認識屬性與屬值。
1/5
常用標(biāo)簽認識11種常用標(biāo)簽
1/6
文字標(biāo)簽文字標(biāo)簽語法及屬性屬值表示方法
1/7
圖片標(biāo)簽圖片標(biāo)簽語法、修改圖片規(guī)格等內(nèi)容
1/8
移動標(biāo)簽移動標(biāo)簽語法及屬性屬值
1/9
鏈接標(biāo)簽鏈接標(biāo)簽語法及鏈接標(biāo)簽的重要性
1/10
表格標(biāo)簽表格的一套標(biāo)簽以及邊框線樣式
1/11
多媒體標(biāo)簽多媒體標(biāo)簽語法及屬性屬值解析
1/12
其它標(biāo)簽介紹8種常用標(biāo)簽
1/13
CSS樣式簡單介紹css樣式
第二章
標(biāo)簽應(yīng)用
略
2/1
文字標(biāo)簽的應(yīng)用文章標(biāo)簽語法及標(biāo)簽舉例
2/2
移動文字(1)各種移動方向與移動速度的效果
2/3
移動文字(2)原地跳動與隔字跳動的文字
2/4
移動文字(3)橫排版與豎排版的單字移動
2/5
移動文字(4)并排移動、相背而行、相對而行、中間向兩邊移動、左右移動、上下合并六種移動文字。
2/6
移動文字(5)向“右上、左上、右下、左下”移動及走走停停的移動文字。
2/7
移動文字(6)跳著走、曲線移動、左右搖擺、波浪式、橫排向上、豎排向右文字。
2/8
移動文字(7)表格中向左右移動、上下合并、向上下左右移動的文字與文字頂圖。
2/9
移動圖片(1)向左、向右、向上、向下、左右來回走的圖片。
2/10
移動圖片(2)原地跳動、隔圖跳動、單圖橫排移動、單圖豎排移動的圖片。
2/11
移動圖片(3)相背而行、相對而行、左右搖擺的圖片。
2/12
移動圖片(4)左下到右上、右下到左上、左上到右下、右上到左下的圖片。
2/13
移動圖片(5)向右上和左上合并、向左上和右上分開、多圖片分割移動的圖片。
2/14
移動圖片(6)四種展開再消失的圖片
2/15
移動圖片(7)交替展示的圖片與圖片圍繞圖片轉(zhuǎn)
2/16
移動圖片(8)兩種交替展示的圖片與“圖中圖移動圖”
2/17
移動圖片(9)普通圖片頂圖、翻轉(zhuǎn)圖片頂圖與動畫圖片頂圖
2/18
移動圖片(10)整篇文章頁面的移動
2/19
鏈接標(biāo)簽的應(yīng)用(1)文字鏈接方式 圖片鏈接方式與文章地址鏈接方式
2/20
鏈接標(biāo)簽的應(yīng)用(2)純文字鏈接模塊 移動文字鏈接模塊與表格中的移動文字鏈接模塊
2/21
鏈接標(biāo)簽的應(yīng)用(3)多個圖片的鏈接(3種)表格中圖文混排的鏈接(2 種)
2/22
鏈接標(biāo)簽的應(yīng)用(4)點擊小圖觀看大圖、點擊地址觀看動畫圖片與文章內(nèi)部的鏈接。
2/23
多媒體標(biāo)簽應(yīng)用(1)認識多媒體標(biāo)簽、怎樣使用動畫地址與、應(yīng)用動畫制作小模塊。
2/24
多媒體標(biāo)簽應(yīng)用(2)用動畫圖片制作頂圖、裝飾普通圖片、把動畫圖片插入邊框中。
2/25
表格標(biāo)簽應(yīng)用(1)認識表格的一套標(biāo)簽、認識單元格、認識邊框線、認識間距與邊距、認識列的合并與行的合并。
2/26
表格標(biāo)簽應(yīng)用(2)認識多重表格、設(shè)置多重表格、設(shè)置背景顏色與背景圖片、在表格的“列標(biāo)簽”中設(shè)置屬性等四個方面的內(nèi)容。
2/27
表格標(biāo)簽應(yīng)用(3)在表格中設(shè)置插圖、設(shè)置背景音樂、設(shè)置自定義鼠標(biāo)指針樣式。
2/28
表格標(biāo)簽應(yīng)用(4)“表格最外圍邊框線的設(shè)置”和“表格內(nèi)部邊框線的設(shè)置”。
2/29
定位標(biāo)簽應(yīng)用(1)常用的四種定位標(biāo)簽、對齊方式在段落標(biāo)簽塊區(qū)標(biāo)簽表格標(biāo)簽中的應(yīng)用、css的絕對定位與相對定位。
2/30
定位標(biāo)簽應(yīng)用(2)文字“居左對齊”、“居中對齊”、“居右對齊”的設(shè)置方法與舉例。
2/31
定位標(biāo)簽應(yīng)用(3)css的絕對定位與相對定位、絕對定位應(yīng)用舉例(移動頂圖、移動底圖、左右側(cè)圖、大圖片中添加小圖片。)
2/32
定位標(biāo)簽應(yīng)用(4)相對定位代碼的應(yīng)用:1、錯位邊框中的移動動畫,2、相框中的移動相片。
2/33
定位標(biāo)簽應(yīng)用(5)特殊的定位方法,用表格標(biāo)簽定位,在圖片中添加圖片。
2/34
定位標(biāo)簽應(yīng)用(6)應(yīng)用外邊距給圖片定位。
2/35
css樣式表應(yīng)用(1)css基本語法和CSS的使用方法。
2/36
css樣式表應(yīng)用(2)用css樣式設(shè)置大號文字、設(shè)置行高、設(shè)置字距、設(shè)置首字大寫、設(shè)置段落首行縮進、設(shè)置濾鏡;用css樣式綜合設(shè)置。
2/37
css樣式表應(yīng)用(3)用CSS樣式制作濾鏡文字:DropShadow濾鏡文字、alpha濾鏡文字、shadow濾鏡文字、glow濾鏡文字與wave濾鏡文字。
2/38
css樣式表應(yīng)用(4)用CSS樣式制作濾鏡圖片:Alpha濾鏡圖片、Blur濾鏡圖片、Gray濾鏡圖片(灰色效果)、Xray濾鏡圖片、Glow濾鏡圖片、Invert濾鏡圖片、wave濾鏡圖片、FlipH濾鏡圖片與FlipV濾鏡圖片。
2/39
css樣式表應(yīng)用(5)用CSS樣式制作背景顏色條、相框中放入移動相片(兩種方法)、相框中放入靜止相片。
2/40
css樣式表應(yīng)用(6)小圖片中輸入文字、兩種濾鏡聯(lián)合制作的文字、濾鏡圖片中添加濾鏡文字、表格標(biāo)簽中調(diào)用css濾鏡樣式、濾鏡的四種設(shè)置方法。
第三章
網(wǎng)頁代碼結(jié)構(gòu)分析
略
3/1
網(wǎng)頁結(jié)構(gòu)分析方法一、網(wǎng)頁結(jié)構(gòu)分析方法,二、在“代碼編輯”頁面分析網(wǎng)頁的代碼結(jié)構(gòu)。
3/2
網(wǎng)頁結(jié)構(gòu)分析實例三篇比較復(fù)雜的網(wǎng)頁代碼
第四章
代碼實習(xí)園地
略
4/1
精美標(biāo)簽匯集(1)精美的文字標(biāo)簽,圖片標(biāo)簽和表格標(biāo)簽。
4/2
精美標(biāo)簽匯集(2)精美的表格列標(biāo)簽、移動標(biāo)簽和塊區(qū)標(biāo)簽。
4/3
精美網(wǎng)頁欣賞(1)橫排版單圖移動、大圖中添加多幅小圖、2種特效移動圖片、3種帶條框的移動圖片、特效移動美女圖片、疊加的動畫圖片。
4/4
精美網(wǎng)頁欣賞(2)左右交替展示、上下交替展示、圖片圍繞圖片轉(zhuǎn)、濾鏡圖片添加閃光背景、卷軸移動、三個圖片既交替展示又同時展示。
后記后記略
目錄
目錄與補記
略
梅竹贈您個好友音樂。歡迎您來代碼學(xué)習(xí)群交流學(xué)習(xí)。共同提高。你也可以在學(xué)習(xí)中請求春天老師解釋答疑;這位年過花甲的退休老教師。會為您無私奉獻。也高興代碼高手的指導(dǎo)和援手。梅竹代老師虔心謝過。祝福所用朋友開心快樂。
梅竹即時賦詩一首
《七絕=贊》
人生七十古來稀 千古賢圣展翼時
方寸慈心天可鑒 一箋辭賦贊良師
2014-05-18-20-36
補 記
《代碼入門教程》的“后記”于3月1日發(fā)表以后,又歷時將近一周了,才把《代碼入門教程》“目錄”整理出來進行發(fā)表。也許有的朋友會問:“目錄”應(yīng)該放置在“教程”的前面呀,你為何放置在“教程”的后面,又遲遲不發(fā)表呢?究其原因有以下幾點:
一、因為我撰寫的《代碼入門教程》是陸續(xù)發(fā)表的,盡管在開始撰寫的時候,已經(jīng)擬出了目錄,但是,在每篇教程還沒有撰寫完畢、沒有發(fā)表之前,是無法添加鏈接地址的,所以,即使發(fā)表在“教程”的前面,也沒有多大的意義。何況在撰寫的過程中,“教程”的內(nèi)容還會有所增減。
二、我在《代碼入門教程》的“后記”中已經(jīng)提到了,為了不讓較長的標(biāo)簽把發(fā)表以后的頁面撐得太寬,在發(fā)表的時候,我在每篇教程中較長的標(biāo)簽處都點擊了“回車鍵”。由于此錯誤的操作,使不少的代碼不能夠正常顯示其頁面了,直到我撰寫《代碼入門教程》(30)的時候,才發(fā)現(xiàn)了這一現(xiàn)象。因此,近一周來,我對《代碼入門教程》的每篇文章,都進行了復(fù)查,進行了修改,以力求教程的正確性,力求不誤傳知識。
三、為了使廣大愛好代碼的館友們便于瀏覽,便于收藏,我撰寫了一個附加內(nèi)容簡介的目錄。根據(jù)此“目錄”,大家可選擇瀏覽、選擇收藏自己喜歡的內(nèi)容,不至于浪費大家的寶貴時間。我記不清楚了,不知哪位名人曾經(jīng)說過這樣一句話:“浪費自己的時間,等于慢性自殺;浪費別人的時間,等于謀財害命?!?div style="height:15px;">
撰寫此目錄也需要一定的時間,需要一篇一篇地瀏覽教程,瀏覽每篇教程的具體內(nèi)容。
基于以上三種原因,《代碼入門教程》“目錄”拖至今日才發(fā)表,請大家體諒。
到現(xiàn)在為止,我的《代碼入門教程》收尾了。在這收尾之際,我心情激動、思緒萬千。
首先,我要感謝館方,是360doc個人圖書館給我們提供了這么一個美好的學(xué)習(xí)園地。如果沒有這個風(fēng)水寶地,我這個一不懂電腦、二不會代碼的年過花甲的老頭兒是絕對撰寫不出這《代碼入門教程》的。
其次,我還要感謝引導(dǎo)我學(xué)會在圖書館中進行各種操作方法的老師和朋友們。360doc小助手老前輩、360doc小助手2朋友、牛筋草老前輩等等前輩和朋友,都對我伸出了援助的手,指導(dǎo)我學(xué)習(xí)圖書館中的各種操作方法。在這里我要特別提到的是,對我?guī)椭畲蟮氖俏业睦蠋煛窳?。只要我在“留言交流處”發(fā)出了求教的帖子,她必定給我回帖。我給她的圖書館中發(fā)去了詢問的短信,她更是耐心細致的給我解答。如果沒有這些前輩與朋友對我的指導(dǎo),如果沒有婉林老師對我的關(guān)心與幫助,《代碼入門教程》的撰寫與發(fā)表也是不可能的。
再則,我還要感謝一直關(guān)注和支持我的各位朋友們。是他們的關(guān)注與支持,更堅定了我撰寫《代碼入門教程》的信心。
曾經(jīng)有一段時間,我為我撰寫的《代碼入門教程》得不到館方的支持,不給我審核為“原創(chuàng)”文章而生館方的氣。我撰寫《代碼入門教程》究竟是為了什么呀!還不是為了讓更多的想學(xué)習(xí)代碼的朋友們看到我撰寫的這些文章嗎?這不是在為360doc個人圖書館做貢獻嗎?你們怎么就不理解我的心情呢?難道說我是為了多要幾個“奉獻值”嗎?“奉獻值”又有何用?
在我耿耿于懷生悶氣的時候,是我的兩位好朋友,也是我在網(wǎng)絡(luò)中結(jié)識的兩位大姐“LOVE天使的外婆”與“以勒。?!?,及時地對我進行了勸解與疏導(dǎo),使我堅持不懈地把《代碼入門教程》撰寫完工。時至今日,我一切都想開了。360doc個人圖書館,畢竟是館方的圖書館,不是我“春天沒來”的個人圖書館,也不是任何一個館友的個人圖書館,我們又有什么理由對館方有過多的奢求呢?館方為我們提供了這么一個美好的學(xué)習(xí)園地已經(jīng)足夠了。至于有多少館友能夠看到我撰寫的這個“教程”呢,那就隨緣吧!
倘若我撰寫的《代碼入門教程》能夠為您學(xué)習(xí)代碼知識、制作網(wǎng)頁起到一丁點兒的幫助啟示作用,我心足亦。
下面是我復(fù)查以后,對《代碼入門教程》進行修改過的地方。特告知廣大館友:
1、代碼入門教程》(4)中:圖片標(biāo)簽形式舉例的6種代碼。
2、《代碼入門教程》(5)中:按照原圖片的規(guī)格移動的移動標(biāo)簽、改變原圖片的規(guī)格移動的移動標(biāo)簽。
3、代碼入門教程》(7)中:在“段落標(biāo)簽”的內(nèi)容中,“在使用塊區(qū)標(biāo)簽的地方,瀏覽器會自動地給下面的文章空出兩行的空格?!币痪湫薷臑椋骸霸谑褂枚温錁?biāo)簽的地方,瀏覽器會自動地給下面的文章空出兩行的空格?!?div style="height:15px;">
13、《代碼入門教程》(24)中:"在普通的背景圖片中應(yīng)用表格定位添加圖片(包括動畫圖片)、在風(fēng)景背景圖片中應(yīng)用表格定位添加圖片(包括動畫圖片)與文字"代碼。
15、《代碼入門教程》(27)中:“用CSS制作背景顏色條、相框中放入移動相片(相對定位+絕對定位)、相框中放入移動相片(相對定位)、相框中放入靜止相片、小圖片中輸入文字?!贝a。
應(yīng)許多館友的要求,“春天沒來”老師在QQ里建立了一個《代碼學(xué)習(xí)群》。有愿意參加的館友,可以入群學(xué)習(xí),共同研究、探討應(yīng)用代碼制作網(wǎng)頁等問題。
《代碼學(xué)習(xí)群》群號是:370479644.
各位群友:大家好!經(jīng)本人推薦,春天沒來老師同意,由震宇群友擔(dān)任我們代碼學(xué)習(xí)群的班長。大家可以與他建立好友和關(guān)注關(guān)系,以便聯(lián)系。