最近开的博客,一切都是从零开始,昨天刚写了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. 在win7下安装unbuntu系统

    1.分盘 准备EasyBCD,ubuntu操作系统 配置EasyBCD,安装ubuntu http://www.linuxidc.com/Linux/2014-04/100369.htm http:/ ...

  2. 【iCore3 双核心板】例程二十五:LAN_DNS实验——域名解析

    实验指导书及代码包下载: http://pan.baidu.com/s/1jHlBpqe iCore3 购买链接: https://item.taobao.com/item.htm?id=524229 ...

  3. python logging 配置

    python logging 配置 在python中,logging由logger,handler,filter,formater四个部分组成,logger是提供我们记录日志的方法:handler是让 ...

  4. SQL2008关于quotename的用法

    ),) set @tbname='index' ---查这个表里的数据: print(@tbname) set @sql = 'select * from '+QUOTENAME(@tbname) p ...

  5. 从零开始的Android新项目1 - 架构搭建篇

    记录一下新项目的搭建. 试想一下,如果没有历史负担,没有KPI压力,去新搭建一个项目,你会怎么设计和实现呢? 本系列文章不是教你怎么从0开始学Android,从0开始怎么建一个项目,而定位于零负担的情 ...

  6. Inside Flask - json 处理

    Inside Flask - json 处理 在处理 web api 时,json 是非常好用的数据交换格式,它结构简单,基本上各种主流的编程语言都有良好的支持工具. flask 中处理 json 时 ...

  7. JS阻止链接跳转代码

    刷新后focus在第一个标签 onload="$('#input_email').focus(); " $(document).ready(function(){ $(" ...

  8. python 安装easy_install和pip

    做个记录 easy_install和pip都是用来下载安装Python一个公共资源库PyPI的相关资源包的 首先安装easy_install 下载地址:https://pypi.python.org/ ...

  9. c#大文件分割过程

    需求: 在项目开发中,我们会遇到单个文件大小超过1TB的文件,这样的文件只能进行单文件读取,往往会造成读取完成耗时过长,导致客户在使用体验过程中不满意. 为了解决提升大文件的解析速度,我想到了先分割大 ...

  10. RelativeLayout实现左中右布局

    <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_co ...