1. 了解什么是HTML

HTML概念

HTML,超文本标记语言。它由一套标签组成用来描述网页,值得我们注意的是HTML并不是编程语言,它只是一种标记,我们通过HTML定义了网页的结构,然后再利用其他技术装饰这个结构,赋予这个结构活动的能力。HTML的内容并不复杂,也很容易上手,但是要编写出符合标准而且语义良好的HTML代码却不是一件容易的事情,需要我们不断的练习和学习才可以。

混淆内容

1. htm、html

一般我们操作的HTML都是html格式的,但是在其他地方却可能遇到过htm的文件。其实这两种格式的文件没有什么不同,htm只是为了兼容过去DOS命名格式出现的,而且现在已经很少用了。

2. shtml、shtm

这两种格式的文件被看作一种编程语言,它们可以被服务器识别,类似于JSP、ASP、PHP之类的文件,所以它们和html、htm是不同的。

3. DHTML

在网上的可能会看到这种说法,它不是一种编程语言,只是网景和微软两大浏览器厂商提出的浏览器4.x时代应该具备的特点。它集合了HTML、CSS、JavaScript可以动态的显示网页内容,所以它是相对于静态网页而言的,只是一种销售的术语。

HTML历史

1993年6月,互联网工程工作小组发布了关于 超文本标记语言的工作草案(并非标准);

1995年11月,HTML2.0 作为RFC 1866 发布(2000年6月发布之后被宣布过时);

1996年1月14日,HTML3.2 发布,W3C 推荐的标准;

1997年12月18日,HTML4.0 发布,W3C 推荐的标准;

1999年12月24日,HTML4.01发布,做了微小的的改进,W3C推荐的标准;

2000年1月26日,XHTML1.0发布,W3C 推荐的标准;

2001年5月31日,XHTML1.1 发布;

XHTML 2.0 是W3C的工作草案,不过因为改动太大,学习成本太大,所以现在依然使用的还是 XHTML1.0;

目前HTML5作为最新的版本,提供了一些新的元素和一些有趣的新特性,同时也建立了一些新的规则。这些元素、特性、规则的建立提供很多新的网页功能,常见的像网页可以实现动态渲染、不需要使用任何插件就可以直接播放视频。尽管如此,可以HTML5依然在尝试的阶段,大部分浏览器还不能完全支持HTML5;

注意XHTML

在XHTML中标签名必须小写,HTML中标签名大小写不限;

在XHTML、HTML中的属性名都必须是小写;

在XHTML中标签必须严格的嵌套,HTML中对嵌套没有严格的规定;

在XHTML中标签必须封闭,在HTML中标签是否封闭并没有严格要求;

在XHTMl中即使是自闭标签也必须封闭,HTML中没有严格规定;

在XHTML中属性值必须使用双引号,HTML中属性可以不使用双引号;

在XHTML中属性值必须使用完整形式,HTML中一些属性可以使用简写形式;

在XHTML中还要求区分清除 内容标签和结构标签。

HTML结构

 一个完整的HTML结构包括了声明、网页头部、网页主体几部分组成。其中声明部分定义网页使用的HTML版本,网页的头部定义了网页的标题、引用的样式和脚本等内容,网页的主体部分包含在浏览器页面中展示的所有内容。

1. 特点

网页的声明必须定义在HTML的第一行,网页的标题和主体两大部分包括在标签中。

在编写HTML时,没有哪一部分是必须的,但是在编码时尽量按照这个结构编写HTML,不要缺失某一部分。

2. 声明

声明必须在HTML的第一行,它约束HTML的文档结构,校验是否符合Web标准,同时告知浏览器应该采用哪个版本的规范来解析文档。

在HTML4.01中的声明引用了DTD文件,而HTML5则没有。DTD: 规定标记语言的规则,这样浏览器才可以正确显示内容。

最好始终在页面中定义声明,这样方便浏览器按照统一的标准来解析。

3. 标签

这个标签描述网页的基本信息,包括文档内容类型、字符编码、搜索的关键字、网站功能和服务的详细描述。而且值得注意的是这个标签的内容并不会在页面中展示出来,使用这个标签可以方便搜索引擎的检索和浏览器解析。

注意:如果想要了解更多和这个标签相关的信息可以访问 W3C的官网查看。

HTML编码

所有的标签名、属性名都必须小写,属性值使用 双引号。虽然在HTML中不区分大小写,但是 W3C 规范建议是小写;

为所有的关键因素定义 id、class ,这样方便和JS、CSS交互,避免不必要的错误出现;

推荐 id、class的命名方式按照语义和DOM树的层级关系定义合适的名称,而且名称中应该全部使用小写。其中 id的名称关键词用下划线” _ “连接,class 的关键词用 “-” 连接,避免命名冲突;

在HTML的不同层次缩进使用四个空格,如果这个元素包括子元素,那么这个元素对应的起始标签和结束标签分别单独占用一行;

为HTML添加必要的注释,不过在HTML中的注释不宜过多。添加注释的原则要在保证代码维护性的基础上,尽量保证让HTML代码简洁。一般注释添加在页面的公共部分(页面头部、尾部、侧边栏等),在页面中经常变化的部分以及需要后端代码注入的部分添加注释,而且注释添加的位置应该单独占一行不要在代码的前后添加注释;

微信公众账号
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 217,277评论 6 503
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,689评论 3 393
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 163,624评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,356评论 1 293
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,402评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,292评论 1 301
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,135评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,992评论 0 275
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,429评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,636评论 3 334
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,785评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,492评论 5 345
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,092评论 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,723评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,858评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,891评论 2 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,713评论 2 354

推荐阅读更多精彩内容

  • 什么是html? html是一种网页标记语言,叫超文本标记语言,我们平时上网所看到的所有网页均来自于html,英文...
    波段顶底阅读 8,360评论 2 7
  • 格式后期处理。 Jeremy Keith在 Fronteers 2010 上的主题演讲 今天我想跟大家谈一谈HTM...
    LordZhou阅读 1,126评论 0 17
  • 一、XHTML简介 XHTML 是更严格更纯净的 HTML 代码。 XHTML 是什么? XHTML 指可扩展超文...
    AR7_阅读 838评论 0 2
  • HTML、XML、XHTML 有什么区别 1.HTML 是用来描述网页的一种语言,指的是超文本标记语言 (Hype...
    饥人谷_牛牛阅读 690评论 0 2
  • 一、HTML、XML、XHTML 有什么区别 1. HTML是什么? 描述网页的一种语言 超文本标记语言 (Hyp...
    饥人谷_CST阅读 804评论 0 7