html網(wǎng)頁(yè)插入圖片、加入地圖索引示例講解
來(lái)源:易賢網(wǎng) 閱讀:817 次 日期:2014-09-23 15:52:28
溫馨提示:易賢網(wǎng)小編為您整理了“html網(wǎng)頁(yè)插入圖片、加入地圖索引示例講解”,方便廣大網(wǎng)友查閱!

一、WEB上支持的圖片格式:

GIF:能保存256中顏色,支持透明色,支持動(dòng)畫效果

JPEG:不支持透明色和動(dòng)畫,顏色可達(dá)1670種

PNG:支持透明色,不支持動(dòng)畫,顏色有幾種到1670種

二、將圖片插入到網(wǎng)頁(yè)中使用<img/>標(biāo)簽:

src:設(shè)置圖片,值等于一個(gè)圖片文件的路勁

height:設(shè)置圖片的高,值以像素或百分比表示(會(huì)自動(dòng)按比例縮放)

width:設(shè)置圖片的寬,值以像素或百分比表示

border:為圖片加上邊框

alt:圖片說(shuō)明文字,當(dāng)圖片不在顯示的時(shí)候會(huì)顯示該屬性的值

title:該屬性表示當(dāng),鼠標(biāo)放在該圖片上時(shí)會(huì)顯示該屬性的值

align:屬性值=left圖片靠左,文字靠右

right圖片靠右,文字靠左

top文字垂直居上靠

middle文字垂直居中

bottom文字垂直居下(默認(rèn))

vspace:屬性值是像素,定義圖片頂部和底部的空白

hspace:屬性值是像素,定義圖片左邊和右邊的空白

代碼如下:

<imgsrc="../../../素材庫(kù)/001.jpg"height="300"width="200"border="10"alt="安踏正版"title="安踏正版"hspace="20"vspace="20"/>

<p>

<!--圖文混排-->

<imgsrc="../../../素材庫(kù)/001.jpg"height="300"width="200"align="left"/>

11、考試考得好,全靠同桌好。</p>

<p>12、在學(xué)校是那錢混日子,現(xiàn)在是拿日子混錢!</p>

<p>13、一些人,總要出賣他所有的,去換取他所沒(méi)有的。</p>

<p>14、自愛(ài),必先自私,唯有自私,才能大愛(ài)。</p>

<p>15、吉尼斯紀(jì)錄:全世界最大的茶幾面積為960萬(wàn)平方千米,可放置13億杯具。</p>

<p>16、分手多沒(méi)意思,有本事咱倆玩離婚!</p>

<p>17、走人民幣的路,讓人民無(wú)路可走!</p>

<p>18、三鹿奶粉,后媽的選擇。</p>

<p>19、有一天小三哭了,因?yàn)槌霈F(xiàn)了小四!</p>

<p>20、和你分手,因?yàn)椋氵B牽手都不配!</p>

<p>21、別在我面前擺POSE,我真怕忍不住想摔相機(jī)。</p>

<p>22、我們只是路人甲乙丙丁,在這花花世界集體游戲。無(wú)論你輸我贏,到最后咱們都會(huì)一起GameOver!</p>

<p>23、我這一生一共做錯(cuò)兩件事,其一是生出來(lái),另一是活下去。</p>

<p>24、如果我死了,我的第一句話是:老子終于不用怕鬼了。</p>

<p>25、哥是文明人,所有臟話均已使用唾液消毒。</p>

<p>26、名人名言,你得先是名人了那才是名言,別人的屁都是名屁!你能比嗎?</p><!--使用圖像作為超鏈接用圖像做超鏈圖像會(huì)自動(dòng)加上淺藍(lán)色的邊框點(diǎn)擊了超鏈接后會(huì)變成紫色邊框可以使用img標(biāo)簽中的border屬性就邊框去掉-->

<ahref="#"><imgsrc="../../../素材庫(kù)/yingyue.png"border="0"alt="京津冀"/></a>

三、HTML地圖索引:

地圖索引,也就是用一樣圖片中的某一部分做超鏈接,可以做很多個(gè)超鏈接(使用設(shè)計(jì)視圖就可以搞定)

代碼如下:

<!--

格式:<mapname="圖象名稱"id="圖象名稱">

<areashape="選取區(qū)塊的形狀"coords="坐標(biāo)"href="URL"alt="文字說(shuō)明">

</map>

<imgsrc="URL"USEMAP="#圖象名稱">

<map>聲明整張圖使用地圖鏈接方式進(jìn)行連接.

name,id指此圖的名稱.

<area>表示我們所要鏈接其中一點(diǎn)的區(qū)快

shape表示我們所選擇的形狀,如:rect矩形circle圓poly多邊形

coords表示地圖的坐標(biāo)位置!!

-->

<imgsrc="../../../素材庫(kù)/42a98226cffc1e173ec6f5894b90f603738de909.jpg"alt="MM"width="200"height="300"hspace="20"border="0"align="left"usemap="#Map"title="MM"/>

<mapname="Map"id="Map">

<areashape="rect"coords="39,99,76,137"href="#"alt="打你哦"/>

<areashape="circle"coords="94,200,17"href="#"alt="好大"/>

<areashape="poly"coords="87,50,119,50,121,70,91,67"href="#"alt="myeyes"/>

</map>

為網(wǎng)頁(yè)添加圖標(biāo):<linkrel="shortcuticon"href="文件路勁名稱.ico"type="image/x-icon">放在<head>頭部標(biāo)簽內(nèi)

更多信息請(qǐng)查看IT技術(shù)專欄

更多信息請(qǐng)查看網(wǎng)頁(yè)制作
易賢網(wǎng)手機(jī)網(wǎng)站地址:html網(wǎng)頁(yè)插入圖片、加入地圖索引示例講解
由于各方面情況的不斷調(diào)整與變化,易賢網(wǎng)提供的所有考試信息和咨詢回復(fù)僅供參考,敬請(qǐng)考生以權(quán)威部門公布的正式信息和咨詢?yōu)闇?zhǔn)!
相關(guān)閱讀網(wǎng)頁(yè)制作

2025國(guó)考·省考課程試聽(tīng)報(bào)名

  • 報(bào)班類型
  • 姓名
  • 手機(jī)號(hào)
  • 驗(yàn)證碼
關(guān)于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡(jiǎn)要咨詢 | 簡(jiǎn)要咨詢須知 | 加入群交流 | 手機(jī)站點(diǎn) | 投訴建議
工業(yè)和信息化部備案號(hào):滇ICP備2023014141號(hào)-1 云南省教育廳備案號(hào):云教ICP備0901021 滇公網(wǎng)安備53010202001879號(hào) 人力資源服務(wù)許可證:(云)人服證字(2023)第0102001523號(hào)
云南網(wǎng)警備案專用圖標(biāo)
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關(guān)注公眾號(hào):hfpxwx
咨詢QQ:526150442(9:00—18:00)版權(quán)所有:易賢網(wǎng)
云南網(wǎng)警報(bào)警專用圖標(biāo)