您現在的位置是:電腦技術吧?>? 組裝維修 ??>??網頁制作的基本步驟,怎么制作網頁教程??>??正文詳情

網頁制作的基本步驟,怎么制作網頁教程

宋平春2019-11-15 06:01:00 人圍觀
簡介網頁制作作為一個網站,超鏈接必須有許多頁面。如果頁面彼此獨立,那么頁面就像島嶼一樣。這樣的網站不能運行。為了在網頁之間建立鏈接,我們必須使用超鏈接。它之所以叫超鏈

超級鏈接  作為網站肯定有很多的頁面,如果頁面之間彼此是獨立的,那么網頁就好比是孤島,這樣的網站是無法運行的。

為了建立起網頁之間的聯系我們必須使用超級鏈接。

稱超級鏈接,是因為它什么都能鏈接,如:網頁、下載文件、網站地址、郵件地址等等。

下邊我們就來討論怎樣在網頁中創建超級鏈接。

  【頁面之間的超級連接】  在網頁中,單擊了某些圖片、有下劃線或有明示鏈接的文字就會跳轉到相應的網頁中去。

  1、在網頁中選中要做超級鏈接的文字或者圖片。

  2、在屬性面板中單擊黃色文件夾圖標,在彈出的對話框里選中相應的網頁文件就完成了。

做好超級鏈接屬性面板出現鏈接文件顯示。

(如下圖)

  3、按F12預覽網頁。

在瀏覽器里光標移到超級鏈接的地方就會變成手型。

  〖提示〗你也可以手工在鏈接輸入框中輸入地址。

給圖片加上超級鏈接的方法和文字完全相同。

  如果超級鏈接指向的不是一個網頁文件。

而是其他文件例如zip、exe文件等等,單擊鏈接的時候就會下載文件。

  超級鏈接也可以直接指向地址而不是一個文件,那么單擊鏈接直接跳轉到相應的地址。

例如,在鏈接框里寫上http://www.oldkids.com.cn/那么,單擊鏈接就可以跳轉到老小孩網站。

  【郵件地址的超級連接】  在網頁制作中,還經常看到這樣的一些超級鏈接。

單擊了以后,會彈出郵件發送程序,聯系人的地址也已經填寫好了。

這也是一種超級鏈接。

制作方法是:在編輯狀態下,先選定要鏈接的圖片或文字(比如:歡迎您來信賜教!),在插入欄點  或點插入菜單選電子郵件鏈接彈出如下對話框,填入E-Mail地址即可。

  提示:還可以選中圖片或者文字,直接在屬性面板鏈接框中填寫mailto:郵件地址。

(如下圖)

  創建完成后,保存頁面,按F12預覽網頁效果。

  【制作圖片上的超級鏈接】  注意,我們這里所說的圖片上的超級鏈接是指在一張圖片上實現多個局部區域指向不同的網頁鏈接。

比如一張中國地圖的圖片,單擊了不同的省跳轉到不同的網頁。

可點的區域就是熱區。

為了演示制作效果下面的中國地圖我加了一些鏈接,你可以用鼠標測試。

鼠標移動到省份的熱區,會顯示提示,如果有預先設置的網站,點擊會進入對方的網站。

  【制作方法】  1、首先插入圖片。

單擊圖片,用展開的屬性面板上的繪圖工具在畫面上繪制熱區。

  2、屬性面板改換為熱點面板如圖:鏈接輸入框:填入相應的鏈接。

替代框:填入你的提示文字說明。

目標框:不作選擇則默認在新瀏覽器窗口打開。

  3、保存頁面, 按F12預覽,用鼠標在設置的熱區檢驗效果。

  提示:對于復雜的熱區圖形我們可以直接選擇多邊形工具來進行描畫。

替代框填寫了說明文字以后,光標移上熱區就會顯示出相應的說明文字。

  超級鏈接屬性面板中的目標選項。

  目標我們稱它為目標區。

也就是超級鏈接指向的頁面出現在什么目標區域。

