分享0基礎小白學習前端開發(fā)的心路歷程

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

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

一、第一階段html知識都有啥子?

前言

我們介紹了什么是html?w3c?還有html5?以及基礎的計算機網(wǎng)絡知識?

1:web是啥?

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

2: w3c是干啥的?

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

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

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

3:了解前端關于網(wǎng)絡的知識以及協(xié)議?

網(wǎng)站 Website ,人們可以通過網(wǎng)站發(fā)布自己想要公開的咨詢或者利用網(wǎng)站提供相關網(wǎng)絡的服務。

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

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

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

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

ftp協(xié)議:文件傳輸協(xié)議 可以通過ftp訪問服務器上的文件

file協(xié)議 主要用于訪問本地計算機中的文件

二、html的發(fā)展史以及基礎標簽?

Html又叫超文本標記語言,用來構建網(wǎng)頁的一種標記語言

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版本 她是一種嚴格的html代碼

Xhtml時后可擴展的標記語言 是一種更嚴格 純凈的html語言

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

什么是元素?

Html是一系列標簽組成的 每個標簽以<>包裹的按此 通常稱之為元素

單標簽:只有一個變遷就能表達完整的含義如:<input/> <img/>

雙標簽:由開始標簽和結束標簽組成<div></div><span></span>

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

三、2html的常用標簽基本結構都有啥呢?

1:標題:這里我們會用到head的縮寫h2到h7表示標簽顯示出來的結果順序是從大到小的結構

2:段落標簽:什么是段落標簽?用于定義段落的標簽呀!用<p>來表示

這里要注意:段落標簽用于定義段落 瀏覽器會自動在其前后創(chuàng)建一些空白

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

那么問題來了?如何顯示空格呢?html準備了一個專用的空格符 &nbsp來表示

3:塊級區(qū)域 div標簽是 division的含義 代表網(wǎng)頁中的塊 所以一般把他叫做塊標簽

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

5:還有一些我們常用的鏈接 比如如何點擊一個鏈接跳轉到另一個界面呢?這里就可以實現(xiàn)啦那就是a標簽 anchor的縮寫用于定義網(wǎng)頁的鏈接

href指向鏈接的地址,還有一些我們常用的空連接void(0)

6:圖片img屬性來定義圖片的方法 他有倆個屬性一個是src代表圖片的地址 alt屬性代表圖片無法顯示時的代替文本

為此更加細分會有無序列表和有序列表以及自定義列表情況:

1:無序列表?使用ul標簽定義無序列表li標簽定義列表項無需列標的含義是 前后內(nèi)容沒有順序

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

3:自定義列表:使用dl標簽定義自定義列表 dt定義標題 用dd來定義列標項

四、接下來來到了很重要的重中之重表格標簽:

為啥使用表格標簽表格標簽都有啥子?

在我們?yōu)g覽網(wǎng)頁時總會看見商品的分類在不同的單元中?

比如我們在買東西時會出現(xiàn)分類華為手機要什么型號?什么顏色?這樣就需要將類品區(qū)分開的同時也要在一個手機的類中

表格標簽表示方法:

表格元素:<table>標簽定義 里面由若干行和列的單元格組成

在表格元素中 使用<tr>表示表格中的一行 使用<td>表示列

表格可以定義標題 用<caption>標簽定義

行?

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

表格的行 使用<tr>標簽定義表格的行

Tr 表哎內(nèi)部用來包含td標簽

例如:

<table>    <tr>    <td>單元格</td>    </tr>    </table>

<th>會把自己的顏色變化 變粗變黑

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

表單:

使用表單來簡單的設置一個提交的按鈕或者是 重置按鈕 來實現(xiàn)我們在輸入網(wǎng)頁信息時的一個小程序?大家可以自主發(fā)現(xiàn)!

表單元素:使用form標簽定義表單,表單有倆個最重要的屬性 action和method action屬性定義了,表單提交的地址,eod 屬性定義了表單提交的方式

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

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

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

表單元素:使用form標簽定義表單,表單有倆個最重要的屬性 action和method action屬性定義了,表單提交的地址,eod 屬性定義了表單提交的方式

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

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

案例:

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

表格中的三個屬性?select input textare?

1:input:

表格元素: input是一個單標簽元素 其屬性type代表了input的表單類型 input標簽就是通過tupe屬性的不同取值來定義不同的表單控件

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

例如: <input type=”text/>

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

例如:<input type = “radio/>

多選按鈕: 可以選中多個的選擇框

例如:<input type = “checkbox/>

按鈕:

普通按鈕:

例如:<input type =”button”/>

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

<input type =”submit”/>

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

<input type =”reset”/>

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

2:select選擇?如何選中心儀的商品?

Select用來定義列表 option用來定義列表項

示例:

Select name=”course”> Option value = “Math”>英語</option Option value = “Math”>數(shù)學</option </select>

3:textare來顯示多行的文本域?

<textarea/>用來表示多行文本域

示例: <textarea rows =”5” col =”10”></textarea>

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

網(wǎng)站欄目:分享0基礎小白學習前端開發(fā)的心路歷程
URL標題:http://bm7419.com/article4/pcdeie.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供軟件開發(fā)建站公司、標簽優(yōu)化、域名注冊全網(wǎng)營銷推廣定制開發(fā)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉載內(nèi)容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)

h5響應式網(wǎng)站建設