一、什么是HTML?

HTML不是编程语言,是用来描述网页文档(页面结构)的一种标记语言;

HTML指超文本标记语言(Hyper Text Markup Language),之所以称为超文本标记语言,是因为文本中包含了所谓“超级链接”点。;

HTML规定了自己的语法规则,用来表示比“文本”更丰富的意义,比如图片,表格,链接等。浏览器 (IE,FireFox等)软件知道HTML语言的语法,可以用来查看HTML文档。目前互联网上的绝大部分网页都是使用HTML编写的。

二、HTML是什么样的?

简单地来说,HTML的语法就是给文本加上表明文本含义的标签(Tag),让用户(人或程序)能对文本得到更好的理解。

下面是一个最简单的HTML文档:

<html>

  <head>

    <title>第一个Html文档</title>

  </head>

  <body>

    欢迎访问<a href="http://hanzhaoxin.cnblogs.com/">我的博客</a>! 

 

  </body>

</html>

所有的HTML文档都应该有一个<html>元素,<html>元素可以包含两个部分:<head>和<body>。

<head>元素用于包含整个文档的一般信息,比如文档的标题(<title>元素用于包含标题),对整个文档的描述,文档的关键字等等。

文档的具体内容就要放在<body>元素里。<a>元素用于表示链接,在浏览器(如IE,Firefox等)中查看HTML文档时,点击<a>标签括起来的内容时, 通常会跳转到另一个页面。这个要跳转到的页面的地址由<a>元素的href属性指定。上面的<a href=http://hanzhaoxin.cnblogs.com/>中,href属性的值就是http://hanzhaoxin.cnblogs.com/。

三、HTML文档可以包含哪些内容 ?

通过不同的标签,HTML文档可以包含不同的内容,比如文本,链接,图片,列表,表格,表单,框架等。 

  • 文本 :HTML对文本的支持是最丰富的,你可以设置不同级别的标题,分段和换行,可以指定文本的语义和外观,可以说明文本是引用自其它的地方,等等等等。 
  • 链接 :链接用来指出内容与另一个页面或当前页面某个地方有关。 
  • 图片 :图片用于使页面更加美观,或提供更多的信息。 
  • 列表 :列表用于说明一系列条目是彼此相关的。 
  • 表格 :表格是按行与列将数据组织在一起的形式。也有不少人使用表格进行页面布局。 
  • 表单 :表单通常由文本输入框,按钮,多选框,单选框,下拉列表等组成,使HTML页面更有交互性。 
  • 框架 :框架使页面里能包含其它的页面。 

四、对于HTML我会说哪些概念?

文档:HTML文档俗称网页。

标签:用尖括号包围的关键词我们成为标签。通常HTML标签成对出现,如:<a>、</a>。

  • 开始标签:标签对中的第一个标签是开始标签,也成为开放标签。如<a>。

  • 结束标签:标签对中的第二个标签是结束标签,也成为闭合标签。如</a>。

元素:我们把匹配的标签对以及它们包围的内容称为元素。即(元素 = 开始标签 + 内容 + 结束标签)。如:<a href="http://hanzhaoxin.cnblogs.com/">我的博客</a>。

  • 块级元素:在浏览器默认显示时以新行来开始(和结束)的元素。

  • 内联元素:又称行内元素,在浏览器默认显示时在同一行按从左至右顺序显示,不单独占一行的元素。

属性:开始标签中那些以名称/值对的形式出现的内容,我们称之为属性。如上例中:href="http://hanzhaoxin.cnblogs.com/"。(href是属性名称,"http://hanzhaoxin.cnblogs.com/"是属性值)。

