網(wǎng)頁設(shè)計教學中DIV+CSS布局的運用論文
一、引言。
隨著時代的發(fā)展進步,網(wǎng)絡(luò)計算機技術(shù)的飛速發(fā)展進步,網(wǎng)頁設(shè)計領(lǐng)域也有了極其廣泛的發(fā)展空間,各個院校都開設(shè)了網(wǎng)頁設(shè)計這一學科的教學,為培養(yǎng)這方面更多的人才對推動我國網(wǎng)頁設(shè)計專業(yè)的發(fā)展進程作出重要的貢獻。目前,在我國網(wǎng)頁設(shè)計這一學科的教學過程中,教學使用的軟件一般都是 Dre-amweaver,這一軟件在設(shè)計網(wǎng)頁的時候,網(wǎng)頁布局法最常用的就是 Table 頁面布局以及 DIV + CSS 頁面布局這兩種,本文就深入了解分析 DIV + CSS 頁面布局法這一頁面布局法解決傳統(tǒng)表格布局法的不足之處,利于后期的網(wǎng)頁維護和修改工作的進行,簡化了代碼,從而減少了網(wǎng)絡(luò)資源的浪費。由于 DIV + CSS 布局在當今社會的應(yīng)用中受到廣泛的歡迎,因此,我國各院校也應(yīng)重視這一布局法在網(wǎng)頁設(shè)計教學中的應(yīng)用,改變傳統(tǒng)網(wǎng)頁設(shè)計教學課堂的教學氛圍,提高教學質(zhì)量,從而對提高學生的能力起到深遠的作用。
二、DIV + CSS 布局。
( 一) 傳統(tǒng)的網(wǎng)頁頁面布局法。在傳統(tǒng)的網(wǎng)頁設(shè)計教學過程中,使用的頁面布局法主要是表格頁面布局和框架布局。表格布局法的優(yōu)勢在于可以隨意設(shè)置單元格的高度和寬度,還可以實現(xiàn)嵌套,能讓網(wǎng)頁中的.各元素都擺放在預(yù)期的地方; 它的操作簡單易行,可以完成各種版式的布局。但是它也存在很多缺點,比如說在設(shè)計復(fù)雜的網(wǎng)頁時候,HTML 文檔內(nèi)容將會特別多,這樣瀏覽器在加載完表格再顯示頁面的過程中,要消耗很長的時間,此外,表格布局法還可能使 HTML 文檔的內(nèi)部結(jié)構(gòu)混亂,其頁面的維修和修改工作也特別困難。
。 二) 含義。DIV 是一種容器性質(zhì)的元素,它的存在是為HTML 文檔內(nèi)容提供結(jié)構(gòu)和背景,它是由起始標簽 < div > 和結(jié)束標簽 < /div > 之間的內(nèi)容構(gòu)成的。CSS 就是層疊樣式表,主要是用來設(shè)計網(wǎng)頁的排版和風格的,使網(wǎng)頁變得更加豐富。
CSS 由兩個主要部分組成: 選擇器和聲明,其中選擇器的使用需要改變樣式的元素; 聲明則是由一個屬性一個值組合成的,屬性和值需要用冒號來隔開,聲明和聲明之間需要用分號來隔開。如果要將網(wǎng)頁頁面上的元素實現(xiàn)一對一的控制,就需要使用 CSS 選擇器,常用的有標簽選擇器、類選擇器、id 選擇器、群組選擇器以及后代選擇器這幾種,它們都有著各自的優(yōu)點和缺點。
( 三) 布局原理。DIV + CSS 頁面布局法是 WEB 設(shè)計的標準,它和以往的表格頁面布局法有著明顯的不同之處,可以實現(xiàn)網(wǎng)頁頁面內(nèi)容和表現(xiàn)分離,其中 DIV 是用來完成網(wǎng)頁的框架結(jié)構(gòu),CSS 是用來美化網(wǎng)站的樣式,它們的共同使用可以將網(wǎng)站進行重構(gòu),使網(wǎng)站進一步實現(xiàn)標準化,簡化 HTML 文檔內(nèi)容的代碼,有利于網(wǎng)站結(jié)構(gòu)的搭建。
三、網(wǎng)頁設(shè)計教學過程中 DIV + CSS 布局法的應(yīng)用路徑。
( 一) DIV + CSS 布局法的優(yōu)點。
1. 使網(wǎng)頁結(jié)構(gòu)實現(xiàn)標準化。由于傳統(tǒng)的表格頁面布局法使用過程中,網(wǎng)頁垃圾代碼過多,用于裝飾的樣式和頁面布局代碼的混合導(dǎo)致頁面結(jié)構(gòu)不美觀,此外,表格頁面布局中的多層嵌套、單元格的合并與拆分這些對一個單元格的調(diào)整工作,都會影響到其余單元格的表現(xiàn)效果。但是 DIV + CSS 頁面布局法很好地解決了這一問題,在頁面布局設(shè)計的時候,使用 DIV 盒子來確定大小,其邊框局、間距等多種屬性都可以進行數(shù)值上的調(diào)整,這就使網(wǎng)頁頁面的結(jié)構(gòu)塑造性極強。
2. 使網(wǎng)頁內(nèi)容和樣式相分離。DIV + CSS 頁面布局法的使用,解決了以往網(wǎng)頁風格不統(tǒng)一的問題,有利于更新和網(wǎng)頁維修修護工作的進行。DIV( 網(wǎng)頁內(nèi)容) 和 CSS( 樣式) 的相互分離,一般是通過將頁面內(nèi)容放到 HTML 文檔文件中而樣式則放在單獨的 CSS 文件里,當需要進行網(wǎng)頁內(nèi)容修改時候,只需要對 HTML文件改動,對網(wǎng)頁頁面效果修改時候,則只需要對 CSS 文件中的內(nèi)容進行修改即可,大大節(jié)省了工作的時間和人力的消耗。DIV+ CSS 頁面布局法將網(wǎng)頁內(nèi)容和樣式的分離,對網(wǎng)頁的更新工作帶來極大的便利,此外,還可以實現(xiàn)網(wǎng)頁風格的相互統(tǒng)一。
3. 優(yōu)化搜索引擎。網(wǎng)頁設(shè)計中的搜索引擎主要是針對網(wǎng)頁內(nèi)容也就是文字、代碼完成的,而傳統(tǒng)的表格頁面布局法中使用的頁面代碼過多,搜索引擎工作很難完成。但是 DIV + CSS 頁面布局法中的網(wǎng)頁代碼簡潔,在進行搜索引擎工作的時候,只需要將被搜索的內(nèi)容從 HTML 文檔中的代碼進行搜索即可,搜索引擎只需要輸入搜索內(nèi)容的關(guān)鍵詞,減少了繁復(fù)的搜索內(nèi)容,提高了搜索引擎工作的效率,減少了大量的工作時間。
。 二) DIV + CSS 布局在網(wǎng)頁設(shè)計中的具體應(yīng)用路徑。DIV+ CSS 這一布局法在網(wǎng)頁設(shè)計學科的教學過程中有著重要的作用,但是其技術(shù)性較高,操作困難,這就需要老師在教學過程中通過以下路徑提高教學質(zhì)量。
1. 教學內(nèi)容。目前,我國多數(shù)網(wǎng)頁設(shè)計課程采用的教材在DIV + CSS 布局這方面的講解都是從含義講起,再分析字體、表格、圖像等屬性,內(nèi)容散亂無章,學生學起來也顯得十分困難。因此,應(yīng)該從教學內(nèi)容的制定上實現(xiàn)創(chuàng)新,教學內(nèi)容由簡單到困難,不斷深入了解其具體含義。教學內(nèi)容困難度的由淺及深,可以使學生在輕松愉悅的氛圍中學習,激發(fā)學生的學習興趣,這樣網(wǎng)頁設(shè)計這一學科的教學質(zhì)量才能得到進一步的提高,學生自身的知識能力水平也將得到大幅度的進步。
2. 教學方法。隨著社會的發(fā)展進步,我國教學事業(yè)也得到了飛速的進步,教學理念都發(fā)生了巨大的改變,在當今教學活動中,應(yīng)該彰顯學生在課堂中的主體地位。這就需要從教學方法開始作出改變。傳統(tǒng)的網(wǎng)頁設(shè)計課程都是通過老師控制學生電腦演示設(shè)計過程來完成的,這種講課方法學生無法親自動手參與到課堂教學中,老師講完后讓學生自己輸入代碼,學生就被動輸入代碼,這樣學生的思維得不到培養(yǎng),教學質(zhì)量也將受到限制。因此,老師應(yīng)該創(chuàng)新教學方法,充分利用先進的多媒體技術(shù),不再操作學生的電腦,讓學生自己動手,自主思考問題,這樣教學質(zhì)量才能得到提高。
3. 教學評價。傳統(tǒng)的網(wǎng)頁設(shè)計教學考核主要是通過試卷完成的,這不符合這一學科的特征,因此,老師要在教學評價上實現(xiàn)創(chuàng)新,可以通過綜合課程設(shè)計以及期末機房考試這兩部分實現(xiàn)對學生的考核,既可以檢查學生平常上課中綜合案例的掌握情況,又可以檢測學生的網(wǎng)頁設(shè)計情況,教學評價體系的創(chuàng)新對推動學生的學習有著重要的作用。
四、結(jié)語。
總體說來,在當今社會形勢下,各院校都要綜合考慮社會市場對網(wǎng)頁設(shè)計領(lǐng)域人才的需求以及這一學科自身的特點,制定合理的教學內(nèi)容、教學方法,提高學生的綜合素質(zhì),重視 DIV +CSS 布局在網(wǎng)頁設(shè)計教學過程中的應(yīng)用,使學生充分掌握這一技術(shù)。
【參考文獻】
[1]黃玉春,陳霞。 DIV + CSS 布局在網(wǎng)頁設(shè)計教學中的應(yīng)用研究[J]. 電腦知識與技術(shù),2013,10
[2]王愛菊,楊金川。 DIV + CSS 布局在《網(wǎng)頁制作》課程中的教學改革探究[J]. 無線互聯(lián)科技,2015,5
【網(wǎng)頁設(shè)計教學中DIV+CSS布局的運用論文】相關(guān)文章:
網(wǎng)頁設(shè)計中FLASH的運用論文04-22
網(wǎng)頁設(shè)計中色彩的運用分析論文04-22
網(wǎng)頁設(shè)計制作中超鏈接的運用論文04-22
《網(wǎng)頁設(shè)計與制作》課程中過程考核的運用論文04-22
網(wǎng)頁設(shè)計教學中的應(yīng)用分析論文01-11
視覺元素下網(wǎng)頁設(shè)計的運用論文04-22
包裝設(shè)計教學中圖形的運用論文11-29
初中教學中的運用論文06-28