最近开的博客,一切都是从零开始,昨天刚写了java的开篇,今天写一写HTML开篇。

很多初学者都不太看重前端的学习,甚至鄙视前端,我刚开始时就这样。其实,要想成为一个真正的程序员,前端和后端都必须了解,然后再重点向自己想成为的方向发展。废话少说,无论你想成为哪方面的程序员,前端都是要学的。


前端知识学校好像不教,反正我的学校不学。介绍几个学习HTML的地方。慕课网,w3school,codecadmy.

这次简单介绍下HTML的基本结构。

what is HTML?

HTML stands for Hyper Text Markup Language.

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

HTML 标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

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

开始和结束标签也被称为开放标签闭合标签。

上一段代码,讲解一下html的基本结构:

<!DOCTYPE html>
<html>
<head>
<title>Hello</title>
</head>
<body>
hello world
</body>
</html>

一个HTML文件必须有<!DOCTYPE html>,其作用是告诉浏览器文件类型,以让它能正确解析,此处表示这是个html5文件。

又必须有<html></html>,html文件的内容都放在其中。

就想人有头,有身体,html文件也有头,身体。<head></head>里的内容是对html内容的描述,一般不会显示在网页中。如<title></title>是文件的标题,显示在浏览器窗口的上方。aaarticlea/png;base64,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" alt="" />

<body></body>里的内容是html文件的主要内容。其中可以插入,文本,图片,链接等。

今天就说这么多。html文件是由一个一个标签组成的,所以,以后,我会介绍各种html标签的用法和属性。

HTML学习开篇的更多相关文章

  1. 总结暨JAVAWEB学习开篇(一)

    匆匆,距上一篇博客已经过去7月有余,遂作文一篇总结暨JAVAWEB学习开篇. 1. 啃英文新概念.在多方讨教英语大佬后改变学习方式,通过背诵英文书籍以及多听英文录音来学习,效果还不错(等真正有成效了跟 ...

  2. Web前端学习开篇

    首先想想自己喜欢干什么?想干什么?脑袋需要什么?什么对自己来说最重要?自己的规划? 本人数字媒体技术专业,想学Web前端开发有好长时间了,有一定的基础,所以就想进一步深入学习.谁料想,我怎么那么没有耐 ...

  3. Node学习——开篇

    前言:自从下决心转学前端以来,我的专业课java基本荒废了,所以对于后台开发的逻辑也已基本忘干净了.但是作为一名准前端程序猿,我认为还是有必要了解后端开发的,虽不必深入学习,但是能够了解项目从前端到后 ...

  4. Python 学习开篇

    前言 最近看到一张图,有点意思: 蓝色是(成长+付出),红色是回报.有多久可以达到这个红心,要看我们自已的努力,付出了多少专注与汗水.我想说的是,水平轴并不是时间,如果不能坚持努力,可能永远都到不了那 ...

  5. php源码学习——开篇

    这个系列是对php源码的学习记录.由于本人水平有限,可能并不能写的非常清晰和深入,所以,可能只适合本人阅读:) 初次接触php源码,看到陌生的文件夹和大量的文件,可能会觉得茫然无措.php-inter ...

  6. python零基础学习开篇

    我是某工业大学的一名博士,研究方向是基于人脸的模式识别.很遗憾,毕业后没有继续从事图像处理中模式识别相关研究.多种原因进入了一家国企单位,从事交通方面工作.工作2年中一直迷茫,没有在工作岗位中找到自己 ...

  7. go学习开篇

            我是做java开发的,从接触java开始算,已经8年了,为什么会想到学go语言呢?前端时间我一直在学习jvm,java的一些更底层的东西,梳理回顾时,感觉可以通过学习其他开发语言,来提 ...

  8. 《OpenResty 最佳实践》学习开篇

    前言:对openresty学习中,收集了一些相关知识的参考网站,有兴趣的可以看看.另附网盘分享. lua菜鸟教程 openresty最佳实战 lua在线解析工具 Nginx Lua API Nginx ...

  9. java多线程学习-开篇

    1.Java线程基本概念 在操作系统中两个比较容易混淆的概念是进程(process)和线程(thread).操作系统中的进程是资源的组织单位.进程有一个包含了程序内容和数据的地址空间,以及其它的资源, ...

随机推荐

  1. js console 一些拓展技巧

    console.time 方法 / console.timeEnd() 方法 统计一段代码的执行时间, 形参必须一致 console.time("string"); for(var ...

  2. java swing 中的FileDialog

    1.FileDialog使用方法: FileDialog fd=new FileDialog(new Frame(),"测试",FileDialog.LOAD);  Filenam ...

  3. Python强化训练笔记(三)——词频的统计

    现有列表如下: [6, 7, 5, 9, 4, 1, 8, 6, 2, 9] 希望统计各个元素出现的次数,可以看作一个词频统计的问题. 我们希望最终得到一个这样的结果:{6:2, 7:1...}即 { ...

  4. Java 隐藏和覆盖

    我们知道,在JAVA中,子类可以继承父类,如果子类声明的方法与父类有重名的情况怎么办,大伙儿都知道要是重写,但是实际上这又分为两种情况,就是方法和变量在继承时的覆盖和隐藏问题,这些概念性的东西看似无聊 ...

  5. 【翻译】How To Tango With Django 1.5.4 第二章

    2.开始吧! 准备好两个关键的安装包 Python version 2.7.5 Django version 1.5.4 2.1熟悉你自己的系统(我的是windows) 略 2.2安装软件 2.2.1 ...

  6. QThread

    #ifndef MYTHREAD_H #define MYTHREAD_H #include<QThread> class MyThread : public QThread { Q_OB ...

  7. 《Linux内核分析》第七周 读书笔记

    <深入理解计算机系统>CHAPTER7阅读梳理 [学习时间:3hours] [学习内容:链接需要的代码&数据:链接机制:链接生成的目标文件] 一.链接概述 1.链接 定义:链接是将 ...

  8. C# ASP.NET MVC HtmlHelper用法大全

    UrlHrlper 下面的两个地址一样的功能 下边这个防止路由规则改变 比如UserInfo/Index改为UserInfo-Index,使用下面的不受影响 另一种形式的超链接: <%: Htm ...

  9. ios - GCD简单小结

    首先GCD两个名词: 队列 同步异步. 队列: 任务放到队列,队列中的任务执行方式取决于执行队列中任务的方式---同步异步. 串行队列: 任务顺序执行,可以叫阻塞队列.只有前面任务完成才执行后面的. ...

  10. hdu 1175冒牌连连看

    #include <bits/stdc++.h> using namespace std; const int N = 1005; int arr[N][N]; int vis[N][N] ...