这是一个系列教程《前端从入坑到弃坑》的第一篇。

HTML 是什么

说白了，HTML 就是网页的内容。比如你现在正在阅读的这个网页的内容，就是 HTML。如果你还不明白，请继续往下阅读。

写一个简单的 HTML

首先在你的电脑上，新建一个名为 index.html 的文件，用文本编辑器打开（注意不要用 Windows 自带的记事本打开）。

然后把下面的内容复制，粘贴到编辑器，保存文件。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p>你好，世界</p>
</body>
</html>

双击打开文件，你将会在浏览器看到以下内容：

你再把下面的内容复制，替换 index.html 的内容。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<h1>这是标题</h1>
<p>这是普通的内容。</p>
<img src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png">
</body>
</html>

浏览器刷新页面，可以看到下面的效果：

看到这里，我想你应该明白了，HTML 是什么了。HTML 简单的理解，就是网页要显示的内容。

总结

略。

写个 Hello world - 前端从入坑到弃坑系列教程（1）的更多相关文章

  1. 使用 Flask 框架写用户登录功能的Demo时碰到的各种坑（五）——实现注册功能

    使用 Flask 框架写用户登录功能的Demo时碰到的各种坑(一)——创建应用 使用 Flask 框架写用户登录功能的Demo时碰到的各种坑(二)——使用蓝图功能进行模块化 使用 Flask 框架写用 ...

  2. 写给后端的前端笔记：浮动（float）布局

    写给后端的前端笔记:浮动(float)布局 这篇文章主要面向后端人员,对前端有深刻了解的各位不喜勿喷. 起因 前一阵子我一个后端的伙伴问我,"前端的左飘怎么做?",我立马就懵了,& ...

  3. 写给后端的前端笔记：定位（position）

    写给后端的前端笔记:定位(position) 既然都写了一篇浮动布局,干脆把定位(position)也写了,这样后端基本上能学会css布局了. 类别 我们所说的定位position主要有三类:固定定位 ...

  4. 使用 Flask 框架写用户登录功能的Demo时碰到的各种坑（四）——对 run.py 的调整

    使用 Flask 框架写用户登录功能的Demo时碰到的各种坑(一)——创建应用 使用 Flask 框架写用户登录功能的Demo时碰到的各种坑(二)——使用蓝图功能进行模块化 使用 Flask 框架写用 ...

  5. 使用 Flask 框架写用户登录功能的Demo时碰到的各种坑（一）——创建应用

    使用 Flask 框架写用户登录功能的Demo时碰到的各种坑(一)——创建应用 使用 Flask 框架写用户登录功能的Demo时碰到的各种坑(二)——使用蓝图功能进行模块化 使用 Flask 框架写用 ...

  6. 使用 Flask 框架写用户登录功能的Demo时碰到的各种坑（二）——使用蓝图功能进行模块化

    使用 Flask 框架写用户登录功能的Demo时碰到的各种坑(一)——创建应用 使用 Flask 框架写用户登录功能的Demo时碰到的各种坑(二)——使用蓝图功能进行模块化 使用 Flask 框架写用 ...

  7. 使用 Flask 框架写用户登录功能的Demo时碰到的各种坑（三）——使用Flask-Login库实现登录功能

    使用 Flask 框架写用户登录功能的Demo时碰到的各种坑(一)——创建应用 使用 Flask 框架写用户登录功能的Demo时碰到的各种坑(二)——使用蓝图功能进行模块化 使用 Flask 框架写用 ...

  8. 弃坑pexpect，入坑paramiko

    上文书说到,ssh库pexpect的使用,简直就是个“月亮公主”——满眼全是坑.勉强把程序写好了,跑起来的时候发现了一个新坑,让我不可抗拒的把它弃掉了——经常莫名其妙的连不上服务器!开线程连接14台服 ...

  9. 01.Web大前端时代之：HTML5+CSS3入门系列~初识HTML5

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 文档申明 <!--文档类型申明,html代表是ht ...

随机推荐

  1. 关于HTML学习整理（一）

    新人,自己整理,第一次发,以后慢慢整理,欢迎指点,那些链接怎么做的,希望有人告知一下,谢谢! HTML页面写法,标签成对出现,可嵌套使用 <html> <head> <t ...

  2. PHP安装phpredis扩展

    phpredis 的github地址:https://github.com/nicolasff/phpredis第一步:切换到指定的目录,然后wget https://github.com/nicol ...

  3. Example018主页加载时获取焦点

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. accp8.0转换教材第2章初识MySQL

    首先安装MySQL: 一.单词部分: ①networking网络②option选择③port端口④firewall防火墙⑤engine引擎 ⑥standard标准⑦character字符⑧collat ...

  5. MyBatis源码解析【3】生命周期

    经过之前的项目构建,我们已经得到了一个可以使用的最基本的项目. 其中已经包括整个执行的过程.但是我们在完成之后也遇到了很多问题,我们就要慢慢的一步步解决这些问题. 讲道理,今天我们其实应该直接开始看源 ...

  6. cygwin和ffmpeg的两三事

    cygwin和ffmpeg的下载地址: https://cygwin.com/install.html http://www.ffmpeg.org/download.html 标题看上去有些无厘头,然 ...

  7. JAVA程序打包成exe小程序的过程

    编程软件:myeclipse2014 打包exe软件:exe4j 1:在myeclipse2014新建java项目编写程序 2:打包成jar,分两种情况(有无外部依赖包) 无外部依赖包:点击项目--- ...

  8. Unity3D-Shader-实现X光效果

    [旧博客转移 - 2016年1月3日 16:40 ] 最近学习了一些Shader效果,打算把学到的知识总结一下,这篇讲一下这种轮廓发光的效果(如下图所示),也有一些地方管这个叫X光     1.原理 ...

  9. js中嵌入jsp(html)代码的双引号转换问题--事件没反应

    下面是一段今天遇到问题的代码,select中写了onchange事件 ,在没有加转义的情况下,F12解析的代码是错乱的,双引号与内容中写的不一致,还会有空格出现,经过一段时间的摸索,发现在出错的地方加 ...

  10. java多线程系列(一)

    java多线程技能 前言:本系列将从零开始讲解java多线程相关的技术,内容参考于<java多线程核心技术>与<java并发编程实战>等相关资料,希望站在巨人的肩膀上,再通过我 ...