《【完整版-HTML代码简介说明-适合新手】》由会员分享，可在线阅读，更多相关《【完整版-HTML代码简介说明-适合新手】（43页珍藏版）》请在金锄头文库上搜索。
1、1.1HTMLHTML代码简介代码简介 HTML 开发 HTML 标记的格式组成：. . . HTML 标记用于标记 HTML 文档的开始和结束元素 - 标识标记属性 - 描述标记值 - 分配给属性的内容1.2HTMLHTML代码简介代码简介HTML 文档的结构 HTML 部分 文档头部分 正文部分欢迎进入 HTML 世界这会是一种很有趣的体验基本结构：运行结果1.3HTMLHTML代码简介代码简介 HTML头部信息(Head) HTML头部信息(head)里包含关于所在网页的 信息。头部信息(head)里的内容，主要是被浏 览器所用，不会显示在网页的正文内容里。 标题(title) 标题(t
2、itle)是最常用的head信息。它不显示在 HTML网页正文里，显示在浏览器窗口的标题 栏里。 示例代码如下： HTML中文教程头部信息 1.4HTMLHTML代码简介代码简介使用META标记 2-1 1.提供关于网页的信息 对网页的描述根据关键词生成响应 获得文档的作者名称2.应用：关键词生成响应Expires: Mon, 15 Sep 2003 14:25:27 GMT设置网页的到期值:响应 页面显示中文设置网页使用gb2312: 1.5HTMLHTML代码简介代码简介3.自动刷新页面4.使用网页所使用的编码应用：如网上实时新闻报道。应用：如在不同浏览器上正确显示中文。使用META标记
3、2-21.6HTMLHTML代码简介代码简介正文标题 HTML用到这几个Tag来定义 正文标题，从大到小。每个正文标题自 成一段。1.7HTMLHTML代码简介代码简介 这是1号标题 这是2号标题 这是3号标题 这是4号标题 这是5号标题 这是6号标题 1.8HTMLHTML代码简介代码简介 段落划分 在HTML里用和划分段落,可 以不成对出现。1.9HTMLHTML代码简介代码简介段落标记欢迎使用 HTML这会是一种很有趣的体验另一个段落元素1.10HTMLHTML代码简介代码简介 使用对齐属性修饰段落使用对齐属性修饰段落学习习HTML这这会是一种很有趣的体验验右对齐Left：左对齐 Cen
4、ter：居中 Right：右对齐1.11HTMLHTML代码简介代码简介使用对齐属性修饰标题 这是标题 上面的标题是居中显示的。 1.12HTMLHTML代码简介代码简介换行 通过使用这个Tag，可以在不新建 段落的情况下换行。没有Closing Tag。 用换行是个坏习惯，正确的是使用 ,即在行末加入。1.13HTMLHTML代码简介代码简介换行标记欢迎使用 HTML这会是一种很有趣的体验另一个段落元素1.14HTMLHTML代码简介代码简介HTML注释 在HTML文件里，你可以写代码注释，解 释说明你的代码，这样有助于你和他人 日后能够更好地理解你的代码。 注释可以写在之间。浏览器是忽 略
5、注释的，你不会在HTML正文中看到你 的注释。 1.15HTMLHTML代码简介代码简介 代码注释是不会显示在网页里的。 1.16HTMLHTML代码简介代码简介加入水平线 用这个Tag可以在HTML文件里加一 条横线 没有结束标签1.17HTMLHTML代码简介代码简介 村妇想像皇宫的生活：皇后得用金扁担挑水吧。 问：谁是世界上最可怜的人？答：炮兵连炊事班 战士！问：为什么？答：戴绿帽背黑锅看别人打炮。 1.18HTMLHTML代码简介代码简介 HTML利用超链接打开链接文件 HTML用来表示超链接 可以指向任何一个文件源：一个 HTML网页，一个图片，一个影视文件等 。用法如下： 链接的显
6、示文字 点击当中的内容，即可打开一 个链接文件，href属性则表示这个链接 文件的路径。1.19HTMLHTML代码简介代码简介 这是一个链接 新浪 站点链接 这是一个链接 新浪站点链接 1.22HTMLHTML代码简介代码简介 链接的title属性 使用 链接的title 属性，可以让鼠标悬停 在超链接上的时候，显示该超链接的文 字注释。1.23HTMLHTML代码简介代码简介 这是一个链接 新浪站点链接 1.24HTMLHTML代码简介代码简介 链接到email地址 在网站中，你经常会看到“联系我们”的 链接，一点击这个链接，就会触发你的 邮件客户端，比如Outlook Express，
7、然后显示一个新建mail的窗口。用可 以实现这样的功能。1.25HTMLHTML代码简介代码简介 这是一个链接 新浪站 点链接 联系新 浪 1.26HTMLHTML代码简介代码简介HTML相对路径(Relative Path)和绝对路径(Absolute Path) HTML有2种路径的写法：相对路径和绝对路径。 HTML相对路径(Relative Path) 同一个目录的文件引用 如果源文件和引用文件在同一个目录里，直接写引用文 件名即可。 这是一个链接 如何表示上级目录 ./表示源文件所在目录的上一级目录，././表示源文件 所在目录的上上级目录，以此类推。 如何表示下级目录 引用下级目录
8、的文件，直接写下级目录文件的路径即可 。1.27HTMLHTML代码简介代码简介 HTML绝对路径(Absolute Path) HTML绝对路径(absolute path)指带域 名的文件的完整路径。 新浪站点 链接1.28HTMLHTML代码简介代码简介HTML图片(Images) 用 这个 Tag 可以在HTML里面插 入图片。最基本的语法如下： url表示图片的路径和 文件名。比如 url 可以是 images/logo/blabla_logo01.gif，也可 以是个相对路径 “./images/logo/blabla_logo01.gif“。 1.29HTMLHTML代码简介代码
9、简介 图片： 1.30HTMLHTML代码简介代码简介 图片align属性 用align属性，可以改变水平对齐方式(居左、 居中、居右)。 用valign属性，可以改变图片的垂直(居上、 居中、居下)对齐方式图片的大小 在缺省状况下，图片显示原有的大小。你可 以用height和width属性改变图片的大小。不 过图片的大小一旦被改变，图片会相应放大 或缩小，显示出来的结果可能会很难看。1.31HTMLHTML代码简介代码简介 1.32HTMLHTML代码简介代码简介HTML背景颜色和背景图片 HTML的 有两个关于背景的属性， bgcolor属性 bgcolor属性用来设置HTML网页的背景颜
10、色 。 background属性 background属性用来设置HTML网页的背景 图片。background属性值就是背景图片的 路径和文件名，如果背景图片小于网页显示 窗口，那么这个背景图片会自动重复。1.33HTMLHTML代码简介代码简介 看，这个页面是黄色的。 1.34HTMLHTML代码简介代码简介 这个网页有背景图片哦！ 如果图片比页面小，图片会自动重复。 1.35HTMLHTML代码简介代码简介 HTML表格用表示。 一个表格可以分成很多行，用表示 ； 每行又可以分成很多单元格，用表 示。 这三个Tag是创建表格最常用的Tag。如何创建HTML表格1.36HTMLHTML代码
11、简介代码简介 html 123 45 6 789 1.37HTMLHTML代码简介代码简介 HTML常用文本格式 HTML定义了一些文本格式的Tag，比如 利用Tag，可以将字体变成粗体或者斜体 。从下面的示例，你可以了解各种文本 格式Tag如何改变HTML文本的显示。 常用文本格式Tag 粗体bold 斜体 下划线1.38HTMLHTML代码简介代码简介HTML字体(Fonts) 在HTML里，可以用font这个元素及其属性来设定字体 的大小，颜色和字体风格。 字体大小 用字体大小属性(size)来设定字体的大小。示例代码如 下： 这一段的字体大小的值是2。 字体风格 用face属性来设定字
12、体风格。示例代码如下： 这一段的字体风格是arial。 字体颜色 用颜色属性(color)来设定字体颜色。1.39HTMLHTML代码简介代码简介 字体大小 font size 这段文字的字体大小值为1。 这段文字的字体大小值为2。 这段文字的字体大小值为3。 这段文字的字体大小值为4。 1.40HTMLHTML代码简介代码简介 字体风格 font face 以下第一段用的是arial字体，第二段用的 是courier字体，第三段用的是verdana字体。 arial courier verdana arial courier verdana arial courier verdana 1.41HTMLHTML代码简介代码简介 字体颜色 font color 这段文字用的是缺省的字体颜色。 这段文字的字体 颜色为红色。 1.42HTMLHTML代码简介代码简介HTML表单(Forms) HTML表单(Form)是HTML的一个重要部 分，主要用于采集和提交用户输入的信 息。 举个简单的例子，一个让用户输入姓名 的HTML表单(Form)。示例代码如下：1.43HTMLHTML代码简介代码简介 输入用户姓名 请输入你的姓名：
