商务网页设计与制作 (20).pdf

《商务网页设计与制作 (20).pdf》由会员分享，可在线阅读，更多相关《商务网页设计与制作 (20).pdf（4页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、HTML（Hyper Text Markup Language），即超文本标记语言，是编写网页最主要、最基本的语言。HTML不是编程语言，而是一种用来告知浏览器如何组织页面的标记语言，主要通过元素对网页中的内容进行描述。使用HTML将所需要表达的信息按某种规则写成HTML文档，通过浏览器将其“翻译”成可以识别的网页。随着现代网络技术的发展，HTML标准也经历了多次更新，目前最新的版本是HTML5。丆HTML斍桩给枊丆HTML斍桩给枊下面是一个HTML文档的基本结构：商务网页设计与制作我的第一个网页?：声明文档类型，必须位于HTML文档的第一行。?：该元素是HTML文档的根元素。?：该元素是HT

2、ML文档的头部，在这里面定义了文档的各种属性和信息，包括文档的字符集声明、标题、描述和关键字、样式、脚本等等，这些内容不会在浏览器内显示。?：该元素设置文档使用utf-8字符集编码。?：该元素定义文档的标题，会在浏览器标题栏中显示。?：该元素中包含了文档的主体内容，即浏览者看到的内容。?：这是段落元素，里面定义了一个段落。该文档内容在浏览器的显示结果，可以看出HTML的主要工作就是描述网页的结构并对内容进行标记。互HTML斍仼咃吓为了便于管理和使用，在编写HTML文档时，文件命名必须遵循以下规则：1.文件名只可由英文字母、数字、连接符和下划线组成，建议统一使用小写。2.文件名中不能包含特殊符号

3、，如空格、$、&等。3.扩展名可以使用.htm或.html，二者没有区别，建议使用.html。丏HTML光紦箆仑丏HTML光紦箆仑HTML文档是由HTML元素定义的，HTML元素指的是从开始标签到结束标签的所有代码，主要组成部分如图3-2所示：1图3-2：HTML元素的组成1.开始标签（Opening tag）：包含元素的名称，被左、右角括号所包围，表示元素从这里开始或者开始起作用。HTML标签不区分大小写，但从一致性、可读性来说，最好使用小写。2.结束标签（Closing tag）：与开始标签相似，只是其在元素名之前包含了一个斜杠，表示着元素的结尾。3.内容（Content）：元素的内容。4

4、.元素（Element）：开始标签、结束标签与内容相结合，便是一个完整的元素。5.空元素（Empty elements）：不是所有元素都拥有开始标签、内容、结束标签。某些元素只有一个标签，例如（图像）、（换行符）、（水平分隔线）等，此类没有内容的HTML元素被称为空元素，空元素是在开始标签中关闭的。1HTML光紦嵒奝1HTML光紦嵒奝HTML元素可以互相嵌套包裹，即元素存在父子级关系。我的第一个网页这个示例中，需要确保元素被正确的嵌套：先打开元素，然后才打开元素，因此必须先将元素关闭，然后再去关闭元素，即所有的元素都需要正确的打开和关闭。2HTML層怭2HTML層怭HTML属性是为HTML元素

5、提供的附加信息，这些信息不会出现在实际的内容中，如图3-3所示。图3-3：HTML属性在上面的示例中，class属性给元素赋了一个可供识别的类名，之后就可以通过这个类名为其定义样式信息和其它信息。其规则如下：1.属性总是在HTML元素的开始标签中规定，建议使用小写。2.元素名与属性之间，以及每个属性之间用空格分开。3.属性名与属性值用等于号（=）连接。24.属性值应该始终被包括在引号（）内。3坝纭光紦咒衒冋光紦3坝纭光紦咒衒冋光紦在HTML中有两种重要的元素类别，即块级元素和行内元素。1.1.坝纭光紦坝纭光紦块级元素的宽度占据其父元素（容器）的整个水平空间，高度则等于其内容高度。通常浏览器会在

6、块级元素前后另起一个新行，可以在内嵌套块级元素和行内元素。2.2.衒冋光紦衒冋光紦行内元素的宽度和高度都由内容来决定，与其他行内元素可以共同位于同一行。行内元素内部也可以嵌套其他元素，但是不能是块级元素。4HTML诳乏匜4HTML诳乏匜语义是指对一个词或者句子含义的正确解释。HTML语义化则是指对文本内容的结构化（内容语义化），选择符合语义的元素（代码语义化），便于开发者阅读和维护的同时，让浏览器、搜索引擎、辅助技术等更好的解析内容。HTML的绝大部分元素都具有明确的语义，例如下面的示例：我的第一个 网页我的第一个 网页 这两段文字中，“网页”在浏览器的显示效果中都为斜体，但元素的作用是强调内

7、容，元素则是为了和普通文本进行区分。所以从本质上来讲，语义才是元素之间真正的区别，在使用元素时首先要考虑其语义是否符合描述的内容。5HTML桂引匜5HTML桂引匜在HTML文档中，所有连续的空白（空格、换行）在浏览器渲染时都会减少为一个单独的空格符。例如下面这两个列表元素，在浏览器的输出结果都是一样的。列表项目一列表项目二 列表项目一 列表项目二合理的使用空格缩进及换行，能够更清晰的表现元素的嵌套结构，增加了HTML文档的可读性，即代码的格式化。6HTML泮釐6HTML泮釐HTML注释是对相应的代码所做出的说明和备注。注释内容可以写在HTML文件的任意位置，是被浏览器忽略的，而且对用户不可见。对代码进行注释，有助于理解、查找或使他人了解你的代码，方便自己和他人对代码进行修改。其语法格式为，示例如下：3!-这是一个多行注释 可以注释HTML元素-4