第二章静态网页开发技术

来源：互联网发布：怎样加入淘宝全球购编辑：程序博客网时间：2024/06/05 18:23

2.1.2 HTML基本标记与使用

1、结构标签

头部：在<html>与</html>之间部分

<html>

<head>

<title>第一个HTML网页</title>

</head>

主体：在<body>与</body>之间部分

Hello,<b>world</b>!

你好！

</body>

</html>

2、文本域段落标记

<h#></h#>：标题标记，#=1，2,3,4,5,6，定义了6级标题，每级标题的字体大小依次递减。属性align设定对齐方式：center：居中；left：左对齐（默认）；right：右对齐。

<b></b>：黑体标记

<i></i>：斜体标记

<strong></strong>加重文体标记（通常是斜体加黑体）

<font></font>:字体标记：size属性，设置字体大小，取值1~7；color属性，设置字体颜色，使用名字常量或RGB的十六进制值，face属性，设计字体字形，例如“宋体”、“楷体”等。

<hr/>:水平分隔线标记：树形width设置线的长度（单位像素）,color设直线的粗细（单位像素），color设直线的颜色，align设置对齐方式。

<br/>:插入一个回车换行符。

注意：各标签可以嵌套，但不允许交叉。

3、列表标签

列表标签分为两类：有序标签和无序标签。

（1）有序列表标记：<ol></ol>。

格式：<ol type="序号类型”>

...........

</ol>

其中，属性type指定列表项前的项目标号的样式，其取值说明如下。

“1”：编号为阿拉伯数字（默认值）； “a”：小写英文字母 “A”：大写英文字母 “I”:大写罗马字母 “i”：小写罗马字母。

（2）无序列表标记：<ul></ul>

格式：<ul type="序号类型”>

...........

</ul>

其中，属性type指定列表项前的项目标号的样式，其取值有3种。disc：实心圆点（默认值）；circle：空心圆点；square:实心方块。

（3）元素列表：<li></li>

形成列表项，若在<ol></ol>之间，则每个列表项加上一个编号，若在<ul></ul>之间，则每个列表项加上一个规定的符号样式。

4、超链接标签

超链接是指从一个对象指向另一个对象的指针，它可以是网页中的一段文字或一张图片，以实现一个页面到另一页面的跳转。

格式：<a href="url">超链接名称或图片</a>

其中，属性href:指定链接的目标（另一个网页的路径）。

5、图片标记

格式：<img src="url" alt=""height=""width="">

其中，属性src：指定图像源的URL路径；alt：替代文本；height:图片的高度；width:图片的宽度。

6、定时刷新或跳转

（1）定时刷新基本语法；

该语句表示，页面每隔一秒刷新一次，其中属性content的值，代表间隔的时间。

（2）定时自动跳转，基本语法：

该语句表示，页面3秒后自动跳转到搜狐主页。

注意：上述标签一般放在head标签中。

7、表格

表格由行、列、单元格组成，可以很好地控制页面布局，固定文本或图像的输出，还可以任意进行背景和前景颜色的设置。

一个表格由<table>、<tr>、<td>、或<th>标记来定义的，分别表示表格、表格行、单元格。

（1）基本语法：

<table>

......

</table>

(2)表格属性（<table>属性）：

整个表格始于<table>而终于</table>,是一个容器标记。常用属性如下：

width:表格宽度 height:表格高度 aligh:表格水平对齐方式 border:表格边框厚度 cellpadding:边距 cellspacing：间距 bacolor:表格背景颜色 background:表格背景图像

（3）表格行的属性<tr>属性：

<tr>的属性用于设定表格中某一行的属性。常用属性如下：

aligh：单元格水平对齐方式

valigh:单元格中内容的垂直对齐方式：top：顶端对其； middle：中间对齐； bottom：底端对齐

bacolor:背景颜色

（4）<td>、<th>属性：

<td>的属性用于设定表格中某一单元格的属性；具体内容的容器，使用时要放在<tr>与</tr>之间。常用属性如下：

aligh：水平对齐方式 background:背景图像 colspan：跨行数目（横向合并）

height：高度 valign：垂直对齐方式 bacolor：背景颜色

rowspan：跨行数目（纵向合并） width：宽度

阅读全文

0 0