適合0基礎的web開發系列教程-教程概述
教程概述
各位網友大家好,我是夜鷹教程網的湯老師,從今天開始,我準備寫一套web前端開發的教程。
適合0基礎的朋友,從最簡單的html開始。
力爭做到學完全套教程能在IT行業就業的水平。
特別適合應屆畢業生、已上班但是想轉行的朋友、喜歡前端開發的業余愛好者。
學習路線為:
html =>css=>javascript=>jquery=>h5=>css3=>nodejs=>mongodb=>git>grunt=>webpack=>less=>sass=>bootstrap=>vue/react/angularjs=>webapp=>微信小程序=>全棧開發=>Typescript/es6/es7=>其他。
本套教程由配套的視頻教程,後續會開在線直播,敬請關註。
由於本人水平有限,加上時間緊迫,如果對文章有異議或者需要遠程技術支持,請聯系QQ:1416759661 微信號:yyjcw10000
官網地址:https://www.yyjcw.com
什麽是html
html是超文本標記語言(英語:HyperText Markup Language,簡稱:HTML).
所謂的超文本,就是在網頁中傳輸的內容不僅僅是文本,還可能包含圖片、音樂、視頻等其他多媒體內容。
html主要就是用來做網頁的。
不管是pc端,還是移動端的網頁,都必須用html來編寫,通過瀏覽器來解析。
第一個網頁代碼
下面來看第一個簡單的html頁面代碼:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>夜鷹教程網(yyjcw.com)</title> </head> <body> <h1>我的第一個標題</h1> <p>我的第一個段落。</p> </body> </html>
一個網頁就是由這種成雙成對的代碼組成的。
<!DOCTYPE html> :文檔聲明,瀏覽器在解析這個文檔的時候,就知道是一個html文檔,就按照html文檔的方式來解析它。
<html>和</html> :整個文檔的根節點。
<head>和</head> :網頁的頭部。
<title>和</title>:顯示網頁的標題。
<body>和</body> :body裏面定義的內容就會在瀏覽器裏面顯示。
h1:表示顯示一個標題。
p :顯示一個段落。
開發環境
這些代碼寫在哪裏,又在哪裏才能看到效果?
你需要安裝兩款工具:hbuilder 和 chrome瀏覽器
開發html代碼可以使用任何一款文本編輯器,比如hbuilder、subline、webstorm、記事本等。
初學者推薦使用hbuilder這個工具。
下載地址:
http://download.dcloud.net.cn/HBuilder.9.1.25.windows.zip
這個工具是綠色版本的,解壓就可以使用。
打開後新建一個web站點,在站點裏面新建一個html文件,然後就可以編寫html代碼了。
第一個頁面就介紹到這裏。
適合0基礎的web開發系列教程-教程概述