網頁制作06-html,css,javascript初認識のhtml如何建立超鏈接

超鏈接有外部鏈接、電子郵件鏈接、錨點鏈接、空鏈接、腳本鏈接

一、內部鏈接

與自身網站頁面有關的鏈接被稱為內部鏈接

1、創建內部鏈接

1)語法:

<a href="鏈接地址">

……

</a>

2)舉例應用:?

?3)實操代碼:

<body>計算:
<p>
1.<a href="1"> 1+1=?</a></p>
<p>
2.<a href="2">2+2=?</a></p>
<p>
3.<a href="3">3+3=?</a></p>
</body>

?2、鏈接的目標窗口

簡介:在創建網頁的過程中,默認情況下超鏈接在原來的瀏覽器窗口中打開,可以使用 target屬性來控制打開的目標窗口

1)語法:

_self? 在當前頁面中打開鏈接

_blank? 在一個全新的空白窗口中打開鏈接

_top? 在頂層框架中打開鏈接,也可以理解為在跟框架中打開鏈接

_parent? 在當前框架的上一層里打開鏈接

new??在一個全新的空白窗口中打開鏈接

二、錨點鏈接?

網站中經常會有一些文檔頁面由于文本或者圖像內容過多,。導致頁面過長,為了方便用戶查看文檔中的內容在文檔中需要進行錨點鏈接。

1、情景模擬:點擊2+2的鏈接,跳轉到答案4

2、步驟和語法:

1)建立錨點

<a name="錨點的名稱”></a>

2、鏈接同一頁面中的錨點?

<a href="#錨點的名稱”></a>

3、鏈接到其他頁面的錨點

首先在同一個目錄下新建一個答案頁面的html文件:

?<a href="鏈接的文件地址#錨點的名稱”></a>

?3、錨點演示代碼:

<hr>
計算:
<p>
1.<a href="#1" > 1+1=?</a></p>
<p>
2.<a href="#2" target="_parent">2+2=?</a></p>
<p>
3.<a href="答案頁面.html#3" target="new">3+3=?</a></p>
<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br><br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>
<a name="1">2</a>
<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br><br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>
<a name="2">4</a>
<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br><br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>.<br>
<a name="3">6</a>

三、外部鏈接

簡介:外部鏈接是指跳轉到當前網站之外的資源:網頁中最常用的是利用HTTP協議進行的外部鏈接是設置友情鏈接

1、基本語法

<a href="http://……">……</a>

2、友情鏈接演示效果:?

3、友情鏈接演示代碼:?

<hr>
<p>友情鏈接:</p>
<p><a href="http://www.baidu.com">百度</a></p>
<p><a href="http://www.sina.com">新浪</a></p>
<p><a href="https://www.csdn.net/">CSDN</a></p>	

四、鏈接到Email

1、簡介:

在網頁上創建Email鏈接,當瀏覽者點擊Email鏈接時,收件人的郵件地址有Email超鏈接中指定的地址自動更新無需瀏覽者輸入

2、語法:

<a href="mailto:郵件地址”……</a>

?3、點擊結果:

4、演示代碼

<hr>
<p> Email鏈接</p>
<p><a href="mailto:CYDBUSINESS@OUTLOOK.COM">感謝您的收看,點擊此處可以聯系小編</a></p>

五、鏈接到ftp

1、簡介:

Ftp是指文件傳輸協議,一個ftp站點通常包含一些容易上傳和下載文件的文件目錄。大部分的ftp網站需要一個用戶名和密碼來進入網站

2、語法:

<a href="ftp://ftp地址">……</a>

3、點擊結果:

4、演示代碼:

<a href="ftp://ftp.tsinghua.edu.cn">進入清華大學的ftp網站</a>

六、鏈接到telnet

1、簡介:

telnet,常常用來登錄一些bbs網站也是一種遠程登錄方式

2、語法:

<p><a href="telnet://地址">……</a></p>

七、下載文件

1、簡介:

如果要在網站中提供下載資料,就是要為文件提供下載鏈接。如果超鏈接指向的不是一個網頁文件,而是其他zip,mp3,a4v,exe等文件,單機鏈接的時候就會下載文件

2、語法

<p><a href="文件地址"></a></p>

3、?效果:

4、演示代碼:

<hr><p><a href="MOHA.mp3">MOHA音樂</a></p>

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/896127.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/896127.shtml
英文地址,請注明出處:http://en.pswp.cn/news/896127.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

