- 相關(guān)推薦
職稱計(jì)算機(jī)Dreamwaver考點(diǎn):插入圖像
導(dǎo)語:目前互聯(lián)網(wǎng)上支持的圖像格式主要有GIF、JPEG和PNG。其中使用最為廣泛的是GIF和JPEG。那么在Dreamwaver的使用中我們要如何插入圖像呢?一起來看看吧。
1、插入圖像
在制作網(wǎng)頁時(shí),先構(gòu)想好網(wǎng)頁布局,在圖像處理軟件中將需要插入的圖片進(jìn)行處理,然后存放在站點(diǎn)根目錄下的文件夾里。
插圖圖像時(shí),將光標(biāo)放置在文檔窗口需要插入圖像的位置,然后鼠標(biāo)單擊常用插入欄的“圖像”按鈕。
彈出的“選擇圖像源文件”對話框,選擇img/001.jpg,單擊“確定”按鈕就把圖像001.jpg插入到了網(wǎng)頁中。
注意:如果我們在插入圖片的時(shí)候,沒有將圖片保存在站點(diǎn)根目錄下,會彈出下圖所示的對話框,提醒我們要把圖片保存在站點(diǎn)內(nèi)部,這時(shí)單擊“是”按鈕,
然后選擇本地站點(diǎn)的路徑將圖片保存,圖像也可以插入到網(wǎng)頁中。
2、設(shè)置圖像屬性
選中圖像后,在屬性面板中顯示出了圖像的屬性,如下如所示。
在屬性面板的左上角,顯示當(dāng)前圖像的縮略圖,同時(shí)顯示圖像的大小。在縮略圖右側(cè)有一個(gè)文本框,在其中可以輸入圖像標(biāo)記的名稱。
圖像的大小是可以改變的,但是在DW里更改是極不好的習(xí)慣,如果我們的電腦安裝了FW軟件,單擊屬性面板的“編輯”旁邊的,即可啟動FW對圖像進(jìn)行縮放等處理。當(dāng)圖像的大小改變時(shí),屬性欄中“寬”和“高”的數(shù)值會以粗體顯示,并在旁邊出現(xiàn)一個(gè)弧形箭頭,單擊它可以恢復(fù)圖像的原始大小。
“水平邊距”和“垂直邊距”文本框用來設(shè)置圖像左右和上下與其它頁面元素的距離。
“邊框”文本框時(shí)用來設(shè)置圖像邊框的寬度,默認(rèn)的邊框?qū)挾葹?。
“替代”文本框用來設(shè)置圖像的替代文本,可以輸入一段文字,當(dāng)圖像無法顯示時(shí),將顯示這段文字。
單擊屬性面板中的對齊按鈕,可以分別將圖像設(shè)置成瀏覽器居左對齊、居中對齊、居右對齊。
在屬性面板中,“對齊”下拉列表框時(shí)設(shè)置圖像與文本的相互對齊方式,共有10個(gè)選項(xiàng)。通過它我們可以將文字對齊到圖像的上端、下端、左邊和右邊等,從而可以靈活的實(shí)現(xiàn)文字與圖片的混排效果。
3、插入其它圖像元素
在我們單擊常用插入欄的“圖像”按鈕時(shí),可以看到,除了第1項(xiàng)“圖像”外,還有“圖像占位符”、“鼠標(biāo)經(jīng)過圖像”、“導(dǎo)航條”等項(xiàng)目。
插入圖像占位符,在我們布局頁面時(shí),如果要在網(wǎng)頁中插入一張圖片,可以先不制作圖片,而是使用占位符來代替圖片位置。單擊下拉列表中的“圖像占位符”,打開“圖像占位符”對話框。按設(shè)計(jì)需要設(shè)置圖片的寬度和高度,輸入呆插入圖像的名稱,即可。
鼠標(biāo)經(jīng)過圖像,鼠標(biāo)經(jīng)過圖像實(shí)際上由兩個(gè)圖像組成,主圖像(當(dāng)首次載入頁時(shí)顯示的圖像)和次圖像(當(dāng)鼠標(biāo)指針移過主圖像時(shí)顯示的圖像)。這兩張圖片要大小相等,如果不相等,DW自動調(diào)整次圖片的大小跟主圖像大小一致。
【職稱計(jì)算機(jī)Dreamwaver考點(diǎn):插入圖像】相關(guān)文章:
職稱計(jì)算機(jī)Dreamwaver使用教程:插入圖像10-05
職稱計(jì)算機(jī)Dreamwaver使用教程:文本的插入與編輯08-20
職稱計(jì)算機(jī)2017Dreamwaver教程:插入Flash動畫10-09
職稱計(jì)算機(jī)Dreamwaver2017教程:插入并編輯表格10-20
職稱計(jì)算機(jī)Dreamwaver教程:認(rèn)識表單對象09-07
職稱計(jì)算機(jī)考試Dreamwaver:認(rèn)識表單對象11-03
職稱計(jì)算機(jī)Dreamwaver教程:頁面的總體設(shè)置10-05
職稱計(jì)算機(jī)考試Dreamwaver中表單的創(chuàng)建與應(yīng)用10-21