第12節 html建立熱點區域連結

阿新 • • 發佈：2019-02-13

熱點區域連結

例如：

<html>
    <head>
        <title>使用文字建立超連結</title>
    </head>
    <body>
        <!--內部特定目標跳轉 將需要跳轉的文字包起來-->
        <p>實現特定<a href="https://www.baidu.com/">目標</a>跳轉</p>
        <!--實現影象超連結-->
        <a href="http://www.csdn.net/" 
><img src="D:\溫習網頁\favicon.ico" width="100" height="100"></a>
        <br/>
        <!--電子郵件超連結-->
        郵箱地址：<a href="http://mail.163.com/">123456789</a>@163.com
        <br/>
        <!--以新視窗顯示連結頁面  新增target屬性值設定為_blank-->
        以<a href="https://www.baidu.com/" 
 target="_blank">新視窗方式開啟一個網頁
        <br/>
        <!--建立熱點區域 難點是找準影象的座標-->
        <!--img圖片標籤 border是制定圖片沒有邊框 usemap是指定使用圖片的地圖名
        值必須加上#和地圖的名字
        map地圖標籤 name是地圖的名字
        area是區域屬性
        shape是區域的形狀 rect矩形 circle橢圓 poly多邊形
        coords是座標屬性：
        rect矩形（左上角x，y，右下角x,y）
        circle橢圓（圓心x,y,半徑r）
        poly多邊形(多邊形個點的座標)--> 

        <img src="D:\溫習網頁\bd_logo1_31bdc765.png" border="0" usemap="#Mapl">
        <map name="Mapl">
            <area shape="rect" coords="23,28,111,81" href="D:\溫習網頁\字型樣式.html">
            <area shape="circle" coords="187,57,33" href="D:\溫習網頁\字型樣式.html">
            <area shape="poly" coords="271,12,321,23,321,80,275,87,251,49" href="D:\溫習網頁\字型樣式.html">
        </map>
    <body>
</html>

第12節 html建立熱點區域連結

熱點區域連結例如： <html> <head> <title>使用文字建立超連結</title> </head

html--建立熱點區域

　　在瀏覽網頁時，通常會出現在點選一張圖片不同區域時，出現不同連結內容的情況，這就是圖片的熱點區域。所謂的熱點區域，就是將一張圖片劃分成若干連結區域，訪問者單擊不同的區域，會連結到不同的目標頁面。　　在HTML5中，可以為圖片建立3中型別的熱點區域：矩形，圓形和多邊形。建立熱點區域使用<map>

c# 第12節分支語句if、switch、三位運算符

等於 readline 比較適應 som 提示 con 大於等於 int 本節內容： 1：流程控制語句分類 2：分支語句之if的使用 3：分支語句之switch的使用 4：分支語句之三位運算符 5：分支語句比較 1：流程控5:制語句分類 2：

第七節：建立裏程碑

blog pos wid div 9.png post nbsp image inf 第七節：建立裏程碑

Java高階架構師（一）第12節：Service的實現以及模組化

BaseService.java package com.sishuok.architecture1.common.service; import java.util.List; import com.sishuok.architecture1.common.dao.BaseDAO; import

第六節 Html的標記屬性

html標記屬性例如： <html> <head> <title>html的標記屬性</title> </he

C語言第 12節從氣泡排序-看你適不適合做軟體開發

#include <stdio.h> void exchange(int *p, int len); int main() { int array[10] = {1, 3, 2, 5,

第23節 html頁面過渡效果

網頁過渡效果首頁 <html> <head> <title>首頁</title> </head>

第12節 while循環

small mes print ESS 條件 break 結果 bsp while 例1count=0while True: print("count:",count) count=count+1 // count+=1輸出結果：count: 230033

HTML學習筆記 CSS學習選擇器第五節（原創）

ext spa family 如果 styles ctype css gre utf <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <

HTML學習筆記 CSS樣式第六節（原創）

Y軸重復 eight -i tac 圖片 500px itl idt <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title&

HTML學習筆記 CSS學習選擇器案例第五節（原創）參考使用表

樣式 back ack aid head 派生選擇器 char logs pan <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

HTML學習筆記 CSS背景樣式案例第六節（原創）參考使用表

ext jpg class 設置 link eight text spa .com <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

學習HTML 第四節.插入圖像

htm 分享 info pan tro meta 標題 log doctype 學習HTML 第四節.插入圖像全是文字的網頁太枯燥了吧，我們來搞個圖片上去！ <!DOCTYPE html><html><head><meta cha

學習HTML 第五節.簡單交互

col 技術分享 image oct char ali 在屏幕上打開網頁交互學習HTML 第五節.簡單交互也許你和我一樣，對頁面排版的興趣小於網頁交互，那麽我們就先略過一些章節，直接學一下簡單交互。前面點擊圖片打開鏈接的網址，已經是最簡單的交互方式了，復雜的方式則

第12課：HTML+CSS的基礎用法

日常使用 mil rtc 一行 ade user 新頁面 form -s 1. html之head部分的常用標簽的使用  <!DOCTYPE html> <html lang="en

第213天：12個HTML和CSS必須知道的重點難點問題

ie7 html 技術 article 就會 cap 簡述同時存在空間 12個HTML和CSS必須知道的重點難點問題這12個問題，基本上就是HTML和CSS基礎中的重點個難點了，也是必須要弄清楚的基本問題，其中定位的絕對定位和相對定位到底相對什麽定位？這個還是容易被

HTML學習筆記 iframe引用頁面按列(針對target打開方式解釋) 第九節（原創）

type head -- eight frame top target span utf <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"&

HTML學習筆記 w3sCss盒子模型（陰影）（div的一些使用）案例第十節（原創）參考使用表

idt pac cin head src 模型圖 div 盒子模型樣式 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

html--創建熱點區域

nbsp 內容超鏈接 color 一個創建熱點語法如果使用　　在瀏覽網頁時，通常會出現在點擊一張圖片不同區域時，出現不同鏈接內容的情況，這就是圖片的熱點區域。所謂的熱點區域，就是將一張圖片劃分成若幹鏈接區域，訪問者單擊不同的區域，會鏈接到不同的目標頁面。　　在

第12節 html建立熱點區域 連結

熱點區域連結

相關推薦

第12節 html建立熱點區域連結