html标签图文详解.pdf

本⽂最初于2015-10-01发表于博客园，并在GitHub上持续更新前端的系列⽂章。欢迎在GitHub 上关注我，⼀起⼊⻔和进阶前端。 以下是正⽂。 国庆节快乐，还在加班的童鞋，良⾠必有重谢！ 本⽂主要内容 头标签 排版标签： <p> <div> <span> <br> <hr> <center> <pre> 字体标记： <h1> <font> <b> <u> <sup> <sub> 超链接 图⽚标签 前⾔ web标准 web标准介绍： w3c ：万维⽹联盟组织，⽤来制定web标准的机构（组织） web标准：制作⽹⻚要遵循的规范。 web标准规范的分类：结构标准、表现标准、⾏为标准。 结构：html。表现：css。⾏为：JavaScript 。 web标准总结： 结构标准：相当于⼈的身体。html就是⽤来制作⽹⻚的。 表现标准：相当于⼈的⾐服。css就是对⽹⻚进⾏美化的。 ⾏为标准：相当于⼈的动作。JS 就是让⽹⻚动起来，具有⽣命⼒的。 浏览器介绍 浏览器是⽹⻚运⾏的平台，常⽤的浏览器有IE、⽕狐（Firefox）、⾕歌（Chrome）、猎豹浏览器、 Safari和Opera等。如下图所示： 浏览器内核： 浏览器 内核 IE trident chrome / 欧鹏 blink ⽕狐 gecko Safari webkit PS ：「浏览器内核」也就是浏览器所采⽤的「渲染引擎」，渲染引擎决定了浏览器如何显示⽹⻚的内 容以及⻚⾯的格式信息。渲染引擎是兼容性问题出现的根本原因。 Sublime Text 的使⽤ 详情请移步⾄：Sublime Text使⽤技巧 ⼀、HTML的介绍 ⼀、HTML的介绍 1、HTML的概述： html全称为HyperText Markup Language，译为超⽂本标记语⾔，不是⼀种编程语⾔，是⼀种描述 性的标记语⾔，⽤于描述超⽂本中内容的显示⽅式。⽐如字体什么颜⾊，⼤⼩等。 超⽂本：⾳频，视频，图⽚称为超⽂本。 标记 ：<英⽂单词或者字⺟>称为标记，⼀个HTML⻚⾯都是由各种标记组成。 作⽤：HTML是负责描述⽂档语义的语⾔。 注意：HTML语⾔不是⼀个编程语⾔(有编译过程) ，⽽是⼀个标记语⾔(没有编译过程) ，HTML⻚⾯直 接由浏览器解析执⾏。 HTML是负责描述⽂档语义的语⾔ html中，除了语义，其他什么都没有。 html是⼀个纯本⽂⽂件（就是⽤txt⽂件改名⽽成），⽤⼀些标签来描述⽂字的语义，这些标签在浏览 器⾥⾯是看不到的，所以称为“超⽂本” ，所以就是“超⽂本标记语⾔” 了。所以，接下来，我们肯定要 学习⼀堆html中的标签对⼉，这些标签对⼉能够给⽂本不同的语义。 ⽐如，⾯试的时候问你，h1标签有什么作⽤？ 正确答案：给⽂本增加主标题的语义。 错误答案：给⽂字加粗、加⿊、变⼤。 2、HTML的历史 我们专⻔来对XHTML做⼀个介绍。 XHTML介绍： XHTML ：Extensible Hypertext Markup Language，可扩展超⽂本标注语⾔。 XHTML的主要⽬的是为了取代HTML，也可以理解为HTML的升级版。 HTML的标记书写很不规范， 会造成其它的设备(ipad 、⼿机、电视等)⽆法正常显示。 XHTML与HTML4.0的标记基本上⼀样。 XHTML是严格的、纯净的HTML。 我们稍后将对XHTML的编写规范进⾏介绍。 3、HTML的⽹络术语 ⽹⻚ ：由各种标记组成的⼀个⻚⾯就叫⽹⻚。 主⻚(⾸⻚) : ⼀个⽹站的起始⻚⾯或者导航⻚⾯。 标记： <p> 称为开始标记 ，</p> 称为结束标记，也叫标签。每个标签都规定好了特殊的含 义。