網頁設計（三）——用HTML設置文本、段落和圖像

知識技能目標

（1）通過實訓項目了解HTML中文本與圖像標記的特點與語法結構。（2）通過實訓項目熟練掌握用HTML在網頁中設置文本與圖像的各種效果。（3）通過實訓項目熟練掌握用HTML在網頁中設置文本與圖像的排版。

實訓內容

（1）在網頁中用HTML設置文本與圖像的各種效果（2）在網頁中用HTML設置文本與圖像的排版。

實訓項目設置頁面效果如圖

課堂實訓1.創建帶文本的網頁（1）在學生盤文件夾09IT下的文件夾“website”中新建文件夾“shixun3”（2）在文件夾“shixun3”中新建網頁，文件名為ex1.htm。（3）在網頁中添加下列文本。

課堂實訓九寨溝——西部的世外桃源九寨溝位于岷江上游阿壩州南坪縣境內，面積600平方公里，因溝內有九個藏族村寨而得名。九寨溝以三溝一百一十八海為代表，包括五灘十二瀑、十流數十泉等，以水為主境，與九寨十二峰組成高山河谷自然景觀。1982年被國務院批準為國家級風景名勝區，1991年被聯合國教科文組織列入《世界自然遺產名錄》。九寨的山水形成于第四紀古冰川時期，現保存著大量第四紀古冰川遺跡。九寨溝地下水富含大量的碳酸鈣質，湖底、湖堤、湖畔水邊均可見乳白色碳酸鈣形成的白色晶體；而來自雪山、森林的活水泉又異常潔凈，加之梯形狀的湖泊過濾，其水色愈加透明，能見度高達20米。翠海、疊瀑、彩林、雪峰、藏情，被譽為九寨“五絕”。水乳交融，美不勝收。“黃山歸來不看云，九寨歸來不看水”，九寨的精靈是水。湖（海子）、泉、溪、瀑、河、灘連綴一體，飛動與靜謐結合，剛烈與溫柔相濟，千言萬色、多彩多姿。高低錯落的群瀑自叢林峭壁跌落，高唱低吟，熱情洋溢。大大小小的群海置身于高山深谷之中，碧藍澄激、恬靜秀美；水中倒映著紅葉、綠樹、雪峰、藍天。一步一色，變換無窮，水在樹間流，樹在水中長，花樹開在水中央，有“中華水景之王”的美譽。人們說，如果世界上真有仙境，那肯定就是九寨溝。它是一個以高原湖泊眾多，瀑布宏偉壯觀，植物景觀奇妙著稱的美麗的名勝；是一個佳景薈萃、神奇莫測的曠世勝地；是一個不見纖塵、自然純凈的“童話世界”，那里還生活著大熊貓等多種珍禽異獸。九寨溝風景區地處四川北部九寨的萬山叢中，總面積為6000公頃。因周圍有9個藏族村寨而得名，總面積約620平方公里，大約有52％的面積被茂密的原始森林所覆蓋。自然景色兼有湖泊、瀑布、雪山、森林之美。溝中地僻人稀，景物特異，富于原始自然風貌。有長海、劍巖、諾日朗、樹正、扎如、黑海六大景區，以翠海、疊瀑、彩林、雪峰、藏情這五絕而馳名中外。其主溝呈“Y”字形，即由三條溝組成，總長50余千米。其間有114個湖泊、17個瀑布群、5處鈣華灘流、47眼泉水、11段激流，以1000余米的高差，穿行于雪峰、林、谷之間，逶迤50千米。它是中國唯一、世界罕見的巨大的以高山湖泊群和瀑布群為特色，集群海、溪流、瀑布、雪峰、林莽、鈣華灘流等自然景觀和藏族風情為一體的風景名勝區。溝內最美的景致“海子”，是個有108個階梯的彩色湖泊，這里飛泉流瀑，奔騰傾瀉，山谷轟鳴，蔚為壯觀。樹正群海景區包括：盆景海蘆葦海火花海雙龍海臥龍海火花海樹正群瀑樹正群海老虎海諾日朗瀑布則查洼溝景區包括：季節海五彩池長海日則溝景區包括：珍珠灘金鈴海孔雀海五花海熊貓海箭竹海天鵝海芳草海劍巖如果說，樹正群海清秀嫵媚，諾日朗景區奇麗妖嬈，那么遠離塵囂、鮮有人跡的劍巖風景則更古樸、更野性、更原始沉寂，使你仿佛穿過時空隧道，一步跨進了遠古寧靜的史前社會。

課堂實訓2.給文本設置顯示效果（1）給第3段文本設置色彩<fontcolor="red">（2）給第6段文本定義多級列表無序列表<ul><li>...</ul>有序列表<ol><li>...</ol>（3）給第1、2段文本設置預定義格式

課堂實訓3.給網頁插入圖片并排版（1）給第3、4、5段文本后插入圖片<imgsrc="img/九寨風景1.gif“/>（2）定義多級列表圖片的樣式（大小等）<imgsrc="img/九寨風景1.gif"width="155"height="116“/>（3）給圖文混排思考：Align屬性的多個取值的頁面效果HTML文本圖象1

文本字體標題

字號

物理字體

邏輯字體

顏色

客戶端字體

字符實體

文字布局

行的控制

文字的對齊

文字的分區

列表

定制列表元素

預格式化文本

空白

多列文本

2圖象控制標簽

一個網站如果沒有圖片，那將是沒有生氣的，也吸引不了讀者的目光。一個好的設計師會用合適的圖片美化自己的設計，如果使用恰當會有點睛之筆的效果。

1.插入圖片：插入圖象的語句是<imgsrc=“圖片的URL”>,它沒有結束標簽。2圖象控制標簽基本語法