第8章-使用層和Spry(完成)

高等學校計算機應用規(guī)劃教材《網頁設計與制作基礎教程》第8章使用層和Spry(完成)ppt課件（全）第八

章使用層和Spry第8章使用層和Spry(完成)ppt課件（全）學習目標層(AP?Div)用于網頁元素的精確定位，層的使用非常廣泛，可以定位頁面上的任意位置，在層中可以插入各種元素。Spry相對于一個JavaScript框架庫，使用它可以靈活創(chuàng)建各種豐富的網頁框架效果。本章主要介紹有關層和Spry框架的詳細使用方法.:::::《計算機基礎與實訓教材系列》系列叢書官方網站http://edu:::::本章重點

層的基本作用

層的基本操作轉換表格和層使用Spry框架:::::《計算機基礎與實訓教材系列》系列叢書官方網站http://edu:::::8.1使用層層是帶有CSS樣式的Div或Span代碼，用于網頁元素的精確定位。由于一個頁面中可以擁有多個層，而不同的層之間可以相互重疊，并能通過設置透明度來決定每個層是否可見或可見的程度，所以層可用來實現許多特效。層簡介

創(chuàng)建層操作層設置層轉化表格和層使用層規(guī)劃網頁布局

:::::《計算機基礎與實訓教材系列》系列叢書官方網站http://edu:::::8.1.1層簡介

層就像是包含文字或圖像等元素的膠片，按順序疊放在一起，組合成頁面的最終效果。層可以精確地定位頁面上的元素，并且在層中可以加入文本、圖像、表格、插件等元素，還可以插入嵌套層。:::::《計算機基礎與實訓教材系列》系列叢書官方網站http://edu:::::8.1.2創(chuàng)建層

在網頁文檔中插入層后，在“代碼”視圖中會自動插入HTML標簽。層的常用標簽有<Div>和<Span>兩種，默認是使用<Div>標簽來插入層。本節(jié)將介紹在網頁中插入普通層、嵌套層以及繪制層的具體方法。:::::《計算機基礎與實訓教材系列》系列叢書官方網站http://edu:::::8.1.3操作層

在Dreamweaver中選擇“窗口”|“AP元素”命令，打開“AP元素”面板。在該面板中顯示了網頁文檔中所有插入的層，如圖8-3所示，用戶可以通過其管理網頁文檔中的所有插入的層元素（防止重疊，更改層的可見性，嵌套或堆疊層等）。:::::《計算機基礎與實訓教材系列》系列叢書官方網站http://edu:::::8.1.4設置層

在Dreamweaver中，用戶除了可以對層執(zhí)行一些基本操作以外，還可以設置層在頁面中的狀態(tài)，例如排列層、對齊層、隱藏層等。:::::《計算機基礎與實訓教材系列》系列叢書官方網站http://edu:::::8.1.5轉化表格和層

要改變網頁中各元素的布局，最方便的方法就是將元素置于層內，然后通過移動層來改變網頁的布局。要使用這種方法改變網頁布局，首先要將表格轉換為層。DreamweaverCS5允許使用層來創(chuàng)建布局，然后將層轉換為表格，以使網頁能夠在瀏覽器中正確瀏覽；也可以將網頁中的表格轉換為層。:::::《計算機基礎與實訓教材系列》系列叢書官方網站http://edu:::::8.1.6使用層規(guī)劃網頁布局

一些非常復雜的網頁如果仍然使用表格來布局網頁的話，這將是一個非常大的工作量，而且將來修改起來會很麻煩。當我們要布局一個多元素的網頁的時候，可以使用層來布局。下面將通過一個實例來介紹使用層來布局網頁的方法。:::::《計算機基礎與實訓教材系列》系列叢書官方網站http://edu:::::8.2使用Spry布局對象Spry框架是一個JavaScript庫，使用它可以創(chuàng)建更豐富的網頁?？梢允褂肏TML、CSS和一些JavaScript將XML數據合并到HTML文檔中、創(chuàng)建構件、向各種網頁元素添加不同種類的效果等。使用Spry菜單

使用Spry