MySQL后端返回給前端的時間變了(時區問題)

問題&#xff1a;MySQL里的時間例如為2025-01-10 21:19:30&#xff0c;但是返回到前端就變成了2025-01-10 13:19:30&#xff0c;會出現小時不一樣或日期變成隔日的問題 一般來說設計字段時會使用datetime字段類型&#xff0c;這是一種用于時間的字段類型&#xff0c;而這個類型…

【算法與數據結構】單調隊列

目錄 單調隊列 使用單調隊列維護滑動窗口 具體過程&#xff1a; 代碼實現&#xff1a; 復雜度分析&#xff1a; 使用單調隊列優化動態規劃 例題 單調隊列 單調隊列(deque)是一種特殊的隊列&#xff0c;隊列中的元素始終按嚴格遞增或者遞減排列。這樣就可以保證隊頭元素…

AutoGen 技術博客系列 九:從 v0.2 到 v0.4 的遷移指南

本系列博文在掘金同步發布, 更多優質文章&#xff0c;請關注本人掘金賬號&#xff1a; 人肉推土機的掘金賬號 AutoGen系列一&#xff1a;基礎介紹與入門教程 AutoGen系列二&#xff1a;深入自定義智能體 AutoGen系列三&#xff1a;內置智能體的應用與實戰 AutoGen系列四&am…

深度學習每周學習總結Y1(Yolov5 調用官方權重進行檢測 )

&#x1f368; 本文為&#x1f517;365天深度學習訓練營 中的學習記錄博客Y1中的內容 &#x1f356; 原作者&#xff1a;K同學啊 | 接輔導、項目定制 ** 注意該訓練營出現故意不退押金&#xff0c;惡意揣測偷懶用假的結果冒充真實打卡記錄&#xff0c;在提出能夠拿到視頻錄像…

為AI聊天工具添加一個知識系統 之117 詳細設計之58 思維導圖及觀察者效應 之2 概念全景圖

&#xff08;說明&#xff1a;本文和上一篇問題基本相同&#xff0c;但換了一個模型 deepseek-r1&#xff09; Q1227、在提出項目“為使用AI聊天工具的聊天者加掛一個專屬的知識系統”后&#xff0c;我們已經進行了了大量的討論-持續了近三個月了。這些討論整體淋漓盡致體現了…

2012年IMO幾何預選題第6題

設有非等腰的 △ A B C \triangle ABC △ABC, O O O 和 I I I 分別為外心和內心. 在邊 A C AC AC, A B AB AB 上分別存在兩點 E E E 和 F F F, 使得 C D C E A B CDCEAB CDCEAB, B F B D A C BFBDAC BFBDAC. 設 ( B D F ) (BDF) (BDF) 和 ( C D E ) (CDE) (CDE)…

為Eclipse IDE安裝插件IBM編程助手watsonx Code Assistant

從Eclipse IDE 安裝 從Eclipse IDE 安裝插件&#xff1a; _1、在Eclipse IDE 中&#xff0c;單擊幫助菜單&#xff0c;然后選擇EclipseMarketplace。 _2、根據您計劃進行的工作類型選擇安裝方式&#xff1a; 有關代碼建議、代碼解釋、代碼文檔和單元測試的集成生成式人工智能&a…

Linux基本指令(三)+ 權限

文章目錄 基本指令grep打包和壓縮zip/unzipLinux和windows壓縮包互傳tar&#xff08;重要&#xff09;Linux和Linux壓縮包互傳 bcuname -r常用的熱鍵關機外殼程序 知識點打包和壓縮 Linux中的權限用戶權限 基本指令 grep 1. grep可以過濾文本行 2. 把包含9的文本行過濾出來了 …

【部署優化篇十四】【十萬字全景拆解:GitHub Actions自動化流水線設計圣經(DeepSeek工業級實踐大公開)】

一、從手工作坊到智能工廠:CI/CD的革命之路 想象一下,你所在的公司每天要手工組裝1000臺手機,每個環節都靠老師傅肉眼檢查——這就是沒有CI/CD的軟件開發現狀。GitHub Actions的出現,就像給軟件交付裝上了特斯拉的超級工廠流水線。 DeepSeek的CI/CD演進史就是一部血淚史:…

“死”循環(查漏補缺)

以下代碼會死循環&#xff1a; #include<iostream> using namespace std; int n,res; int main(){cin>>n;for(int i1;i<n;i){int xi;while(i){int ti%10;i/10;if(t2||t0||t1||t9){resx;break;}}}cout<<res<<endl;return 0; } 你的代碼中存在一個邏…

