本篇內(nèi)容主要講解“分享0基礎(chǔ)小白學(xué)習(xí)前端開(kāi)發(fā)的心路歷程”，感興趣的朋友不妨來(lái)看看。本文介紹的方法操作簡(jiǎn)單快捷，實(shí)用性強(qiáng)。下面就讓小編來(lái)帶大家學(xué)習(xí)“分享0基礎(chǔ)小白學(xué)習(xí)前端開(kāi)發(fā)的心路歷程”吧!

創(chuàng)新互聯(lián)公司是一家專(zhuān)業(yè)提供武隆企業(yè)網(wǎng)站建設(shè),專(zhuān)注與做網(wǎng)站、成都網(wǎng)站設(shè)計(jì)、H5頁(yè)面制作、小程序制作等業(yè)務(wù)。10年已為武隆眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專(zhuān)業(yè)的建站公司優(yōu)惠進(jìn)行中。

一、第一階段html知識(shí)都有啥子？

前言

我們介紹了什么是html？w3c？還有html5？以及基礎(chǔ)的計(jì)算機(jī)網(wǎng)絡(luò)知識(shí)？

1：web是啥？

WEB的發(fā)展歷史:Internet叫做互聯(lián)網(wǎng)，美國(guó)國(guó)防局高級(jí)研究計(jì)劃局ArpA建設(shè)了軍用網(wǎng)叫做‘阿帕網(wǎng)’，于1969年正式啟用。

2： w3c是干啥的？

W3C的成立 1994年10月 Tim berner3-lee 在麻省理工學(xué)院創(chuàng)立了word wide web conscortium 中文為 萬(wàn)維網(wǎng)聯(lián)盟 聯(lián)盟簡(jiǎn)稱(chēng)為w3c

W3C最重要的工作是發(fā)展web規(guī)范，描述了web 的通信協(xié)議、比如 html和xhtml

www是word wide web 的縮寫(xiě) 也可以寫(xiě)成w3 中文名萬(wàn)維網(wǎng) 是集文本、聲音、圖像、視頻等多媒體信息于 一身的全球信息資源網(wǎng)絡(luò)，萬(wàn)維網(wǎng)的呈現(xiàn)形式是Internet。

3：了解前端關(guān)于網(wǎng)絡(luò)的知識(shí)以及協(xié)議？

網(wǎng)站 Website ，人們可以通過(guò)網(wǎng)站發(fā)布自己想要公開(kāi)的咨詢(xún)或者利用網(wǎng)站提供相關(guān)網(wǎng)絡(luò)的服務(wù)。

網(wǎng)址:在瀏覽器中輸入網(wǎng)站的地址就可以打開(kāi)想要訪問(wèn)的網(wǎng)站，那么網(wǎng)站的地址我們稱(chēng)之為url 中文名為統(tǒng)一資源定位符俗稱(chēng)網(wǎng)址。

url格式:協(xié)議://主機(jī)地址+目錄路徑+參數(shù)

http：超文本傳輸協(xié)議 從萬(wàn)維網(wǎng)服務(wù)器傳輸文本到本地瀏覽器的傳輸協(xié)議

https實(shí)在http基礎(chǔ)上增加的更安全的協(xié)議

ftp協(xié)議：文件傳輸協(xié)議 可以通過(guò)ftp訪問(wèn)服務(wù)器上的文件

file協(xié)議 主要用于訪問(wèn)本地計(jì)算機(jī)中的文件

二、html的發(fā)展史以及基礎(chǔ)標(biāo)簽？

Html又叫超文本標(biāo)記語(yǔ)言，用來(lái)構(gòu)建網(wǎng)頁(yè)的一種標(biāo)記語(yǔ)言

Html的歷史：

• 1993年由互聯(lián)網(wǎng)工程工作小組 發(fā)布工作草案

• 1995年發(fā)布html2.0版本

• 1997年12月18日由w3c發(fā)布的html3.2版本

