HTML5网页设计
第一章 HTML5基础
HTML5被视为互联网发展的核心技术,在其版本编号中"5"也代表这一技术的重要升级。相较于上一代版本,在HTML5中网络显示效果得到了显著提升,并新增了本地数据库等 Web 应用所需的功能支持。这些改进使得网络展示更加直观、功能更加全面。
一、HTML的基本概念
HTML是一种基于解释执行的语言标记系统,在互联网中被广泛作为编写网页的核心用途。互联网上的万维网体系经过发展成为一种具有全球性、交互性、多平台以及分布式信息资源网络体系,并基于HTML语言进行构建与运作。基于HTML语言开发的系统采用超文本标记语言来描述文件内容;这里的描述方法指的是这种包含链接关系与多媒体对象展示形式的信息展示方式。
二、网页
HTML语言是一种主要开发工具,在文件类型名如".html"或".htm"的情况下构建网络资源。被访问者访问的平台工具必须能够解读并展示这些页面内容。为了实现信息传递的目的,在线环境中的页面需要包含文字、图片、视频等多种媒体元素的集成,并且能够承载和传播丰富的内容。作为网络空间中不可或缺的部分,每个网站都必须依靠高质量的页面来支撑其功能。
三、网页开发工具
1、手工直接编写
考虑到HTML语言编写的文件是遵循美国信息交换标准代码(ascll)设计的标准单字节编码格式。因此,在开发过程中通常会采用任意功能强大的文本编辑器来操作和生成HTML文件。例如,在Windows操作系统中,默认配置通常会配备像记事本这样的基础工具。
2、使用可视化软件
微软公司的FrontPage、Adobe公司的DreamWeaver和Golive等企业均支持通过图形化界面实现网页的设计与编辑。
四、HTML5标签
HTML5文档由文本内容与标记元素共同构成。通常情况下,默认的字体样式为普通样式(default style),即字体大小为16px(公分)、字体宽度为8px、基线对齐方式为居中对齐(centered alignment)、行间距为1.5倍行距(1.5 line spacing)以及标准的制表位设置(standard tab stops)。
语法:
**
doctype:用于说明使用的HTML是什么版本。doctype声明必须放在每一个HTML5文档最顶部,在所有标签之上。
在任何一个XML文档中,默认情况下首位出现的HTML标记被定义为 ,该标记用于标识文件的开头与结尾。
将HTML文档划分为标题部分与内容区域,并通过标题部分,则可确定该文档的名称以及相关属性信息。其中的内容区域则是在Web浏览器窗口顶端显示的部分。
meta:在所有的HTML5文档中都应指定它们所使用的字符编码方案,并一般采用UTF-8或GB2312(适用于简体中文)作为编码标准来表示文本内容。
** **
< meta charset="utf-8">
< /html>
title:表示html5文档的标签。
body:包含了所有文档的主体内容,这些内容被浏览器显示在屏幕上。
注意:通常大部分标签以成对的形式存在;然而也有一些是以单独形式存在的;这些特殊的情况称为空标签。
语法:
**
< h1>、****< h2>、、
、
、
,是标题标签,其中h1标题标签的重要性最高,h6最低。由h1至h6逐渐减小。
标题文字的对齐方式:
align="对齐方式"
left 左对齐
center 中央对齐
right 右对齐
< p>:以段落的方式组织内容,并可以为文字、图片、表格等之间留一个空白行。
在无需另起一段的情形下,**< br>**的作用是使得文字、图片及表格等内容直接跳转至下一行。
< hr>:添加水平线
设置水平线的宽度、高度和颜色
< hr width="水平线宽度"height="水平线高度"color="颜色代码"/>
去掉水平线阴影
通常情况下,在默认配置下水平线条会呈现出一种空心并带有阴影效果的状态;通过设置noshade参数来取消该线条上的阴影效果。
< hr noshade="noshade"/>
< b>和:以****粗体显示的文字
插入图片的语法:
是一张具有指定参数的图片. 其中包含图像的位置对齐方式 边框宽度 图片的宽度以及高度等详细信息.
超链接的语法:
** <a 属性 = "属性值">连接显示文本**
| 属性 | 说明 | 默认值 |
|---|---|---|
| href | 链接的目标URL | - |
| target | 在何处打开目标URL。仅在href属性存在时使用 | 默认—self |
"../"访问源文件所在目录的上一级目录
