学习之前,让我们先来了解一下HTML。

它的英文全称是:Hyper Text Markup Language,中文通常被称为超文本标记语言,HTML是Internet中用于编写网页的主要语言,HTML提供了精简而有力的文件定义,可以设计出多姿多彩的超媒体文件。通过HTTP通信协议,HTML文件得以在万维网上进行跨平台的文件交换。

HTML的特性:

HTML文件制作简单,且功能强大,支持不通数据格式的文件导入,主要有以下几个特点:

①HTML文档容易创建,只需要一个文本编辑器就可以完成。

②HTML文件存储容量小,能够尽可能快速地在网络中进行传输和显示。

③HTML文件与操作平台无关,HTML独立于操作系统平台,能够与多种平台兼容,只需要一个浏览器就可以在操作系统中浏览网页文件。

④简单易学,不需要很深的编程知识。

⑤HTML具有扩展性,HTML的广泛应用带来了加强功能、增加标识符等要素,HTML采取了类元素的方式,为了系统扩展提供了保证。

一个完整的HTML的文件由标题、段落、列表、表格、单词和嵌入的各种对象所组成。

这些逻辑上统一的对象统称为元素,HTML使用标签来分割并描述这些元素。

HTML的文档结构:

<html>                     <!--文件开始-->
<head> <!--头部开始-->
显示头部内容
</head> <!--头部结束-->
<body> <!--主体开始-->
主体内容
</body> <!--主体结束-->
</html> <!--文件结束-->

HTML的基本语法

  绝大多数元素都有起始标签和结束标签,在起始标签和结束标签之间的部分是元素体。

  每一个元素都有名称和可选择的属性,元素的名称和属性都在标签起始标签内进行设置。

1.普通标签

普通标签是由一个起始标签和一个结束标签所组成的。

<a>内容</a>

a代表标签名称,这个标签就如同一组开关,一个开,为标签开启某种功能,关闭就可以关闭功能,受控制的内容就放在两个标签直接。

普通标签还可以添加一些属性。

<a v="v1">内容</a>

v就是属性名称,v1就是对应的属性值,当然这个属性的数量是没有限制的。

2.空标签

单独存在的标签叫做空标签。

<x>

这些标签单独存在,用来完成某些特殊效果或功能。

<hr color="#0000FF">

HTML的编写注意事项

①“<”和“>”是任何标签的开始和结束。元素的标签需要使用这对尖括号括起来,并且在结束标签的前面加上符号“/”

②在HTML代码中不区分大小写

③任何空格和回车在HTML代码中均不起作用。为了使用HTML代码更加清晰,建议不同的标签之间使用回车进行换行

④在HTML的标签中可以添加各种属性设置

⑤需要正确的输入HTML的标签,输入HTML标签时,不要输入多余的空格,否则浏览器可能无法识别这个标签,导致无法正确的显示

⑥在HTML代码中合理的使用注释。<!--需要注释的内容-->,注释语句只会出现在HTML代码中,不会在浏览器中出现。

初始HTML5

HTML5,实际上是指HTML、CSS样式和JavaScript脚本在内的一整套技术的组合,

系统通过HTML5能够轻松实现许多丰富的网络应用需求,而减少对浏览器对插件的依赖,并且能够提供更多有效增强网络应用的标准集。

HTML5文档结构

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body> </body>
</html>
<!DOCTYPE html>是一个文档声明
其他与HTML并无太大差别。