后端码农谈前端(HTML篇)第一课:HTML概述的更多相关文章

  1. 后端码农谈前端(CSS篇)第一课:CSS概述

    一.从扮演浏览器开始 扮演浏览器是Head First图书中很有意义的一个环节.可作者忘记了告诉我们扮演浏览器的台本.我们从这里开始. 上图是webkit内核渲染html和css的流程图.从该图我们可 ...

  2. 后端码农谈前端(CSS篇)第七课:定位与浮动

    一.定位: 1.定位的理解 (1)相对定位 相对定位是一个非常容易掌握的概念.如果对一个元素进行相对定位,它将出现在它所在的位置上.然后,可以通过设置垂直或水平位置,让这个元素"相对于&qu ...

  3. 后端码农谈前端(CSS篇)第四课:选择器补充(伪类与伪元素)

    一.伪类: 属性 描述 :active 向被激活的元素添加样式. :focus 向拥有键盘输入焦点的元素添加样式. :hover 当鼠标悬浮在元素上方时,向元素添加样式. :link 向未被访问的链接 ...

  4. 后端码农谈前端(CSS篇)第二课:CSS的5个来源

    0.浏览器默认样式 当你不为html元素设置任何样式时,显示在浏览器上的(比如:<b>元素会显示粗体.<p>元素有纵向margin.<h1>元素字号比<p&g ...

  5. 后端码农谈前端(HTML篇)第二课:常见元素

    一.根元素 <doctype> 定义文档类型. <html> 定义 HTML 文档. 二.元数据元素 <head> 定义关于文档的信息. <meta> ...

  6. 后端码农谈前端(CSS篇)第八课:继承与层叠

    一.继承 继承:所谓CSS样式继承,就是子元素应用父元素的规则声明.(由这一特性,可将CSS属性分为可继承属性和非可继承属性.)可继承属性:属性值可由父元素继承给子元素的属性称之为可继承属性. 哪些属 ...

  7. 后端码农谈前端(CSS篇)第六课:盒子模型

    元素框的最内部分是实际的内容,直接包围内容的是内边距.内边距呈现了元素的背景.内边距的边缘是边框.边框以外是外边距,外边距默认是透明的,因此不会遮挡其后的任何元素. 提示:背景应用于由内容和内边距.边 ...

  8. 后端码农谈前端(CSS篇)第五课:CSS样式

    一.背景: CSS 允许应用纯色作为背景,也允许使用背景图像创建相当复杂的效果. 1.背景色 可以使用 background-color 属性为元素设置背景色.这个属性接受任何合法的颜色值. 例如: ...

  9. 后端码农谈前端(CSS篇)第三课:选择器

    一.选择器 1.ID选择器: 语法:首先,ID 选择器前面有一个 # 号 - 也称为棋盘号或井号.请看下面的规则: *#intro {font-weight:bold;} 与类选择器一样,ID 选择器 ...

随机推荐

  1. 解决中64位Win7系统上PLSQL无法连接ORACLE的方法(PLSQL无法识别ORACLE_HOME的配置)

    最近新安装了64位的Win7系统,工作中需要用oracle数据库,而数据库是公司IT的DBA进行管理和维护的. 我们只需要连接上去进行使用就可以了,于是我就在自己的机器上安装了oracle clien ...

  2. Python操作Excel

    一.系统性学习 对于操作Excel,需要Xlrd/xlwt这两个模块,下面推荐出系统性学习的网址: python操作Excel读写--使用xlrd 官方文档 Python 使用 Xlrd/xlwt 操 ...

  3. iOS10 相机相册等权限的使用、检测并引导用户开启权限

    <!-- 相册 --> <key>NSPhotoLibraryUsageDescription</key> <string>App需要您的同意,才能访问 ...

  4. 如何成为一位优秀的创业CEO

    英文原文:How to Be Startup CEO 编者按:本文来自 Ryan Allis,是一位来自旧金山的创业者和投资人.在 2003 年创立了 iContact,并任 CEO. 做创业公司的 ...

  5. 构造函数模式自己定义js对象

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. 工作组环境下管理windows.

    此处指的是windows7 1.防火墙设置 开启wmi,remote admin,防火墙远程管理 可以使用命令行 netsh advfirewall export "C:\temp\WFco ...

  7. 奇怪吸引子---Thomas

    奇怪吸引子是混沌学的重要组成理论,用于演化过程的终极状态,具有如下特征:终极性.稳定性.吸引性.吸引子是一个数学概念,描写运动的收敛类型.它是指这样的一个集合,当时间趋于无穷大时,在任何一个有界集上出 ...

  8. Delphi 中 动态创建的Panel无法改变颜色的解决办法

    刚开始代码如下: procedure TForm1.Button1Click(Sender: TObject); var Panel: TPanel; begin Panel := TPanel.Cr ...

  9. wordpress自动截取文章摘要代码

    想要实现 wordpress 首页显示摘要有几种方法: 第一种,可以在写文章的时侯在需要分割的地方加入<!–more–>标签,但在输出首页摘要的同时,也会使feed只显示摘要,不方便读者阅 ...

  10. 【python】——小程序之电话薄

    初学python,写一个小程序练习一下.主要功能就是增删改查的一些功能.主要用到的技术:字典的使用,pickle的使用,io文件操作.代码如下: import pickle #studentinfo ...