欢迎光临新华电脑职业培训-现代电脑-新东方学校网站!
您现在所处的位置:福建百科 > 网络技术 >

泉州浮桥Dreamweaver 网页设计技巧集锦(三)-福建百科教育网-网络技术

作者:admin  时间:2020-02-21   点击数:   收藏  分享到:
0

泉州浮桥Dreamweaver 网页设计技巧集锦(二)-福建百科教育网


1、如何把自己放在主頁上的zip或其他文件讓瀏覽者下載(down)? 

  用Dreamweaver3其實很簡單,把要讓瀏覽者下載的文件名寫上,然后拖動鼠標選取這段文字,在文本的屬性面板上“Link”的屬性輸入框中寫上文件名就行了。注意:若被下載的文件與該網頁不在同一目錄下,則文件名必須包含相對路徑,否則到下載時將提示找不到文件。 

  2、在網頁中,圖片和表格接觸的地方如何不留空隙? 

  要使圖片和表格接觸的地方不留空隙,僅在表格屬性面板上把外框線(border)設為0是不行的,不僅僅只是表格外框,還有兩個設置,即在表格的屬性面板上還要把單元格的兩個屬性設為0(cellspacing="0" cellpadding="0")。 

  3、有些網頁的鏈接,原先沒有下划線,你把鼠標指向鏈接處,才會出現下划線,鼠標移掉下划線就又沒有了。如何實現這種效果呢? 

  可用層疊樣式表(CSS)來實現的,在Dreamweaver3中編輯層疊樣式表不用編寫代碼,具體操作方法如下: 

  1)在快速啟動欄中點擊層疊樣式表按鈕(就是把鼠標放上去顯示“show css styles”的那個按鈕),在彈出的CSS Styles面板上雙擊(none)﹔ 

  2)此時,可看到彈出的Edit Style Sheet 面板,在該面板上按New按鈕﹔ 

  3)再在彈出的New Style 面板上點取Redefine HTML Tag(重新定義HTML標記)再在Tag中選擇“a”(超級鏈接標記)標記后按OK按鈕﹔ 

  4)這時可看到彈出的Style dehinition for a 的對話框,在此對話框中可以設置超級鏈接的許多屬性,你可以按你的意愿設置,但我們這里主要是要去掉那討厭的下划線,所以我們在decoration 屬性中選擇“none”,這樣就把下划線去掉了﹔然后我們再選擇顏色為:#339966。按OK按鈕返回到Edit Style Sheet 面板﹔ 

  5)在Edit Style Sheet 面板上再按New按鈕﹔ 

  6)在彈出的New Style 面板上點取Use CSS Selector ,再在該面板上的selector選擇框中選擇“a:hover”(定義當鼠標在超級鏈接上時鏈接的屬性),按OK按鈕﹔ 

  7)在彈出的Style dehinition for a:hover 的對話框中,我們在decoration 屬性中選擇“underline”,這樣就把下划線又加上了﹔然后我們再選擇顏色為:#FF3300。按OK按鈕返回到Edit Style Sheet 面板﹔ 

  8)在Edit Style Sheet 面板上再按Don按鈕,至此所有設置結束,你在Dreamweaver3的源代碼檢視窗中將看到在<head>與</head>之間如下所示的代碼: 

  <style type="text/css"> 

  <!-- 

  a { color: #339966; text-decoration: none} 

  a:hover { color: #FF3300; text-decoration: underline} 

  --> 

  </style> 

  有了這段代碼,你在該網頁上的所有文字鏈接在瀏覽器中顯示時沒有下划線,當你把鼠標指向鏈接處,才會出現下划線,鼠標移掉下划線就又沒有了。若你想在其它網頁中也具有這種效果,你可以用上述方法設置或更簡單點,直接把這段代碼復制,粘貼到<head>與</head>之間即可。注意:若不是在a 中定義除去下划線而是在a: link中定義除去下划線,在實際使用時不能除去下划線,我是在IE4.0環境下測試的。 

  4、如何實現定義的超級鏈接文字顏色? 

  許多文章和教程都介紹過文字超級鏈接的顏色(包括未被訪問的鏈接顏色、鼠標的鏈接上的顏色、已被訪問過的鏈接顏色等等)可以用層疊樣式表(CSS)定義,但真正在網頁中要實現顏色按自己的意愿變化還確實不容易。下面把一些注意事項告訴你,你就能隨心所欲地設置文字鏈接的顏色了。 

  1)超級鏈接的默認顏色是:未被訪問的超級鏈接是藍色、被訪問過的超級鏈接是紫色﹔ 

  2)要想使CSS定義的顏色起作用,在超級鏈接的文本的顏色屬性中什么都不要填﹔ 

  3)若你已定義了文本的顏色,發現CSS中定義的超級鏈接顏色不起作用,你可以取消文本的顏色定義,或取消超級鏈接再重新定義一次,CSS定義的顏色就起作用了﹔ 

  4)超級鏈接上各種狀態下文本顏色的關系:一旦定義了被訪問過的鏈接的顏色(A: visited),則當鏈接被訪問過后,該鏈接的顏色不再改變,即定義鼠標在超級鏈接上的顏色(a: hover)將不起作用了。若不定義被訪問過的鏈接的顏色(A: visited),則當鼠標在超級鏈接上顯示a: hover 中定義的顏色,當鼠標移開時顯示a 中定義的顏色。 

  從上述可以看出,文本鏈接的顏色實際上只能在兩種顏色之間變換,并沒有象有些文章中講的那樣可以在多種顏色之間變換,但由于用那兩種顏色可以任意,所以應該講顏色的選擇范圍還是比較大的。 

  5、如何在dreamweaver3中把圖形放在最中間? 

  點擊選取圖形,在圖形的屬性面板的右上角Align(對齊屬性)邊上有個下拉框,在下拉框中選取,則文字在圖片四周繞排。若是單獨圖片在中間,則在圖象面板上點取居中屬性即可。 

  6、在dreamweaver3中,超級鏈接可以實現許多網頁特效(Behaviors),但有時我們只想使用Behaviors 功能,而又不鏈接到任何地方去,怎能么辦? 

  選取要作為超級鏈接的元素(一幅圖片或一段文字),在屬性面板上的地址欄(Link)中不填寫任何鏈接地址,只加上一個“#”號,(引號不包括在內)。這樣即可以Behaviors 功能,而又不鏈接到任何地方去了。 

  7、在同一網頁中如何點一個鏈接使得窗口移到本頁指定的地方,就象SOIM一份雜志《英文天地》一樣? 

  這就應用所謂的“書簽”功能。在dreamweaver3中,“書簽”不是用“BookMark”表示,而是用“Name Anchor”(一般直譯為“錨”)。在需要轉到的地方同時按下“Ctrl+Alt+A”鍵,在彈出的插入“書簽”對話框(Insert Name Anchor)中,輸入一個書簽的名字,名字你可隨便取,若有多個書簽,只要不重名就行了。然后在要作超級鏈接的元素屬性面板上,點擊地址欄的下拉框,你可看到你所插入的書簽名全在這里,只是在最前面加了一個“#”號,你選取一個你欲鏈接到的地方的書簽名冊名就行了。 

   

  8、如何在一張(較大)圖片上做出几個不同的鏈接? 

  在dreamweaver3中,這就是使用所謂的設置“圖像熱區域”。先選中圖像,然后在圖像屬性面板上有一個“Map”工具欄,在其下方有三個淡藍色的工具圖標,即“矩形”“圓形”或“多邊形”,你可以根據需要選取一個(用鼠標點一下就行),再把鼠標移圖像上,按信左鍵,拖動鼠標就畫出了一塊淡藍色的區域(不用擔心這塊淡藍色區域會破壞你的圖像,在瀏覽器中是不顯示的),這時你在屬性面板上把需鏈接的網頁地址添上就行了。你需要几個鏈接就畫几塊區域,隨你的便。 

  9、如何在網頁中制作以下東東:在總目錄的前方有一個“+",一按這個“+",即可顯示其下子目錄,“+"即變成“-",一按“-",即可隱藏其下子目錄,就象在資源管理器中那樣? 

  這需要做二個頁面,一個頁面寫上總目錄,一個頁面寫上子目錄。把總目錄的頁面上的"+"號設置成超級鏈接,在“Link”欄中添上子目錄頁面的地址。把子目錄的頁面上的"-"號設置成超級鏈接,在“Link”欄中添上總目錄頁面的地址。具體效果可看一看Dreamweaver3的幫助文檔,在這幫助文檔里也是按一下總目錄,彈出子目錄,按下子目錄上的總目錄則返回到總目錄,只是沒用“+”、“-”表示而已。你再看一下該文檔的源代碼就一目了然了。