默認的情況下域中總有四個選項。

  ①_blank :單擊鏈接以后,指向頁面出現在新窗口中。

  ②_parent:用指向頁面替換他外面所在的框架結構。

  ③_self:將連接頁面顯示在當前框架中。

  ④_top: 跳出所有框架,頁面直接出現在瀏覽器中。

  【小結】本節教程主要探討創建頁面的鏈接。

  1、內部鏈接:鏈接到本站點的其他文檔。

  2、外部鏈接:鏈接到本站點以外的其他文檔。

  3、E-Mail鏈接:單擊該鏈接,可以打開瀏覽者的郵件系統。

  4、圖片熱區鏈接:使你的鏈接更靈活更有個性。

版權聲明:本文由 宋平春 整理編輯。

原標題:網頁制作教程,網頁制作教程步驟

轉載注明出處:http://www.dn9ww09s.icu/assemble/12407.html

文章評論

    共有條評論來說兩句吧...

    用戶名:

    驗證碼:

作者推薦

  • Windows XP,Windows XP Mode

    Windows XP,Windows XP Mode 相關圖片Windows XP下載下了SP3,然后又是系統幽靈,下一次開始我們的體驗之旅。首先選擇運行安裝程序,系統毫不留情地告訴我,中文系統不能安裝,不要害怕,我們有個訣竅!不怕!我們有辦...

  • 鼠繪,7鼠繪

    鼠繪,7鼠繪 相關圖片鼠繪圖片首先,打開flash并創建一個新的空白flash文檔。默認情況下,所有設置都正常。選擇線工具在場景中畫一條線,選擇選擇工具,將鼠標指針放在線中間的任意位置,會發tr鼠繪...

  • Windows XP,Windows XP Mode

    Windows XP,Windows XP Mode 相關圖片Windows XP下載Windows XP Service Pack 3候選更新2的獨立更新包已出現在moninova上XP免費升級win10...

  • 妙趣橫生什么,妙趣橫生的意思

    妙趣橫生什么,妙趣橫生的意思 相關圖片妙趣橫生是褒義詞嗎雖然沒有人想遇到404找不到,但今天的404頁面群可能會讓你想主動通過它們。不管它的特點是什么,都值得一讀5分鐘,比如頭頂的腦洞,與品牌的恰當結合,幽默有...

  • 七月流火,七月流火是幾月

    七月流火,七月流火是幾月 相關圖片七月流火,八月未央Aurora forum XP v1.3[Windows XP SP3簡體中文](2007 08 13﹣XP﹣SP3﹣ghost版本)eulaid:wx.4﹣P七月流火原文...

  • 內嵌html,html內嵌樣式

    內嵌html,html內嵌樣式 相關圖片html嵌入php問:我現在有一個HTML網頁代碼。要將其更改為Perl程序,只需添加?!.. /在第一行中輸入Perl/bin/Perl,并將文件后綴更改為。CGI,系統將提示html...

  • Windows XP,Windows XP Mode

    Windows XP,Windows XP Mode 相關圖片Windows XP下載軟件大小155.97 MB軟件語言簡體中文軟件類別國內軟件/操作系統關于Windows XP SP3簡體中文美化安裝版本v.3300的問題可以在軟件應用交換論壇XP免費升級win10...

  • 測試版,QQ最新測試版

    測試版,QQ最新測試版 相關圖片ios13.0測試版微軟今天發布了WindowsXPSP3的測試版,但和銷售人員一樣,微軟建議升級到WindowsVista是最好的選擇。”微軟在一份聲明中說手機qq最新測試版...

  • 怎么做幫助文檔,關于幫助文檔

    怎么做幫助文檔,關于幫助文檔 相關圖片nastran幫助文檔在win32下安裝了腳本后,將根據現有模塊的POD文檔生成詳細的HTML幫助。但是,手動安裝的其他模塊不能自動將自己的pod文檔添加到幫助中,除非使用PPM命令幫助文檔詳情...

  • Windows XP,Windows XP Mode

    Windows XP,Windows XP Mode 相關圖片Windows XP下載微軟發布了windowsxpsp3rc2升級包,版本號為v3300,但僅通過windows更新,沒有獨立的安裝包。同時,微軟還發布了詳細的發布說明,指導用戶進行XP免費升級win10...

