html搜索框_纯新手小白,学习网页前端(HTML)

437ee33d28b804069583ccb628a5c15a.png

HTML基本介绍

什么是 HTML?

答:HTML 是用来描述网页的一种语言。

  • HTML 指的是超文本标记语言 (Hyper Text Markup Language)
  • HTML 不是一种编程语言,而是一种标记语言 (markup language)
  • 标记语言是一套标记标签 (markup tag)
  • HTML 使用标记标签来描述网页

HTML 标签

  • HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
  • HTML 标签是由尖括号包围的关键词,比如 <html>
  • HTML 标签通常是成对出现的,比如 <b></b>
  • 标签对中的第一个标签是开始标签,第二个标签是结束标签

也就是说,html文件就是我们所说的网页,当浏览器访问到一个html文件,就会根据里面的html标签进行解析,将标签转化为我们日常看见的网页。

也就是说html文件是用来告诉浏览器一个网页里面都有什么,长什么样。

不过它只能做到搭建静态网站的目的,至于数据交互,动态网站的内容,就需要xml, php, javascript等其它脚本语言来写了。


一个实例认识html语句

<a href="http://www.tonywzt.cn">This is a link</a>

上面是一个链接的定义,我们可以从中获取一个标签的基本组成

  • 前面<a>是开始标签,表征一个元素的开始,一般是由尖括号和标签的名称组成。
  • 后面</a>是结束标签,表征一个元素的结束,形式和开始标签类似,但是标签名称前面要加上'/'
  • 开始标签中的href="http://www.tonywzt.cn"是属性,很多的标签都可以进行属性的设置,比如说这一个表示的含义是该链接指向的地址。
  • 两个尖括号中间的是元素的内容

HTMl网页就是由这样一个个元素组成的,你可以随便打开一个网页,然后右击查看网页的源代码,查看一个网页究竟是什么样子的


HTML编辑器

HTML作为一种标记性语言,是不需要编辑的。因此事实上即使使用最简单的记事本也可以进行编辑。

可以使用专业的 HTML 编辑器来编辑 HTML:

  • Adobe Dreamweaver
  • Microsoft Expression Web
  • CoffeeCup HTML Editor

除了这些比较专业的软件,也可以用一般的编辑器,比如说VSCODE,SubLimeText, NotePad++甚至VIM等。这些编辑器都提供了相应的代码补全等功能的插件。大家可以自由选择。

这里我推荐我所使用的编辑器,宇宙第一编辑器(引战):VSCODE。

这里顺便推荐四个插件:

  1. HTML Snippets,
  2. HTML CSS Support,
  3. auto rename tag,
  4. auto close tag

VSCODE安装

VSCODE 是微软提供的一款编辑器,提供了多种语言的相关插件,并且与Git关联性很强。个人而言,不仅将它作为html的编辑器,更多的是用来写python代码以及markdown文档。

VSCODE下载只需要在官网下载即可。然后按照流程就行安装。

VSCODE 插件安装

VSCODE插件安装一般需要联网条件,在左侧的选项卡中有一个类似于积木的四方块,点开之后,可以在上方搜索框直接进行搜索,然后下载。

chajian.gif

  • HTML Snippets:超级实用且初级的 H5代码片段以及提示
  • HTML CSS Support:让 html 标签上写class 智能提示当前项目所支持的样式
  • auto rename tag:给tag重命名的时候自动把开始标签和结束标签一起更改

c362cd863b48c01681435bdf481ba69b.gif
  • auto close tag:自动补全结束标签 auto_close.gif

80ac90fa05aa03008cef32c8d7563531.gif

HTML学习资源

划重点!推荐一个HTML,CSS,JS等的学习网站
w3school里面包含了各种关于网站的基础学习资源,基本可以满足搭建一个小型网站的需求,包括静态,动态,前端,后端的知识。

如果想要做出一个漂亮的静态网页,至少需要学习HTML和CSS

如果想要做一个动态的网页,那么前端知识还要学习比如JavaScript之类的脚本语言,后端要学习比如PHP,SQL这之类的后端操作。

上面这些知识在w3school网站上都可以找得到。

如果要建立个人网站,可能还需要学习运维,云服务器等操作。


后记

针对云服务器和个人网站建站的具体步骤,日后可能聊一聊

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值