HTML是什么以及怎么用

html是超文本标记语言,是一种用来制作超文本文档的简单标记语言,本文详细的介绍了html的发展和基本概念,有兴趣的可以了解一下

HTML的发展历史: 

HTML英语意思是 Hypertext Marked Language,即超文本标记语言,是一种用来制作超文本文档的简单标记语言。HTML是由WEB的发明者Tim Berners-Lee和同事Daniel W.Connolly于1990年创立的一种标记式语言。它是标准通用化标记语言SGML的应用。

用HTML编写的超文本文档称为HTML文档,它能独立于各种操作系统平台(如UNIX,WINDOWS等)。通过HTML,将所需要表达的信息按某种规则写成HTML文件,通过专用的浏览器来识别,并将这些HTML一种能够被广泛理解的语言,“翻译“成可以识别的信息,即所有的计算机都能够理解的一种用于出版的“母语”。就是我们现在所见到的网页。 自1990年以来HTML就一直被用作WWW(是World Wide Web的缩写,也可简写WEB、中文叫做万维网)的信息表示语言,用于描述Homepage的格式设计和它与WWW上其它Homepage 的连结信息。使用HTML语言描述的文件需要通过WWW浏览器显示出效果。

HTML( 超文件标记语言 ) 是一种建立网页文件的语言,透过标记式的指令(Tag),将影像、声音、图片、文字、动画、影视等内容显示出来。因为它可以从一个文件跳转到另一个文件,与世界各地主机的文件连接。 超文本传输协议规定了浏览器在运行HTML文档时所遵循的规则和进行的操作.HTTP协议的制定使浏览器在运行超文本时有了统一的规则和标准.

立即学习“前端免费学习笔记(深入)”;

所谓超文本,是因为它可以加入图片、声音、动画、影视等内容,事实上每一个HTML文档都是一种静态的网页文件,这个文件里面包含了HTML指令代码,这些指令代码并不是一种程序语言,它只是一种排版网页中资料显示位置的标记结构语言,易学易懂,非常简单。HTML的普遍应用就是带来了超文本的技术—-通过单击鼠标从一个主题跳转到另一个主题,从一个页面跳转到另一个页面与世界各地主机的文件链接。直接获取相关的主题。如下所示:

通过html可以表现出丰富多彩的设计风格:

图片调用:HTML是什么以及怎么用
文字格式: 文字

通过HTML可以实现页面之间的跳转: 

页面跳转:〈A HREF=”文件路径/文件名”> 

通过HTML可以展现多媒体的效果: 

声频:
视频:

从上面我们可以看到HTML超文本文件时需要用到的一些标签。在HTML中每个用来作标签的符号都是一条命令、它告诉浏览器如何显示文本。这些标签均由””符号以及一个字符串组成。而浏览器的功能是对这些标记进行解释,显示出文字、图像、动画、播放声音。这些标签符号用“”来表示。

HTML只是一个纯文本文件。创建一个HTML文档,只需要两个工具,一个是HTML编辑器,一个WEB浏览器。HTML编辑器是用于生成和保存THML文档的应用程序。WEB浏览器是用来打开WEB网页文件,提供给我们查看WEB资源的客户端程序。

HTML文档属于纯文本文件(它能用任意的文本编写器书写)。 例如,HTML语言可直接使用普通的文本编辑器进行编辑。

HTML的强大功能:

出版在线的文档,其中包含了标题、文本、表格、列表以及照片等内容。

通过超链接检索在线的信息。

为获取远程服务而设计表单,可用于检索信息、定购产品等。

在文档中直接包含电子表格、视频剪辑、声音剪辑以及其他的一些应用.

HTML的广泛应用: 

所有的万维网文件都是由超文本标志语言HTML所创建的。在这种语言中,可以使用各种标记对文件进行处理。这些标记决定了文件内容的外观、结构以及交互性等方面,他们的共同之处就是都使用””,例如段落标记

,图片标记等。

在浏览器中,是看不到任何HTML标记的,但是在浏览器中所看到的网页效果却都是由这些标记生成的。在大多数情况下,在创建站点时并不需要对HTML标记进行掌握,因为在FrontPage 等这样的软件中,对于HTML的处理是在幕后进行的,因而就掩盖了该语言的复杂性。 如果需要查看网页的HTML标记,可以选择HTML模式。

现在的网页制作,大都采用一些专门的网页制作工具,如Dreamweaver、webstorm 等。这些工具都是所见即所得,非常地方便。但大家千万不要以为只懂这些工具就够了。在很多时候,我们都需要手动对HTML代码进行调整,才能达到更好、更专业的效果。

 在了解了HTML的定义后,接下来我们便来学习此语言。   

