王剑编程网

分享专业编程知识与实战技巧

大学生晋升程序员02,带你一步步学习HTML,变身技术大牛

做全栈攻城狮-每日更新原创IT编程技术及日常实用视频。

主要内容:正式引入HTML网页开发,学习并了解HTML的相关知识。变身Web开发达人,做全栈程序员。这是HTML技术的第二课,主要讲解一下开发工具及HTML的结构,做出来属于我们的第一个Web网页。


开发工具

作为程序员,只要做电脑编程写代码,一定会选择一款合适的开发工具。HTML的书写的话,开发工具就有的选择了。

程序员写代码

作为HTML的开发,其实使用记事本完全就可以了,因为HTML网页本身就是文本文件。但是没人会使用记事本进行开发,因为一款适合自己的开发工具可以大大的提高写代码的效率。

下面我列出来几个比较常用的HTML开发工具:

NotePad++、EditPlus、Adobe Dreameaver、Sublime、WebStorm、Visual Studio等。

我们这阶段课程,主要使用Sublime这款工具为例进行使用,当然其他的开发工具也是大同小异。

Sublime代码编辑器


如何下载Sublime?

直接打开微软的必应搜索,这里不得不吐下槽,国内的搜索引擎真的不敢恭维。搜索结果显示并不是很好。谷歌当然是最不错的选择。但是无奈谷歌上不去,所以可以推荐给你使用必应搜索。必应搜索的结果可以说几乎和谷歌相差不大。

必应搜索

直接打开必应搜索,输入“sublime text 3”进行搜索,你就能找到官方网址。打开进行下载即可:

Sublime的下载方式

打开Sublime的官网,选择Download,选择合适你电脑系统的版本进行安装:

下载Sublime


书写第一个Web网页

打开Sublime,默认打开:

软件默认界面

此时,会默认打开一个新文件,首先点击键盘上的Ctrl+S。进行文件保存。选择合适的路径,并输入文件名,后缀以html。

保存html

添加代码HTML的结构:

需要明确的是HTML有一个文档结构的。就好比人有头部和身体组成。html也是如此。上面就是html最简单的结构。

类型标签,表示开始标签。类型的表示结束标签。

两个标签之间的内容,输入整个html标签。

我们习惯性的把...的格式的代码,叫做xxxx标签。

为结构添加内容,做我们第一个Web网页:

第一个Web网页

此时,找到html文件所在路径,双击打开,运行你就会看到效果:

网站结构

经过运行结果,你就会明白title、body标签所展现的样子了。


本视频由做全栈攻城狮,原创首发,如有转载,请注明出处。

如果你有什么比较不错的编程技巧,或者你想要什么程序员编程资源,点击下方了解更多。

控制面板
您好,欢迎到访网站!
  查看权限
网站分类
最新留言