Web前端入門(mén)級(jí)教程學(xué)習(xí)（一）_第1頁(yè)
Web前端入門(mén)級(jí)教程學(xué)習(xí)（一）_第2頁(yè)
Web前端入門(mén)級(jí)教程學(xué)習(xí)（一）_第3頁(yè)
Web前端入門(mén)級(jí)教程學(xué)習(xí)（一）_第4頁(yè)
Web前端入門(mén)級(jí)教程學(xué)習(xí)（一）_第5頁(yè)
已閱讀5頁(yè)，還剩1頁(yè)未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

Web前端入門(mén)教學(xué)（一）1、什么是前端前端對(duì)于網(wǎng)站來(lái)說(shuō)，通常是指網(wǎng)頁(yè)，網(wǎng)站的前端部分包括網(wǎng)站的表現(xiàn)層和結(jié)構(gòu)層。因此前端技術(shù)一般分為前端設(shè)計(jì)和前端開(kāi)發(fā)。前端設(shè)計(jì)一般可以理解為網(wǎng)站的視覺(jué)設(shè)計(jì)，比如UI設(shè)計(jì)；前端開(kāi)發(fā)則是網(wǎng)站的前臺(tái)代碼實(shí)現(xiàn)，包括基本的HTML和CSS以及JavaScript等。前端開(kāi)發(fā)的核心部分主要是：HTML，CSS，JavaScript

三個(gè)部分。HTML

是這三者中最基礎(chǔ)的部分，相當(dāng)于是網(wǎng)頁(yè)的骨架，也就是網(wǎng)頁(yè)的結(jié)構(gòu)；

CSS

部分是網(wǎng)頁(yè)的表現(xiàn)形式，也可以說(shuō)是網(wǎng)頁(yè)的美化，比如一個(gè)圖片的大小、位置，文字的大小顏色等；

JavaScript

是一種動(dòng)態(tài)的腳本語(yǔ)言，負(fù)責(zé)與用戶進(jìn)行交互，增加用戶體驗(yàn)的作用。2、網(wǎng)頁(yè)組成一個(gè)網(wǎng)頁(yè)的組成部分主要包括下面幾個(gè)部分：文字、圖片、輸入框、視頻、音頻、超鏈接

等。3、Web標(biāo)準(zhǔn)說(shuō)到Web標(biāo)準(zhǔn)，不能不說(shuō)W3C組織（WorldWideWebConsortium），全程為「萬(wàn)維網(wǎng)聯(lián)盟」。萬(wàn)維網(wǎng)聯(lián)盟創(chuàng)建于1994年，是Web技術(shù)領(lǐng)域最具權(quán)威和影響力的國(guó)際中立性技術(shù)標(biāo)準(zhǔn)機(jī)構(gòu)。W3C最重要的工作是發(fā)展Web規(guī)范，這些規(guī)范描述了Web的通信協(xié)議。簡(jiǎn)單的說(shuō)就是就是確定Web頁(yè)面的語(yǔ)法格式和規(guī)范的。與之類(lèi)似的一個(gè)組織是「EuropeanComputerManufacturersAssociation」（ECMA組織），這個(gè)組織制定了標(biāo)準(zhǔn)的腳本語(yǔ)言規(guī)范ECMAScript，而JavaScript就參照的這個(gè)規(guī)范。那么Web標(biāo)準(zhǔn)規(guī)范了下面三個(gè)部分：HTML標(biāo)準(zhǔn)（結(jié)構(gòu)標(biāo)準(zhǔn)），相當(dāng)人的骨架結(jié)構(gòu)。CSS樣式（表現(xiàn)）標(biāo)準(zhǔn)，相當(dāng)于給人化妝變的更漂亮。JavaScript行為標(biāo)準(zhǔn)，相當(dāng)與人在唱歌，頁(yè)面更靈動(dòng)。4、瀏覽器內(nèi)核瀏覽器內(nèi)核是一個(gè)瀏覽器的核心部分，也就是「渲染引擎」。它的主要作用是決定一個(gè)瀏覽器如何顯示網(wǎng)頁(yè)的內(nèi)容及頁(yè)面的格式信息。不同的瀏覽器內(nèi)核對(duì)網(wǎng)頁(yè)編寫(xiě)語(yǔ)法的解釋也有不同，因此同一網(wǎng)頁(yè)在不同的內(nèi)核的瀏覽器里的渲染（顯示）效果也可能不同。這里涉及到一個(gè)「兼容性問(wèn)題」，瀏覽器兼容性問(wèn)題又被稱(chēng)為網(wǎng)頁(yè)兼容性或網(wǎng)站兼容性問(wèn)題，指網(wǎng)頁(yè)在各種瀏覽器上的顯示效果可能不一致而產(chǎn)生瀏覽器和網(wǎng)頁(yè)間的兼容問(wèn)題。所以我們?cè)诰帉?xiě)代碼的時(shí)候，做好瀏覽器兼容，才能夠讓網(wǎng)站在不同的瀏覽器下都正常顯示。而對(duì)于瀏覽器軟件的開(kāi)發(fā)和設(shè)計(jì)，瀏覽器對(duì)標(biāo)準(zhǔn)的更好兼容能夠給用戶更好的使用體驗(yàn)。常見(jiàn)瀏覽器以及對(duì)應(yīng)的內(nèi)核：內(nèi)核代表瀏覽器描述TridentIE

