本例演示如何向 HTML 頁面添加背景圖片。
<html>
<body background="background.jpg">
<h3>圖像背景</h3>
<p>gif 和 jpg 文件均可用作 HTML 背景。</p>
<p>如果圖像小于頁面,圖像會進行重復。</p>
</body>
</html>
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
在整個窗口中打開被鏈接文檔。
每天一個知識點,帶你邁向軟件編程大神,一起努力吧。
碼/視頻評論后加前端學習群470593776
知識點:浮動定位布局切換技巧,js鼠標事件,拖拽功能
碰撞檢測,原生js運動框架,2017年就業形勢分析,面試技巧等
源碼/視頻評論后加前端學習群470593776
源碼/視頻評論后加前端學習群470593776
*請認真填寫需求信息,我們會在24小時內與您取得聯系。