力扣LeetCode: 2506 統計相似字符串對的數目

題目&#xff1a; 給你一個下標從 0 開始的字符串數組 words 。 如果兩個字符串由相同的字符組成&#xff0c;則認為這兩個字符串 相似 。 例如&#xff0c;"abca" 和 "cba" 相似&#xff0c;因為它們都由字符 a、b、c 組成。然而&#xff0c;"aba…

關于Java 反射的簡單易懂的介紹

目錄 #0.總覽 #1. 類的反射 ①介紹 ②獲取 ③作用 獲取構造函數&#xff1a; 創建實例&#xff1a; 字段操作&#xff1a; 方法操作&#xff1a; 獲取修飾符&#xff1a; #2.總結 #0.總覽 反射&#xff0c;官方是這樣介紹它的&#xff1a; Reflection is a …

【精調】LLaMA-Factory 快速開始1: Meta-Llama-3.1-8B-Instruct

llamafactory-cli train examples/train_lora/llama3_lora_sft.yaml llamafactory-cli chat examples/inference/llama3_lora_sft.yaml llamafactory-cli export examples/merge_lora/llama3_lora_sft.yaml模型下載 git clone https://www.modelscope.cn/LLM-Research/Meta-Lla…

【07】區塊鏈性能

7-1 基礎性能優化 7-1-1 區塊鏈性能瓶頸 總述 區塊鏈性能指標 區塊鏈的性能指標主要包括&#xff1a; 吞吐量&#xff1a;在固定時間內處理的交易數量 延時&#xff1a;對交易的響應和處理時間 主流區塊鏈與中心化平臺TPS對比 區塊鏈與傳統計算的對比 區塊鏈可信且中立…

安全面試2

文章目錄 簡單描述一下什么是水平越權&#xff0c;什么是垂直越權&#xff0c;我要發現這兩類漏洞&#xff0c;那我代碼審計要注意什么地方水平越權&#xff1a;垂直越權&#xff1a;水平越權漏洞的審計重點垂直越權漏洞的審計重點 解釋一下ssrf漏洞原理攻擊場景修復方法 橫向移…

【Linux 專欄】echo命令實驗

風123456789&#xff5e;-CSDN博客 最近文章閱讀排行榜 【爬蟲基礎】第一部分 網絡通訊 P1/3-CSDN博客 【爬蟲基礎】第一部分 網絡通訊-Socket套接字 P2/3-CSDN博客 【Linux專欄】find命令同步 實驗-CSDN博客 【Linux運維】非root用戶的單向免密登錄_linux 單向免密-CSDN博客…

RTSP協議全解析

RTSP&#xff08;Real Time Streaming Protocol&#xff09;協議全解析 一、協議概述 定位&#xff1a;應用層協議&#xff0c;用于控制流媒體服務器&#xff08;播放、暫停、錄制&#xff09;&#xff0c;媒體傳輸由 RTP/RTCP 實現。 特點&#xff1a; 基于文本&#xff08;…

第15屆 藍橋杯 C++編程青少組中/高級選拔賽 202401 真題答案及解析

第 1 題 【 單選題 】 表達式117 % 16 的結果是( )。 A:0 B:5 C:7 D:10 解析: % 是取模運算符,用于計算兩個數相除后的余數。 計算 117 / 16,結果是 7,余數是 5。因此,117 % 16 = 5。答案: B 第 2 題 【 單選題 】 下列選項中,字符數組定義正確的是( …

qt5實現表盤的旋轉效果,通過提升QLabel類

因為工作需要&#xff0c;需要實現溫度的表盤展示效果 實現思路&#xff1a; 通過提示聲QLabel控價類&#xff0c;實現報盤的旋轉和展示效果 1. 編寫一個QLabel的類MyQLabel,實現兩個方法 1. void paintEvent(QPaintEvent *event); //重繪函數 2. void valueChanged(int va…

通信系統中物理層與網絡層聯系與區別

在通信系統中&#xff0c;物理層和網絡層是OSI&#xff08;開放系統互連&#xff09;模型中的兩個重要層次&#xff0c;分別位于協議棧的最底層和第三層。它們在功能、職責和實現方式上有顯著的區別&#xff0c;但同時也在某些方面存在聯系。以下是物理層與網絡層的聯系與區別的…