测试开发之前端——No1.HTML和HTML5的更多相关文章

  1. 测试开发之前端——No9.HTML5中的视频/音频

    HTML5 视频和音频的 DOM 参考手册 HTML5 DOM 为 <audio> 和 <video> 元素提供了方法.属性和事件. 这些方法.属性和事件允许您使用 JavaS ...

  2. 测试开发之前端——No4.HTML5中的事件属性

    HTML5的事件属性. 属性 值 描述 onafterprint script 在打印文档之后运行脚本 onbeforeprint script 在文档打印之前运行脚本 onbeforeonload ...

  3. 测试开发之前端——No2.HTML5中的标签

    HTML5中的标签. 标签 描述 <!--...--> 定义注释. <!DOCTYPE>  定义文档类型. <a> 定义超链接. <abbr> 定义缩写 ...

  4. 测试开发之前端——No3.HTML5中的标准属性

    HTML5的标准属性 属性 值 描述 accesskey character 规定访问元素的键盘快捷键 class classname 规定元素的类名(用于规定样式表中的类). contentedit ...

  5. 测试开发之前端——No8.HTML5中的媒介事件

    媒介事件 由视频.图像以及音频等媒介触发的事件. 适用于所有 HTML 5 元素,不过在媒介元素(诸如 audio.embed.img.object 以及 video)中最常用: 属性 值 描述 on ...

  6. 测试开发之前端——No7.HTML5中的鼠标事件

    鼠标事件 由鼠标或相似的用户动作触发的事件. 适用于所有 HTML 5 元素: 属性 值 描述 onclick script 当单击鼠标时运行脚本 ondblclick script 当双击鼠标时运行 ...

  7. 测试开发之前端——No6.HTML5中的键盘事件

    键盘事件 由键盘触发的事件. 适用于所有 HTML 5 元素: 属性 值 描述 onkeydown script 当按下按键时运行脚本 onkeypress script 当按下并松开按键时运行脚本 ...

  8. 测试开发之前端——No5.HTML5中的表单事件

    表单事件 由 HTML 表单内部的动作触发的事件. 适用于所有 HTML 5 元素,不过最常用于表单元素中: 属性 值 描述 onblur script 当元素失去焦点时运行脚本 onchange s ...

  9. Web前端,HTML5开发,前端资源,前端网址,前端博客,前端框架整理 - 转改

    Web前端/H5开发,前端资源,前端网址,前端博客,前端框架整理 综合类 前端知识体系 前端知识结构 Web前端开发大系概览 Web前端开发大系概览-中文版 Web Front-end Stack v ...

随机推荐

  1. helm的安装于与简单使用

    根据 csdn 博客整理学习 原始博客地址: https://blog.csdn.net/weiguang1017/article/details/78045013 1. 下载所需要的文件: 客户端文 ...

  2. C# 汉字排序

    转载:http://blog.csdn.net/lgx040605112/article/details/6042316 using System; using System.Globalizatio ...

  3. 洛谷4859 BZOJ3622 已经没什么好害怕的了(DP,二项式反演)

    题目链接: 洛谷 BZOJ 题目大意:有两个长为 $n$ 的序列 $a,b$,问有多少种重排 $b$ 的方式,使得满足 $a_i>b_i$ 的 $i$ 的个数比满足 $a_i<b_i$ 的 ...

  4. [SDOI2009]Bill的挑战——全网唯一 一篇容斥题解

    全网唯一一篇容斥题解 Description Solution 看到这个题,大部分人想的是状压dp 但是我是个蒟蒻没想到,就用容斥切掉了. 并且复杂度比一般状压低, (其实这个容斥的算法,提出来源于y ...

  5. Swift学习笔记2

    1.函数参数都有一个外部参数名(external parameter name)和一个局部参数名(local parameter name).外部参数名用于在函数调用时标注传递给函数的参数,局部参数名 ...

  6. 使用mybatisgenerator 辅助工具逆向工程

    使用mybatisgenerator 辅助工具生成单表的dao层接口,mapper xml 文件以及实体类,复杂的还得人手动去编写哈...所以我也不觉得这玩意儿在项目简单情况下有什么鸟用... wha ...

  7. nginx配置伪静态

    最近做门户网站,使用了的nginx重写规则 项目目录下写好 nginx.conf文件 然后在打开nginx配置文件,在server引入对应的重写规则的文件就可以了 当然直接写在配置里面 locatio ...

  8. J2EE规范 - 13种规范

    J2EE是由SUN提出的用于简化开发企业级应用程序的一系列规范的组合,J2EE基于中间层集成的框架的方式为应用开发提供了一个统一的开发平台.基于容器管理.组件化的模型为企业建立一个高可用性,高可靠性可 ...

  9. CSS-3 Transition 的使用

    css的transition允许css的属性值在一定的时间区间内平滑地过渡.这种效果可以在鼠标单击.获得焦点.被点击或对元素任何改变中触发,并圆滑地以动画效果改变CSS的属性值." tran ...

  10. Ionic -- css

    Header 固定在头部,可以包含标题标签,可以有左右按钮 样式:bar bar-header bar-light 第一个小节 第二个表示的是头部 第三个表示颜色 子头部,需要在ion-content ...