一、为什么要学习HTML?

近两年来,许多公司开发出了图形化的HTML开发工具,使得网页的制作变得非常简单。webstorm,Adobe公司推出的Adobe Pagemill,Micromedia公司推出的Dreamweaver等编辑工具,都被称为“所见即所得”的网页制作工具。这些图形化的开发工具可以直接处理网页,而不用书写费劲的标记。这使得用户在没有HTML语言基础的情况下,照样可以编写网页。这时,编写HTML文档的任务由开发工具替你完成了。这是网页图形编辑工具的最大成功之处,但也是它们的最大不足之处。受到图形编辑工具自身的约束,将产生大量的垃圾代码。原因很简单,比如:在网页设计一个表格,若是每个单元格的宽度和高度让它根据其中的内容自动确定,HTML只要你告诉它是表格和单元格的排列顺序(也就是行列数)就行了,但因为图形化开发工具无法得知你的这种特殊要求,所以只能取一般要求,把每个单元格的宽度和高度都定义起来,从而增加了许多代码。所以一个明智的网页编写者应该在掌握图形编辑工具的基础上进一步学会HTML语言,从而知道那些是垃圾代码,这样,我们就可以利用图形化HTML开发工具快速成地做出网页,又会消除无用的代码,从而达到快速制作高质量网页的目的。

因此,HTML语言是网页制作的基础,是初学者必学的内容。虽然现在有许多所见即所得的网页制作工具,但是说到底,还是有必要了解一些HTML的语法。这样,您可以更精确的控制页面的排版,可以实现更多的功能。

二、如何用HTML?

HTML语言,又称超文本标记语言,是英文Hyper Text Markup Language的缩写。HTML语言作为一种标识性的语言,是由一些特定符号和语法组成的,所以理解和掌握都是十分容易的。可以说,HTML语言在所有的计算机编程语言中是最简单易学的。组成HTML的文档都是ASCIlI档,所以创建HTML文件十分简单,只需一个普通的字符编辑器即可。如 Windows中的记事本、写字板都可以使用。也可以采用专用的 HTML 编辑工具:如 CoffeeHTML、Homesite、HTMLedit Pro等工具,它们的特点是能够自动检查HTML文档中的语法错误并协助改正。由于有了图形化的HTML开发工具,使得我们学习HTML更加容易,我们可以先用它制作好网页,再在它附带的HTML代码编辑器在删去那些无用的代码,利用它的所见即所得特性,从而使我们很快就能熟炼地掌握HTML。特别是Micromedia 公司最近发布的Dreamweaver4,可以把源代码编辑器和网页编辑器放在同一个窗口中,真是方便极了。  

三、HTML基本概念

1、定义:

HTML 语言是一种超文本的标记语言,简单来讲就是构建一套标记符号和语法规则,将所要显示出来的文字、图象、声音等要素按照一定的标准要求排放,形成一定的标题、段落、列表等单元。

2、超文本标记

1) 超文本标记用带尖括号“<”和“>”表示。

2)超文本标记一般是成对出现,用带斜杠的元素表示结束。如:<html>和</html>。但有些标记只有起始标记而没有结束标记,如:<BR>,它在网页中表示引入一个换行动作,还有些标记可以省略,如:段落的结束标记</P>就可以省略。

3)超文本标记忽略大小写,如:<HTML>和<html>是等效的,但其中实体内容的名称是要区分大小写,如”&NAME”和”&name”是表示不同的实体。

4)一个标记元素可写在多行,参数位置不受限制。

3、HTML语言的单元 (元素)       

整个网页页面的内容由特定内容形成的许多单元构成的,而每个单元又由三部分组成—-起始标记、单元内容、结束标记。

起始标记:起始标记由“<”和“>”来界定,单元名称和属性由起始标记给出;

单元内容:中间的部分是单元的内容部分;

结束标记:结束标记由“</”和“>”来界定,比起始标志多一斜杠;

例如:标题栏单元的标记形式

<TITLE>高考状元访谈–记一位农家孩子的成长经历</TITLE>

其中<TITLE>和</TITLE>是起始标记和结束标记,“高考状元访谈–记一位农家孩子的成长经历”是单元的基本内容。

总之,整个HTML文档都是由标记构成的,HTML文档的标记为编写该文档建立了固定的框架,我们只需要在这个框架中填充内容就行了。

学好用好HTML语言的关键是灵活应用标记的参数。特别是默认值的应用

总结:以上就是本篇文的全部内容,希望能对大家的学习有所帮助。

相关推荐:

什么是HTML?关于html的具体介绍

什么是html文件?又如何打开html文件