• 1999年由w3c發(fā)布html4.01版本

• 2000年由w3c發(fā)布xhtml1。0版本 她是一種嚴(yán)格的html代碼

Xhtml時(shí)后可擴(kuò)展的標(biāo)記語(yǔ)言 是一種更嚴(yán)格 純凈的html語(yǔ)言

Html5中新增加了很多語(yǔ)義化標(biāo)簽 不同的html標(biāo)簽代表了不同網(wǎng)頁(yè)的內(nèi)容

什么是元素？

Html是一系列標(biāo)簽組成的 每個(gè)標(biāo)簽以<>包裹的按此 通常稱(chēng)之為元素

單標(biāo)簽：只有一個(gè)變遷就能表達(dá)完整的含義如：

雙標(biāo)簽：由開(kāi)始標(biāo)簽和結(jié)束標(biāo)簽組成

屬性: 標(biāo)簽可以有很多屬性 屬性總是在開(kāi)始標(biāo)簽中定義 而且是以名值對(duì)的形式出現(xiàn) 其中屬性值 是以 雙引號(hào)包裹

三、2html的常用標(biāo)簽基本結(jié)構(gòu)都有啥呢？

1:標(biāo)題：這里我們會(huì)用到head的縮寫(xiě)h2到h7表示標(biāo)簽顯示出來(lái)的結(jié)果順序是從大到小的結(jié)構(gòu)

2：段落標(biāo)簽：什么是段落標(biāo)簽？用于定義段落的標(biāo)簽呀！用

來(lái)表示

這里要注意：段落標(biāo)簽用于定義段落 瀏覽器會(huì)自動(dòng)在其前后創(chuàng)建一些空白

文字行數(shù)取決于瀏覽器窗口的寬度

那么問(wèn)題來(lái)了？如何顯示空格呢？html準(zhǔn)備了一個(gè)專(zhuān)用的空格符  來(lái)表示

3：塊級(jí)區(qū)域 div標(biāo)簽是 division的含義 代表網(wǎng)頁(yè)中的塊 所以一般把他叫做塊標(biāo)簽

4：span標(biāo)簽是內(nèi)聯(lián)將一個(gè)span元素標(biāo)記在span中這個(gè)非常重要不是很了解的小伙伴可以查一下知識(shí)點(diǎn)

5：還有一些我們常用的鏈接 比如如何點(diǎn)擊一個(gè)鏈接跳轉(zhuǎn)到另一個(gè)界面呢？這里就可以實(shí)現(xiàn)啦那就是a標(biāo)簽 anchor的縮寫(xiě)用于定義網(wǎng)頁(yè)的鏈接

href指向鏈接的地址，還有一些我們常用的空連接void（0）

6：圖片img屬性來(lái)定義圖片的方法 他有倆個(gè)屬性一個(gè)是src代表圖片的地址 alt屬性代表圖片無(wú)法顯示時(shí)的代替文本

為此更加細(xì)分會(huì)有無(wú)序列表和有序列表以及自定義列表情況：

1：無(wú)序列表？使用ul標(biāo)簽定義無(wú)序列表li標(biāo)簽定義列表項(xiàng)無(wú)需列標(biāo)的含義是 前后內(nèi)容沒(méi)有順序

2：有序列表？顧名思義就是每一項(xiàng)都有順序含義 有序列表的前端通常為字母或數(shù)字

3：自定義列表：使用dl標(biāo)簽定義自定義列表 dt定義標(biāo)題 用dd來(lái)定義列標(biāo)項(xiàng)

四、接下來(lái)來(lái)到了很重要的重中之重表格標(biāo)簽：

為啥使用表格標(biāo)簽表格標(biāo)簽都有啥子？

在我們?yōu)g覽網(wǎng)頁(yè)時(shí)總會(huì)看見(jiàn)商品的分類(lèi)在不同的單元中？

