VisualStudio怎么給網(wǎng)頁插入全屏顯示的背景圖片?
我要評論Visual Studio中想要給網(wǎng)頁制作背景圖，該怎么插入背景圖呢？下面我們就來看看詳細(xì)的教程。
1、首先，Visual Studio打開一個(gè)網(wǎng)站，本例為TwoFish，在網(wǎng)站中已放置了圖片資源，以及需使用的css樣式和js代碼。
2、首先，在網(wǎng)頁中找到body標(biāo)簽，如下圖所示。
3、接著找到div標(biāo)簽，如下圖所示。
4、輸入添加背景圖片的代碼，其中img是表示圖片的標(biāo)簽。
5、src是圖片保存的路徑，id則表示圖片屬性，即為背景。
6、找到head和meta標(biāo)簽，將光標(biāo)定位到title標(biāo)簽之后。
7、接著，插入css樣式代碼。link標(biāo)簽用來引用css樣式，href用來指定css的路徑，rel表示當(dāng)前文檔與鏈接文檔之間的關(guān)系。
8、然后，插入js代碼。用script標(biāo)簽引用js文件，src表示js文件的路徑，
9、控制圖片顯示的代碼，都已放在相應(yīng)的css樣式和js代碼中了，這里就不再贅述了。
10、最后，用script標(biāo)簽引用一個(gè)函數(shù)，實(shí)現(xiàn)將圖片設(shè)置為全屏的背景。
11、在網(wǎng)頁文件上右擊，選擇在瀏覽器中查看選項(xiàng)。
12、看到圖片在網(wǎng)頁中，作為背景全屏顯示了。
以上就是Visual Studio中制作全屏顯示背景圖的教程，希望大家喜歡，請繼續(xù)關(guān)注腳本之家。
相關(guān)推薦：
VS 2012變量自動(dòng)連接時(shí)的背景色怎么更換?
Visual Studio 2015怎么改變WPF窗體程序的背景圖片?
相關(guān)文章
VisualStudio使命使用代碼實(shí)現(xiàn)網(wǎng)頁的整體布局?
VisualStudio使命使用代碼實(shí)現(xiàn)網(wǎng)頁的整體布局？Visual Studio中想要使用代碼實(shí)現(xiàn)網(wǎng)頁布局，該怎么制作呢？下面我們就來看看詳細(xì)的教程，需要的朋友可以參考下2018-04-11
vscode如何關(guān)閉自動(dòng)更新提示?visual studio code禁止自動(dòng)更新的方法介
最近，很多網(wǎng)友問小編vscode如何關(guān)閉自動(dòng)更新提示?今天小編就給大家詳細(xì)介紹一下visual studio code禁止自動(dòng)更新的方法，非常簡單，需要的朋友一起去了解一下吧2018-04-11
visual studio code怎么改快捷鍵？vscode修改默認(rèn)快捷鍵的方法介紹
使用vscode時(shí)，經(jīng)常會(huì)遇到和其他軟件快捷鍵沖突的問題，這個(gè)時(shí)候我們需要修改快捷鍵，那么，visual studio code怎么改快捷鍵？今天小編就給大家詳細(xì)介紹一下vscode修改默認(rèn)2018-04-11
VisualStudio2015怎么設(shè)置字體格式? vs設(shè)置字體樣式的教程
VisualStudio2015怎么設(shè)置字體格式？vs2015中想要對文本編輯器中的字體格式大小進(jìn)行編輯，該怎么實(shí)現(xiàn)呢？下面我們就來看看vs設(shè)置字體樣式的教程，需要的朋友可以參考下2018-04-10
vscode(Visual Studio Code)配置PHP開發(fā)環(huán)境的方法(已測)
Visual Studio Code一個(gè)輕量且強(qiáng)大的代碼編輯器，支持Windows，OS X和Linux。內(nèi)置JavaScript、TypeScript和Node.js支持，而且擁有豐富的插件生態(tài)系統(tǒng)，可通過安裝插件來支2018-04-06Windows下Visual Studio Code 快捷鍵大全
Visual Studio Code 是一款優(yōu)秀的編輯器，非常適合編寫 TS 以及 React 。最近在學(xué)習(xí) AngularJs 2，開始使用 VSCode，特意整理翻譯了一下官網(wǎng)的快捷鍵2018-04-05Visual Studio Code 使用指南(vscode技巧)
VSCode是微軟推出的一款輕量編輯器，采取了和VS相同的UI界面，搭配合適的插件可以優(yōu)化前端開發(fā)的體驗(yàn)，這里為大家介紹一下vscode的技巧,需要的朋友可以參考下2018-04-05visual studio code教程 vscode的基礎(chǔ)使用和自定義設(shè)置方法
這篇文章主要基于基礎(chǔ)web前端開發(fā)，visual studio code教程——基礎(chǔ)使用、擴(kuò)展插件安裝使用以及少許自定義配置,需要的朋友可以參考下2018-04-04
VS Code有哪些常用的快捷鍵? Visual Studio Code常用快捷鍵大全
Visual Studio Code簡稱VSCode，是一款好用的代碼編輯器，最近，很多網(wǎng)友問小編VS Code有哪些常用的快捷鍵?今天小編就給大家整理了最高效的Visual Studio Code常用快捷鍵大2018-04-03
visualstudio怎么刪除代碼段管理器? vs代碼段管理器的移除方法
visual studio怎么刪除代碼段管理器？visual studio暫時(shí)不用代碼段管理器，該怎么刪除呢？下面我們就來看看vs代碼段管理器的移除方法，需要的朋友可以參考下2018-03-26