熱評文章

  • Windows XP,Windows XP Mode

    Windows XP,Windows XP Mode 相關圖片Windows XP下載目前,有關Windows XP SP3和Vista SP1的謠言正涌入互聯網上的人們。隨著微軟逐漸默認XP SP3的存在,XP SP3的相關信息不久前就逐漸被挖XP免費升級win10...

  • xp開機黑屏,xp黑屏如何解決

    xp開機黑屏,xp黑屏如何解決 相關圖片xp系統黑屏如何解決一、微軟黑屏WGA盜版驗證微軟中國10月15日正式宣布,從10月20日起,將同時推出兩個重要更新,分別使用XP專業盜版系統和Office XP、Office 2xp開機黑屏進不去系統...

  • if函數標記顏色,excel標記顏色用函數

    if函數標記顏色,excel標記顏色用函數 相關圖片excel怎么標記重復項實際上需要編寫一個asp.net的clear HTML標記函數,讓我們一起學習,相信我們可以理解下面的引用片段://clear的HTML函數publicstat查找類函數...

  • Windows XP安裝,windows xp怎么安裝

    Windows XP安裝,windows xp怎么安裝 相關圖片win7和xp雙系統安裝《驅動程序之家》[原件]作者:尚雯Q編輯:尚雯Q 2007-08-09 09 09:38:57正在加載[delivery]bink.nu最近獲得了WindowsWindows XP sp3...

  • 在切片面板中,ai中切片怎么使用

    在切片面板中,ai中切片怎么使用 相關圖片術中無快速切片創建HTML切片HTML切片指定瀏覽器中出現純HTML文本的區域。HTML切片不導出圖像,它們導出由切片定義的表格單元格中顯示的HTML文本如果要快速更新網站中python中切片的理解...

  • xp系統的萬能開機密碼,xp系統啟動密碼設置

    xp系統的萬能開機密碼,xp系統啟動密碼設置 相關圖片windowsxp設置開機密碼要求如果你的電腦里有很多重要的數據不能外傳,你會用什么方法來保證這些數據的安全?以下是XP如何設置開機密碼以確保XP系統1中的數據安全。登錄到您的XP系統...

  • 高級選項菜單,開機高級選項菜單

    高級選項菜單,開機高級選項菜單 相關圖片windows7高級選項菜單當裝有XP系統的計算機無法正常啟動時,可以按F8鍵進入“高級選項”菜單,從中可以選擇不同的模式啟動windowsxp。所以這里有一個高級選項菜單表(不破壞數據)高...

  • 一什么山脈,山脈

    一什么山脈,山脈 相關圖片山脈走向在畫卡通石頭的時候,用flash制作卡通動畫和MTV時,石頭也經常出現。這個例子將教你如何畫石頭。示例效果如圖6-1圖6-1最終效果圖制作時間:5分鐘學習難度:世界山脈...

  • Windows XP,Windows XP Mode

    Windows XP,Windows XP Mode 相關圖片Windows XP下載本文主要討論在Windows XP操作系統中,當C盤空間不足1時,如何增加C盤的空間。打開我的電腦-工具-文件夾選項-查看-顯示所有文件和文件夾選項前檢查-確定XP免費升級win10...

  • Flash教程,Flash動畫實例教程

    Flash教程,Flash動畫實例教程 相關圖片Flash動畫設計一。首先,創建一個新的flash文檔,修改文檔大小為,寬度為500,高度為350,并將背景色設置為××00666。然后制作所需的組件:制作滾動:點擊插入菜單選擇Flash動畫設計與...

關注微信

变脸官网查询