一个真正0基础小白学习开端开发的心路历程

摘要：真正的0基础小白学习前端开发的心路历程。

距离第一阶段的结束敲响了末尾的声音，抱着初心从开始8号的学习到第一阶段的结束这期间要应付期末考试应付本身的各类事情学习时间老是挤出来的此次学习让我受益不浅呢？废话很少说上干货。

1、第一阶段html知识都有啥子？

前言

咱们介绍了什么是html？w3c？还有html5？以及基础的计算机网络知识？

1：web是啥？

WEB的发展历史:Internet叫作互联网，美国国防局高级研究计划局ArpA建设了军用网叫作‘阿帕网’，于1969年正式启用。

2： w3c是干啥的？

W3C的成立 1994年10月 Tim berner3-lee 在麻省理工学院创立了word wide web conscortium 中文为 万维网联盟 联盟简称为w3c

W3C最重要的工做是发展web规范，描述了web 的通讯协议、好比 html和xhtml

www是word wide web 的缩写 也能够写成w3 中文名万维网 是集文本、声音、图像、视频等多媒体信息于 一身的全球信息资源网络，万维网的呈现形式是Internet。

3：了解前端关于网络的知识以及协议？

网站 Website ，人们能够经过网站发布本身想要公开的咨询或者利用网站提供相关网络的服务。

网址:在浏览器中输入网站的地址就能够打开想要访问的网站，那么网站的地址咱们称之为url 中文名为统一资源定位符俗称网址。

url格式:协议://主机地址+目录路径+参数

http：超文本传输协议 从万维网服务器传输文本到本地浏览器的传输协议

https实在http基础上增长的更安全的协议

ftp协议：文件传输协议 能够经过ftp访问服务器上的文件

file协议 主要用于访问本地计算机中的文件

2、html的发展史以及基础标签？

Html又叫超文本标记语言，用来构建网页的一种标记语言

Html的历史：

• 1993年由互联网工程工做小组 发布工做草案
• 1995年发布html2.0版本
• 1997年12月18日由w3c发布的html3.2版本
• 1999年由w3c发布html4.01版本
• 2000年由w3c发布xhtml1。0版本 她是一种严格的html代码

Xhtml时后可扩展的标记语言 是一种更严格 纯净的html语言

Html5中新增长了不少语义化标签 不一样的html标签表明了不一样网页的内容

什么是元素？

Html是一系列标签组成的 每一个标签以<>包裹的按此 一般称之为元素

单标签：只有一个变迁就能表达完整的含义如：<input/> <img/>

双标签：由开始标签和结束标签组成<div></div><span></span>

属性: 标签能够有不少属性 属性老是在开始标签中定义 并且是以名值对的形式出现 其中属性值 是以 双引号包裹

3、2html的经常使用标签基本结构都有啥呢？

1:标题：这里咱们会用到head的缩写h1到h6表示标签显示出来的结果顺序是从大到小的结构

2：段落标签：什么是段落标签？用于定义段落的标签呀！用<p>来表示

这里要注意：段落标签用于定义段落 浏览器会自动在其先后建立一些空白

文字行数取决于浏览器窗口的宽度

那么问题来了？如何显示空格呢？html准备了一个专用的空格符 &nbsp来表示

3：块级区域 div标签是 division的含义 表明网页中的块 因此通常把他叫作块标签

4：span标签是内联将一个span元素标记在span中这个很是重要不是很了解的小伙伴能够查一下知识点

5：还有一些咱们经常使用的连接 好比如何点击一个连接跳转到另外一个界面呢？这里就能够实现啦那就是a标签 anchor的缩写用于定义网页的连接

href指向连接的地址，还有一些咱们经常使用的空链接void（0）

6：图片img属性来定义图片的方法 他有俩个属性一个是src表明图片的地址 alt属性表明图片没法显示时的代替文本

为此更加细分会有无序列表和有序列表以及自定义列表状况：

1：无序列表？使用ul标签订义无序列表li标签订义列表项无需列标的含义是 先后内容没有顺序

2：有序列表？顾名思义就是每一项都有顺序含义 有序列表的前端一般为字母或数字

3：自定义列表：使用dl标签订义自定义列表 dt定义标题 用dd来定义列标项

4、接下来来到了很重要的重中之重表格标签：

为啥使用表格标签表格标签都有啥子？

在咱们浏览网页时总会看见商品的分类在不一样的单元中？

好比咱们在买东西时会出现分类华为手机要什么型号？什么颜色？这样就须要将类品区分开的同时也要在一个手机的类中

表格标签表示方法：

表格元素：<table>标签订义 里面由若干行和列的单元格组成

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

表格能够定义标题 用<caption>标签订义

行？

咱们能够把一个网页的总体分为三部分：head body 和foot 表明一个完成的人/网页

表格的行 使用<tr>标签订义表格的行

Tr 表哎内部用来包含td标签

例如:

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

<th>会把本身的颜色变化 变粗变黑

咱们也能够在tr 属性中设置align来调试单元格显示的位置等

表单：

使用表单来简单的设置一个提交的按钮或者是 重置按钮 来实现咱们在输入网页信息时的一个小程序？你们能够自主发现！

表单元素：使用form标签订义表单，表单有俩个最重要的属性 action和method action属性定义了，表单提交的地址，eod 属性定义了表单提交的方式

表单提交有俩种方式： 一种是get 一种是 post

其余的表单控件元素 必须放在form标签的内部

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

表单元素：使用form标签订义表单，表单有俩个最重要的属性 action和method action属性定义了，表单提交的地址，eod 属性定义了表单提交的方式

表单提交有俩种方式： 一种是get 一种是 post

其余的表单控件元素 必须放在form标签的内部

案例：

Form action=www.huawei.com  method=’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”/>

提交按钮：会触发将表单数据提交到服务器的功能

<input type =”submit”/>

重置按钮：会清楚表单中的全部数据 回复表单中的原始值

<input type =”reset”/>

文件上传按钮:用于文件上传

2：select选择？如何选中心仪的商品？

Select用来定义列表 option用来定义列表项

示例：

Select name=”course”>
Option value = “Math”>英语</option
Option value = “Math”>数学</option
</select>

3：textare来显示多行的文本域？

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

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

本文分享自华为云社区《0基础小白如何玩转前端开发？》，原文做者：一只无脑程序员 。

点击关注，第一时间了解华为云新鲜技术~