網(wǎng)頁的開發(fā)怎么做？新手入門教程看這篇就夠了！
今天心血來潮，想搞個(gè)自己的網(wǎng)頁玩玩，之前一直沒動(dòng)手，今天就來試試看。
準(zhǔn)備工作
我得有個(gè)地方寫代碼。我電腦里頭有之前下載的VSCode，聽說這玩意兒挺好使，就用它。打開VSCode，新建一個(gè)文件，保存的時(shí)候，我給它起個(gè)名字叫“*”。這名字隨便起的，關(guān)鍵是后面這個(gè)“.html”，告訴電腦這是個(gè)網(wǎng)頁文件。
搭骨架
有文件，接下來就是往里頭填東西。我記得網(wǎng)頁得有個(gè)基本結(jié)構(gòu)，就像蓋房子得先搭框架一樣。我在網(wǎng)上搜一下，復(fù)制這么一段代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>我的第一個(gè)網(wǎng)頁</title>
</head>
<body>
</body>
</html>
這段代碼，我大概能看懂個(gè)意思。最外頭是<html></html>包起來，里頭分兩塊，一個(gè)是<head></head>，一個(gè)是<body></body>。聽說<head>里頭放的是一些網(wǎng)頁的配置信息，<body>里頭放的是網(wǎng)頁上能看到的內(nèi)容。我先在<title></title>中間寫上“我的第一個(gè)網(wǎng)頁”，那一會(huì)兒打開網(wǎng)頁，瀏覽器標(biāo)簽上應(yīng)該顯示這個(gè)。
填充內(nèi)容
有骨架，接下來就是在<body>里頭填內(nèi)容。我先寫個(gè)“Hello, World!”，這算是程序員的傳統(tǒng)。直接在<body>和</body>中間打上這幾個(gè)字就行。
加點(diǎn)料
光禿禿的幾個(gè)字，看著也太單調(diào)。我琢磨著加點(diǎn)別的。聽人家說，<p></p>是段落標(biāo)簽，我試著把“Hello, World!”用這個(gè)包起來，看看效果。
<body>
<p>Hello, World!</p>
</body>
然后，我又加一行字：“這是我做的第一個(gè)網(wǎng)頁！”也用<p></p>包起來。
<body>
<p>Hello, World!</p>
<p>這是我做的第一個(gè)網(wǎng)頁！</p>
</body>
保存文件，雙擊打開“*”，瀏覽器里頭就顯示出這兩行字！有點(diǎn)意思！
加個(gè)標(biāo)題
我覺得，還得加個(gè)標(biāo)題，看起來更像個(gè)樣子。聽說<h1></h1>是最大的標(biāo)題，我就用它。在<body>的最上頭，我加這么一行：
<body>
<h1>我的個(gè)人主頁</h1>
<p>Hello, World!</p>
<p>這是我做的第一個(gè)網(wǎng)頁！</p>
</body>
再來點(diǎn)兒花樣
光是文字，還是有點(diǎn)單調(diào)。我想加個(gè)列表，列出我喜歡的東西。聽說<ul></ul>是無序列表，<li></li>是列表項(xiàng)，我試試：
<body>
<h1>我的個(gè)人主頁</h1>
<p>Hello, World!</p>
<p>這是我做的第一個(gè)網(wǎng)頁！</p>
<p>我喜歡的東西：</p>
<ul>
<li>看電影</li>
<li>聽音樂</li>
<li>打游戲</li>
</ul>
</body>
保存，刷新瀏覽器，列表出來！
今天就先折騰到這兒，雖然簡單，但好歹是我親手做出來的第一個(gè)網(wǎng)頁，還挺有成就感的！以后再慢慢學(xué)，加點(diǎn)圖片、鏈接啥的，讓它更豐富些！