学前端最终要做的就是制作各种各样的网页，html就相当于网页的骨架，所以我们学习前端的第一步就是先学html，接下来学习什么是html。

什么是HTML?
HTML指的是超文本标记语言（Hyper Text Markup Language），是一种标记语言，使用标签来描述网页。HTML文档就是网页,web浏览器作用就是读取HTML文档，并以网页的形式显示出来。
 

HTML标签：

标记标签通常被称为HTML标签，标签由尖括号包围的关键字组成，通常都是成对出现的，有开始标签和结束标签，如<html></html>。浏览器不会显示html标签，而是使用标签来解释页面内容。
举例：<body>hello world </body>，网页只展示了hello world 其他内容并没有展示。
初入门的同学就会很好奇，明明代码很多，但是网页里只能看到hello world几个字，其他内容看不到，什么原因呢？
找到我们做的第一个hello world网页代码，如下：

  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="UTF-8">
  5.         <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.         <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.         <title>Document</title>
  8.     </head>
  9.     <body>
  10.         hello world
  11.     </body>
  12. </html>

　　

HTML文档结构
1、<!DOCTYPE html> DOCTYPE声明位于文档最前面，告知浏览器文档使用的那种HTML或XHTML规范。<!DOCTYPE html>是html5标准网页声明。
 
2、<head>是所有头部元素的容器，以下标签都可以添加到 head 部分：
  1. 1.<title>标题</title>所有html文档必需的，定义浏览器工具栏中的标题。
  2. 2.<base>标签设置页面上所有链接默认地址和默认打开方式。如下：
  3. 　　<base href="http://www.baidu.com/" />
  4. 　　<base target="_blank" />
  5. 3.<link>链接样式表，没有结束标签
  6. 　　<link rel="stylesheet" type="text/css" href="mystyle.css" />
  7. 4.<meta>设置网页关键字和描述，主要针对搜索引擎。该标签永远位于head中，没有结束标签。
  8. 5.<script>用于引入javascript文件，该标签head 和body中均可加入，属于双标签。
  9. 6.<style>用于添加css样式，属于双标签。　
 
3、<body>定义文档的主体，即网页内需要展示的所有内容放入body中。

  1. <body>
  2.     所有需要展示到网页的内容
  3. </body>

学前端的第一门语言HTML的更多相关文章

  1. 不把C作为第一门语言是个好主意么

    ----------------------------------------------------------------------------------   不把C作为第一门语言是个好主意 ...

  2. 准备踏入IT编程的学子们,你们第一门编程语言选谁？ Are You Ready? Go!

    Are You Ready? Go! ——第一门编程语言选谁? 金旭亮 说明: 这篇文章是专门针对大学低年级学生(和其他软件开发初学者)写的,如果你己经是研究生或本科高年级学生,请将这篇文章转发给你的 ...

  3. 重学前端 --- Promise里的代码为什么比setTimeout先执行？

    首先通过一段代码进入讨论的主题 var r = new Promise(function(resolve, reject){ console.log("a"); resolve() ...

  4. 原生JS实现轮播+学前端的感受（防止走火入魔）

    插件!插件!天天听到有人求这个插件,那个插件的,当然,用第三方插件可以大幅提高开发效率,但作为新手,我还是喜欢自己来实现,主要是我有时间! 今天我来给大家分享下用原生JS实现图片轮播的写法 前辈们可以 ...

  5. 结合jquery的前后端加密解密 适用于WebApi的SQL注入过滤器 Web.config中customErrors异常信息配置 ife2018 零基础学院 day 4 ife2018 零基础学院 day 3 ife 零基础学院 day 2 ife 零基础学院 day 1 - 我为什么想学前端

    在一个正常的项目中,登录注册的密码是密文传输到后台服务端的,也就是说,首先前端js对密码做处理,随后再传递到服务端,服务端解密再加密传出到数据库里面.Dotnet已经提供了RSA算法的加解密类库,我们 ...

  6. ife 零基础学院 day 1 - 我为什么想学前端

    与前端结缘   我是后端研发,毕业四年,用了四年C#,一开始写ASP.NET,有时会在asp页面写简单的js和html,做点css样式调整.当时的感触是前端调试太费劲了,因为没有js.html.css ...

  7. 重学前端--js是面向对象还是基于对象？

    重学前端-面向对象 跟着winter老师一起,重新认识前端的知识框架 js面向对象或基于对象编程 以前感觉这两个在本质上没有什么区别,面向对象和基于对象都是对一个抽象的对象拥有一系列的行为和状态,本质 ...

  8. 带你学够浪：Go语言基础系列 - 8分钟学基础语法

    对于一般的语言使用者来说 ,20% 的语言特性就能够满足 80% 的使用需求,剩下在使用中掌握. 基于这一理论,Go 基础系列的文章不会刻意追求面面俱到,但该有知识点都会覆盖,目的是带你快跑赶上 Go ...

  9. css与javascript重难点，学前端，基础不好一切白费！

    JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果.通常JavaScript脚本是通过嵌入在HTML中来实现 ...

随机推荐

  1. Wide & Deep的OneFlow网络训练

    Wide & Deep的OneFlow网络训练 HugeCTR是英伟达提供的一种高效的GPU框架,专为点击率(CTR)估计训练而设计. OneFlow对标HugeCTR搭建了Wide & ...

  2. 在cuDNN中简化Tensor Ops

    在cuDNN中简化Tensor Ops 在Tesla V100 GPU中引入神经网络模型以来,神经网络模型已迅速利用NVIDIA Tensor Cores进行深度学习.例如,基于Tensor Core ...

  3. SpringBoot系列——cache缓存

    前言 日常开发中,缓存是解决数据库压力的一种方案,通常用于频繁查询的数据,例如新闻中的热点新闻,本文记录springboot中使用cache缓存. 官方文档介绍:https://docs.spring ...

  4. 【NX二次开发】拉伸的偏置方向猜想与验证

    结论:偏置的方向为曲线方向与拉伸方向的向量叉乘. 在UF_MODL_create_extrusion帮助中有这么一句话:Note that the offset direction is determ ...

  5. 这应该是把Java内存区域讲的最清楚的一篇文章

    基本问题: 介绍下 Java 内存区域(运行时数据区) Java 对象的创建过程(五步,建议能默写出来并且要知道每一步虚拟机做了什么) 对象的访问定位的两种方式(句柄和直接指针两种方式) 拓展问题: ...

  6. Java编程技巧：if-else优化实践总结归纳

    文/朱季谦 说实话,其实我很讨厌在代码里大量使用if-else,一是因为该类代码属于面向过程的,二嘛,则是会显得代码过于冗余.这篇笔记,主要记录一些自己在工作实践当中针对if-else的优化心得,将会 ...

  7. Linux中查看网络命令

    tcp三次握手,所以一直在listening,在等待信号 udp是没有listening状态的,因为不管你在不在都会发信息给你. netstat -r  =route -n  可以查看路由

  8. Excel的布尔值运算

    TRUE被当做1进行加减乘除,例:1-TRUE=0. FALSE被当做0进行加减乘除,例:1-FALSE=1.(当做除数时,会因为分母为0返回错误值)

  9. 用jquery通过点击事件把下拉列表币种的值传给文本框1，再通过文本框1的币种名称用if转化为币别传值给文本框2保存

    <script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script>& ...

  10. flex PopUpManager createPopUp方式弹出窗口

    createPopUp:是上来先设置好弹出方式,然后在new出来一个TitleWindow的对象,然后通过此对象设置他的变现形式. addPopUp:是先new出来对象,设置好表现形式,然后在选择弹出 ...