鏈接標簽是HTML頁面中最為常見,而且用途最廣的一個標簽,只要我們瀏覽網頁,就會有超鏈接。比如,通過點擊新聞標題鏈接到新聞詳情頁面,通過點擊商品名稱鏈接到商品列表或者詳情頁等等。
anchor , 錨
在HTML中創建超鏈接,只需用a標簽包括被鏈接的對象
<a href="跳轉目標" target="目標窗口的彈出方式">文本或圖像</a>
href:用于指定鏈接目標的url地址,必須屬性
target:用于指定鏈接頁面的打開方式,其取值有 self和 _blank兩種,其中 _self為默認值,_blank為在新窗口中打開方式
(1)當需要鏈接到 外部鏈接時,需要添加 http://
(2)當需要內部鏈接時,直接鏈接內部頁面名稱即可 如 < a href=“index.html”> 首頁
(3)如果暫時沒確定鏈接目標時,一般將href屬性值定義為“#”,表示暫時為一個空鏈接
(4)不僅可以創建文本超鏈接,在網頁中各種網頁元素,如圖像、表格、音頻、視頻等都可以添加超鏈 接, 只要用a標簽包括即可
在當前html頁面上,通過創建錨點鏈接,用戶能夠快速定位到指定內容。
適用于內容較多的頁面,通過點擊關鍵詞,可以快速到達指定區域。
(1)使用唯一的id標注目標位置
(2)使用<a href="#id名“>鏈接文本創建鏈接
在html頁面中,有些符號直接添加是無法正常顯示的,這個時候就用一些特殊的標簽來表示這類符號,而這類特殊的標簽,我們就叫做特殊字符標簽。
全棧攻城獅-每日更新原創IT編程技術及日常實用視頻。
主要內容:這是HTML課程的第五課,主要講解HTML的圖片和超鏈接。讓自己設計的網頁更加多元素。
在上節中主要講解了HTML的文字標簽和格式標簽。上篇請戳→→04程序員定要學HTML,字體段落標簽介紹,60秒搞定
其實如果沒有記住也無所謂。畢竟這些標簽都是HTML中比較常用的,在以后的相關的案例中也會使用。此系列教程主要講解HTML從基礎到精通。自己能夠設計一個完整的前端網頁項目。
程序員寫代碼
在HTML中添加圖片其實很簡單,就是添加一個img的標簽。
圖片標簽的語法
一般有src、alt、width、height四種屬性就夠用了。
效果:
圖片的顯示效果
src表示的是圖片的路徑,這里面的值應該怎么寫呢?
(1)html文件和圖片在相同一個文件夾下。
HTML文件和圖片文件在相同的目錄下,可以直接書寫文件的名稱。
寫文件名的寫法,如上面的HTML
(2)圖片在HTML文件所在目錄的文件夾內:
如圖:
圖片文件在文件夾內
此時需要加上文件夾名稱,并加上“/”表示下層目錄:
下層目錄的圖片寫法
(3)圖片文件在上層目錄
如果圖片在HTML文件所在的上層目錄,則需要寫“..”表示向上一級。如圖:
上層目錄
超鏈接就是可以鏈接到某個資源的東西,比如我們打開百度首頁搜索后,產生的就是超鏈接:
這些藍字超鏈接
這些藍色的文字標題,我們點擊之后可以跳轉到新的網站。這就是超鏈接。下面我們自己寫一個超鏈接:
超鏈接的寫法
超鏈接預覽
超鏈接中的潮涌屬性包括:href(網頁地址)、title(說明描述)、target(打開網頁的位置)、name(名稱)。
其中href支持帶有任何協議的連接。title是對超鏈接的說明。
程序員
target包括四個值:
_blank
在新的窗口打開連接
_self
在當前窗口打開超鏈接
_parent
在父窗口打開超鏈接,這個后面會說,不常用
_top
在整個窗口中打開被鏈接文檔。
每天一個知識點,帶你邁向軟件編程大神,一起努力吧。
HTML文檔由HTML元素組成,一個HTML元素由一個標簽和一組屬性組成。一個標簽可以有一個或多個屬性,屬性以名稱和值成對出現。Web 瀏覽器讀取HTML 文檔,并以網頁的形式顯示出來,瀏覽器不會顯示 HTML 標簽,而是通過標簽來解釋網頁的內容。
HTML(Hyper Text Mark-up Language超文本標記語言):不是編程語言,而是一種描述性的標記語言,用于描述網頁中內容的顯示方式,比如文字以什么顏色、大小來顯示等,這些都是利用Html標記來實現。
HTML標簽是由尖括號(“<”和“>”)包圍的關鍵詞,如標簽 <p>。標簽不區分大小寫,故 <p> 和 <P> 的含義相同,不過推薦使用小寫。
HTML標簽通常成對出現,一個是開始標簽,一個是結束標簽。開始標簽告訴瀏覽器,從這里開始執行該標簽所表示的功能;結束標簽告訴瀏覽器,該功能到這里結束。在開始標簽前加一個斜杠(/)即成為結束標簽。如,html 元素的開始標簽是 <html>,結束標簽是</html>。也就是說,一個HTML 元素由開始標簽、內容、結束標簽組成。開始標簽是放在一對尖括號中的元素名稱及可能包含的屬性,結束標簽是放在一對尖括號中的斜杠加元素的名稱。語法格式為:<開始標簽>內容</結束標簽>。如,em 元素的開始標簽為<em>,結束標簽為 </em>,在<em> 和 </em> 標簽之間是元素的內容。如下圖所示:
所有的網頁文件,通過都是四對標記來構成文檔的骨架,它們是:
小結:
1. 單標記
一.<標記名稱>
單一型,無屬性值
如:<br/>——表示換行符
二.<標記名稱屬性=”屬性值”>
單一型,有屬性值
如:<hr width=”80%”/>
2. 雙標記
三.<標記名稱>…</標記名稱>
沒有屬性值
如:<title>…<title>
四.<標記名稱屬性=”屬性值”>…</標記名稱>
有屬性值
如:<body bgcolor=”red”>…</body>
注釋
格式:
<!—注釋內容-->
Body屬性
<body bgcolor=”背景顏色” background=”背景圖像” text=”文本顏色” link=”鏈接文本顏色” vlink=”訪問過的文本顏色” alink=”激活的連接文本顏色” leftmargin=”左邊界”>
語法:
<font color=”文本顏色” size=“字號”>文本</font>
格式:
<p align=“對齊方式”>…</p>
修飾標記
水平直線<hr/>
有小伙伴私信小編,零基礎入門前端很吃力,許多地方根本不知道應該怎么進行下去。
因此小編收集了一套前端零基礎入門的視頻教程(學完就可以去找工作哦)今天免費分享給大家。
希望小伙伴們可以對照著小編文中提到的知識點一步步學習,最終可以找到適合自己的工作!但還是那句話,如果你不努力,就算有千萬個人幫助你,最終也會一事無成!
教程目錄大綱:
*請認真填寫需求信息,我們會在24小時內與您取得聯系。