比如我們?cè)谫I(mǎi)東西時(shí)會(huì)出現(xiàn)分類(lèi)華為手機(jī)要什么型號(hào)？什么顏色？這樣就需要將類(lèi)品區(qū)分開(kāi)的同時(shí)也要在一個(gè)手機(jī)的類(lèi)中

表格標(biāo)簽表示方法：

表格元素：

標(biāo)簽定義 里面由若干行和列的單元格組成

在表格元素中 使用

表示表格中的一行 使用標(biāo)簽定義表格的行

Tr 表哎內(nèi)部用來(lái)包含td標(biāo)簽

例如:

標(biāo)簽定義

行？

我們可以把一個(gè)網(wǎng)頁(yè)的整體分為三部分：head body 和foot 代表一個(gè)完成的人/網(wǎng)頁(yè)

表格的行 使用

表示列 表格可以定義標(biāo)題 用

                

單元格

會(huì)把自己的顏色變化 變粗變黑

我們也可以在tr 屬性中設(shè)置align來(lái)調(diào)試單元格顯示的位置等

表單：

使用表單來(lái)簡(jiǎn)單的設(shè)置一個(gè)提交的按鈕或者是 重置按鈕 來(lái)實(shí)現(xiàn)我們?cè)谳斎刖W(wǎng)頁(yè)信息時(shí)的一個(gè)小程序？大家可以自主發(fā)現(xiàn)！

表單元素：使用form標(biāo)簽定義表單，表單有倆個(gè)最重要的屬性 action和method action屬性定義了，表單提交的地址，eod 屬性定義了表單提交的方式

表單提交有倆種方式： 一種是get 一種是 post

其他的表單控件元素 必須放在form標(biāo)簽的內(nèi)部

Form action=www.huawei.com  method=’post Input type =”submit value=”提交 Input type = “reset vale = “重置

表單元素：使用form標(biāo)簽定義表單，表單有倆個(gè)最重要的屬性 action和method action屬性定義了，表單提交的地址，eod 屬性定義了表單提交的方式

表單提交有倆種方式： 一種是get 一種是 post

其他的表單控件元素 必須放在form標(biāo)簽的內(nèi)部

案例：

Form action=www.huawei.com  method=’post Input type =”submit value=”提交 Input type = “reset vale = “重置

表格中的三個(gè)屬性？select input textare？

1：input：

表格元素： input是一個(gè)單標(biāo)簽元素 其屬性type代表了input的表單類(lèi)型 input標(biāo)簽就是通過(guò)tupe屬性的不同取值來(lái)定義不同的表單控件

單本框：可以輸入一行文本的表單控件

例如:

單選按鈕: 具有相同屬性的單選按鈕只能選擇一個(gè)

例如:

多選按鈕: 可以選中多個(gè)的選擇框

例如：

按鈕：

普通按鈕：

例如:

提交按鈕：會(huì)觸發(fā)將表單數(shù)據(jù)提交到服務(wù)器的功能

重置按鈕：會(huì)清楚表單中的所有數(shù)據(jù) 回復(fù)表單中的原始值

文件上傳按鈕:用于文件上傳

2：select選擇？如何選中心儀的商品？

Select用來(lái)定義列表 option用來(lái)定義列表項(xiàng)

示例：

Select name=”course”> Option value = “Math”>英語(yǔ)數(shù)學(xué)

3：textare來(lái)顯示多行的文本域？

用來(lái)表示多行文本域</p><pre>示例： <textarea rows =”5” col =”10”>

到此，相信大家對(duì)“分享0基礎(chǔ)小白學(xué)習(xí)前端開(kāi)發(fā)的心路歷程”有了更深的了解，不妨來(lái)實(shí)際操作一番吧！這里是創(chuàng)新互聯(lián)網(wǎng)站，更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢(xún)，關(guān)注我們，繼續(xù)學(xué)習(xí)！

網(wǎng)站欄目：分享0基礎(chǔ)小白學(xué)習(xí)前端開(kāi)發(fā)的心路歷程
本文URL：http://weahome.cn/article/pcdeie.html