IE瀏覽器IE內(nèi)核，是微軟開(kāi)發(fā)的一種排版引擎GeckoFirefox

火狐瀏覽器Gecko是當(dāng)年最流行的排版引擎之一，僅次于TridentWebkitSafari

Safari瀏覽器蘋(píng)果瀏覽器內(nèi)核，它的特點(diǎn)在于源碼結(jié)構(gòu)清晰、渲染速度極快。缺點(diǎn)是對(duì)網(wǎng)頁(yè)代碼的兼容性不高ChromiumChrome（前期）fork自蘋(píng)果的Webkit內(nèi)核，谷歌前期使用，后期谷歌聯(lián)手Opera自研和發(fā)布了Blink引擎BlinkChrome/Opera

Chrome/歌劇Blink內(nèi)核誕生于2013年4月。Blink其實(shí)是基于WebKit的PrestoOpera前內(nèi)核,已廢棄2013年被Blink取代5、認(rèn)識(shí)HTML通常我們看到的網(wǎng)頁(yè)，都是以

.htm

或

.html

后綴結(jié)尾的文件，因此將其俗稱(chēng)為HTML文件。HTML指的是超文本標(biāo)記語(yǔ)言，它是用來(lái)描述網(wǎng)頁(yè)的一種語(yǔ)言。所謂超文本，有2層含義：它可以加入圖片、聲音、動(dòng)畫(huà)、多媒體等內(nèi)容（超越了文本限制）。它還可以從一個(gè)文件跳轉(zhuǎn)到另一個(gè)文件，與世界各地主機(jī)的文件連接（超級(jí)鏈接文本）。6、HTML結(jié)構(gòu)標(biāo)準(zhǔn)HTML基本結(jié)構(gòu)如下：<!DOCTYPEhtml>

是告訴瀏覽器，以下文件用HTML哪個(gè)版本解析，這里是HTML5版本。<html></html>

標(biāo)簽是一個(gè)網(wǎng)頁(yè)的根標(biāo)簽，所有的標(biāo)簽都要寫(xiě)在這一對(duì)根標(biāo)簽里面。<head></head>

是頭標(biāo)簽，主要是定義文檔（網(wǎng)頁(yè)）的頭部，包括完檔的屬性和信息，文檔的標(biāo)題，還可以引入JavaScript腳本，CSS格式等。<body></body>

是一個(gè)文檔的主題，里面包含文檔的所有內(nèi)容，比如文本，超鏈接，圖片，表格等內(nèi)容。7、html標(biāo)簽分類(lèi)HTML標(biāo)簽從數(shù)量上分為單標(biāo)簽和雙標(biāo)簽。單標(biāo)簽：

<!Doctypehtml>

雙標(biāo)簽：

<html></html>，<head></head>，<title></title>8、html標(biāo)簽關(guān)系分類(lèi)包含（嵌套關(guān)系）：<head><title></title></head>

父子關(guān)系并列關(guān)系：

<head></head><body></body>

兄弟姐妹9、開(kāi)發(fā)工具前期學(xué)習(xí)一種語(yǔ)言的時(shí)候，開(kāi)發(fā)工具很重要。Web開(kāi)發(fā)工具有很多。最簡(jiǎn)單的一個(gè)開(kāi)發(fā)工具就是Windows系統(tǒng)自帶的記事本了，但是又難用又難看，沒(méi)有語(yǔ)法高亮、代碼補(bǔ)全等功能。推薦使用的是「VisualStudioCode」，VScode是一款輕量級(jí)的編輯器，安裝包小，啟動(dòng)速度快，而且功能非常強(qiáng)大，以及成為前端不可缺少的編碼利器。提到Web開(kāi)發(fā)工具不得不提到JebBrain全家桶的「

Webstorm

」軟件。目前已經(jīng)被廣大Web開(kāi)發(fā)者譽(yù)為“Web前端開(kāi)發(fā)神器”、“最強(qiáng)大的HTML5編輯器”、“最智能的JavaScriptIDE”等。它令人稱(chēng)到的是它智能打代碼補(bǔ)全、代碼一鍵格式化、HTML

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

評(píng)論

0/150

提交評(píng)論