什么是HTML相关介绍_基础教程

以上就是HTML是什么以及怎么用的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1546223.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月21日 18:00:07
下一篇 2025年12月21日 18:00:24

相关推荐

  • 学会从头开始学习CSS,掌握制作基本网页框架的技巧

    从零开始学习CSS,掌握网页基本框架制作技巧 前言: 在现今互联网时代,网页设计和开发是一个非常重要的技能。而学习CSS(层叠样式表)是掌握网页设计的关键之一。CSS不仅可以为网页添加样式和布局,还可以为用户呈现独特且具有吸引力的页面效果。在本文中,我将为您介绍一些基本的CSS知识,以及一些常用的代…

    2025年12月24日
    200
  • 揭秘Web标准涵盖的语言:了解网页开发必备的语言范围

    在当今数字时代,互联网成为了人们生活中不可或缺的一部分。作为互联网的基本构成单位,网页承载着我们获取和分享信息的重要任务。而网页开发作为一门独特的技术,离不开一些必备的语言。本文将揭秘Web标准涵盖的语言,让我们一起了解网页开发所需的语言范围。 首先,HTML(HyperText Markup La…

    2025年12月24日
    000
  • 揭开Web开发的语言之谜:了解构建网页所需的语言有哪些?

    Web标准中的语言大揭秘:掌握网页开发所需的语言有哪些? 随着互联网的快速发展,网页开发已经成为人们重要的职业之一。而要成为一名优秀的网页开发者,掌握网页开发所需的语言是必不可少的。本文将为大家揭示Web标准中的语言大揭秘,介绍网页开发所需的主要语言。 HTML(超文本标记语言)HTML是网页开发的…

    2025年12月24日
    400
  • 常用的网页开发语言:了解Web标准的要点

    了解Web标准的语言要点:常见的哪些语言应用在网页开发中? 随着互联网的不断发展,网页已经成为人们获取信息和交流的重要途径。而要实现一个高质量、易用的网页,离不开一种被广泛接受的Web标准。Web标准的制定和应用,涉及到多种语言和技术,本文将介绍常见的几种语言在网页开发中的应用。 首先,HTML(H…

    2025年12月24日
    000
  • 网页开发中常见的Web标准语言有哪些?

    探索Web标准语言的世界:网页开发中常用的语言有哪些? 在现代社会中,互联网的普及程度越来越高,网页已成为人们获取资讯、娱乐、交流的重要途径。而网页的开发离不开各种编程语言的应用和支持。在这个虚拟世界的网络,有许多被广泛应用的标准化语言,用于为用户提供优质的网页体验。本文将探索网页开发中常用的语言,…

    2025年12月24日
    000
  • 深入探究Web标准语言的范围,涵盖了哪些语言?

    Web标准是指互联网上的各个网页所需遵循的一系列规范,确保网页在不同的浏览器和设备上能够正确地显示和运行。这些标准包括HTML、CSS和JavaScript等语言。本文将深入解析Web标准涵盖的语言范围。 首先,HTML(HyperText Markup Language)是构建网页的基础语言。它使…

    2025年12月24日
    000
  • CSS 超链接属性解析:text-decoration 和 color

    CSS 超链接属性解析:text-decoration 和 color 超链接是网页中常用的元素之一,它能够在不同页面之间建立连接。为了使超链接在页面中有明显的标识和吸引力,CSS 提供了一些属性来调整超链接的样式。本文将重点介绍 text-decoration 和 color 这两个与超链接相关的…

    2025年12月24日
    000
  • 看看这些前端面试题,带你搞定高频知识点(一)

    每天10道题,100天后,搞定所有前端面试的高频知识点,加油!!!,在看文章的同时,希望不要直接看答案,先思考一下自己会不会,如果会,自己的答案是什么?想过之后再与答案比对,是不是会更好一点,当然如果你有比我更好的答案,欢迎评论区留言,一起探讨技术之美。 面试官:给定一个元素,如何实现水平垂直居中?…

    2025年12月24日 好文分享
    300
  • 看看这些前端面试题,带你搞定高频知识点(二)

    每天10道题,100天后,搞定所有前端面试的高频知识点,加油!!!,在看文章的同时,希望不要直接看答案,先思考一下自己会不会,如果会,自己的答案是什么?想过之后再与答案比对,是不是会更好一点,当然如果你有比我更好的答案,欢迎评论区留言,一起探讨技术之美。 面试官:页面导入样式时,使用 link 和 …

    2025年12月24日 好文分享
    200
  • 看看这些前端面试题,带你搞定高频知识点(三)

    每天10道题,100天后,搞定所有前端面试的高频知识点,加油!!!,在看文章的同时,希望不要直接看答案,先思考一下自己会不会,如果会,自己的答案是什么?想过之后再与答案比对,是不是会更好一点,当然如果你有比我更好的答案,欢迎评论区留言,一起探讨技术之美。 面试官:清除浮动有哪些方式? 我:呃~,浮动…

    2025年12月24日 好文分享
    000
  • 看看这些前端面试题,带你搞定高频知识点(四)

    每天10道题,100天后,搞定所有前端面试的高频知识点,加油!!!,在看文章的同时,希望不要直接看答案,先思考一下自己会不会,如果会,自己的答案是什么?想过之后再与答案比对,是不是会更好一点,当然如果你有比我更好的答案,欢迎评论区留言,一起探讨技术之美。 面试官:请你谈一下自适应(适配)的方案 我:…

    2025年12月24日 好文分享
    000
  • 看看这些前端面试题,带你搞定高频知识点(五)

    每天10道题,100天后,搞定所有前端面试的高频知识点,加油!!!,在看文章的同时,希望不要直接看答案,先思考一下自己会不会,如果会,自己的答案是什么?想过之后再与答案比对,是不是会更好一点,当然如果你有比我更好的答案,欢迎评论区留言,一起探讨技术之美。 面试官:css 如何实现左侧固定 300px…

    2025年12月24日 好文分享
    000
  • HTML+CSS+JS实现雪花飘扬(代码分享)

    使用html+css+js如何实现下雪特效?下面本篇文章给大家分享一个html+css+js实现雪花飘扬的示例,希望对大家有所帮助。 很多南方的小伙伴可能没怎么见过或者从来没见过下雪,今天我给大家带来一个小Demo,模拟了下雪场景,首先让我们看一下运行效果 可以点击看看在线运行:http://hai…

    2025年12月24日 好文分享
    500
  • 分享20个首页流行布局样式,总有一款适合你!

    本篇文章给大家分享20个首页流行布局样式,总有一款适合你,快来收藏试试吧,希望对大家有所帮助! 有时我们会在网站上遇到一些内容布局问题,如文字对齐、图片设计与内容和谐、为文章选择合适的字体……在今天的文章中,介绍一些设计精美的创意布局,let‘s  开始。 代号 001 源码…

    2025年12月24日 好文分享
    000
  • css如何让div悬浮于另一个div上

    让div悬浮于另一个div上的方法:1、给两个div元素添加“position:absolute”绝对定位样式;2、给其中一个div元素添加“{top:距离页面顶部距离;left:距离页面左侧距离;}”样式使其浮动在另一个div元素上即可。 本教程操作环境:windows7系统、CSS3&&…

    2025年12月24日 好文分享
    000
  • css怎样实现字母不到一行就换行

    css字母不到一行就换行的方法:1、给元素添加“word-break:break-word;”样式,使其以单词为单位换行;2、给元素添加“word-break:break-all;”样式,使其以字母为单位换行。 本教程操作环境:windows7系统、CSS3&&HTML5版、Dell…

    2025年12月24日
    000
  • css里怎样设置字体大小和字体颜色

    在css中,可以使用“font-size”和color属性设置字体大小和字体颜色,只需要给字体元素添加“{font-size: 字体大小值;color: 颜色值;}”样式即可。 本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。 css里设置字体大小…

    2025年12月24日
    000
  • css边框变圆角边框怎么写

    写法:1、给边框添加“border-radius:圆角值;”样式统一设置圆角大小;2、添加“border-top-left-radius:圆角值;”、“border-top-right-radius:圆角值;”等样式分别设置四角圆角大小。 本教程操作环境:windows7系统、CSS3&&a…

    2025年12月24日
    000
  • css如何使鼠标悬停变色

    在css中,可以通过hover选择器和color属性实现鼠标悬停变色的效果,hover选择器用于选择鼠标指针浮动在上面的元素,color属性用于设置悬停时的颜色;语法“:hover{color:悬停颜色;}”。 本教程操作环境:windows7系统、CSS3&&HTML5版、Dell…

    2025年12月24日 好文分享
    000
  • 手把手教你使用css制作表格边框设置效果(附代码)

    之前的文章《一招教你使用css3制作按钮添加动态效果(代码分享)》中,给大家介绍了怎么使用css3制作按钮添加动态效果。下面本篇文章给大家介绍怎么使用css制作表格边框设置效果,我们一起看看怎么做。 网页中常常有这样的表格布局边框,给大家分享一下看效果图看完效果,我们来研究一下是怎么实现呢,给大家用…

    2025年12月24日 好文分享
    000

发表回复

登录后才能评论
关注微信