ACCP学习旅程之----- 使用HTML语言开发商业站点(第一章 HTML的基本标签)

在这里记录HTML中的所有单标签：<META>
                                 <P>…</P>可选
                                 <BR>
                                 <IMG>
                                 <HR>
                                 <LI>…</LI>可选
                                 <INPUT>
                                 <FRAME>
                                 <LINK>

在HTML文本中显示空格的三种方式：
1。字符实体：  
2。预格式标签：<PRE>空格<PRE>
3。全角字符：在全角字符状态下按空格键，键入。

1￥ HTML文件的基本结构

完整的HTML文件至少包括：

<HTML>标签、
      <HEAD>标签、
      <TITLE>标签
      和<BODY>标签

这些标签成对出现，开头标签为<>，结束标签为</>

1） HTML文档的结构

1$ HTML部分：（整个网页文件的最外侧标签）

作用：告诉浏览器，这两个标签中间的内容是HTML文件。

2$ 头部：

以<HEAD>标签开始，以</HEAD>标签结束。

如： <HEAD>
<TITLE>……</TITLE> 标识网页的标题
</HEAD>

作用：包含显示在网页标题栏中的标题和其他在网页中不显示的
信息。

3$ 主体部分：

包含在网页中显示的文本、图像和链接。

以<BODY>标签开始，以</BODY>标签结束

另外：标签不区分大小写，<html>等效于<HTML>

2）使用记事本创建网页

1$ 创建一个HTML文档，需要两个工具：

一个文本编辑器（如记事本等）
一个用于查看HTML文档效果的Web浏览器

2$ 保存一个HTML文档

需将编辑好的HTML文档，在保存对话框中选择保存类型中选中“所有文件”

在编码下拉列表框中选择“ANSI”选项

3）<META>标签（在HEAD中）

<META>标签出现在网页的标题部分，提供有关网页的信息。

使用<<META>标签中的charset属性设置网页的编码语系

如： charset=gb2312 简体中文网页
charset=big5 繁体中文网页
charset=iso-8859-1 或不设置纯英文网页

4）页面背景色或背景图像（若果是设置整个网页背景，则在BODY中）

如：<BODY bgcolor=”ffccff” ></BODY> 设置页面背景颜色

又如：<BODY background=”back_p_w_picpath.gif”> 设置页面背景图像

另外：为了使页面美观大方，整个页面背景一般尽量浅。

2￥文本相关标签

1$ 字体、字号相关标签

1．。标题标签

HTML提供了六级标题，<H1>为最大，<H6>为最小。

如： <H1>一级标题</H1>

2．。字体标签

<FONT>标签用于控制网页上的文本的显示外观，如：文字大小、字体类型和颜色等属性。

如：<FONT size=”+2” color=”red” face=”隶书”></FONT>

说明：1。在font中字体大小用size, 默认为3，范围为1~7；
也可以默认为基准，使用加减号控制大小。

如上例：“+2”即在默认基础上加大2个单位。

2。在font中颜色用color控制，颜色值可16进制数表示。

3。在font中，字体类型使用face

4。所有属性名用等号连接属性值。

3．。特殊符号（字符实体）

某些字符在HTML中有特殊意义，如：<, >, 空格, 等。
在浏览器中显示这些字符，就必须使用HTML中的字符实体

字符实体有3部分组成：&号、实体名、分号；

注意：字符实体各字符之间不能有空格
转义码必须以分号；结束
单独的&不是转义的开始

空格：  
    >   ： >
    <   ： <
    “”   ： "
    版权符号：©

2$ 行的控制标签

1．。段落标签<P>

段落标记<P>用于标记段落的开始，段落的结束标记</P>为可选。
如没有</P>标签，则下一个<P>开始自动开始一个新段落。

可以通过段落的align属性，设置段落的对齐方式。

2．。强制换行标签<BR> (单标签，略)

3￥图像标签
1）常见的图片格式（暂略）

4种： jpg gif swf bmp

1$ JPG

是联合图像专家组文件格式(Joint Photographic Expert Group)的缩写

2）图像的基本语法

<IMG>标签用于在HTML文档中插入图像，使用src属性制定图像文件所在的路径。

如：<IMG src=”p_w_picpaths\adv_2.jpg” width=”300” height=”150” alt=”图像”>

说明：
1。 alt属性有两个作用
      如果图像没有被下载，在图像位置出现的提示文字；
      如果图像正常下载完成，将鼠标放在该图像上，在鼠标旁边出现的
      提示文字。

3）图像与文本的对齐

1$ IMG标签的align属性

<IMG>标签的align属性用于调整图像相对于周围文本的对齐方式。
在<IMG>中align可以取：top bottom middle left right
默认为bottom。

注意：所被设置的文档应紧跟<IMG>标签

如：<IMG align=”middle” src=”p_w_picpaths\adv_2.jpg” width=”180”
height=”95” border=”0”>请单击进入广告区

2$ IMG标签的hspace属性

<IMG>标签的hspace属性，用于设置图像周围文本与图像之间间距

如：<IMG align=”middle” src=”p_w_picpaths\adv_2.jpg” hspace=”30”>
     <OL type=”disc”> /*列表行图标为disc”
       <LI>广告文本1</LI>
       <LI>广告文本2</LI>
     </OL>

说明：上例如没有hspace的设置，则无法显示出列表行图标。

4￥文字布局

1）使用内容分隔<HR>标签

<HR>（水平线）标签用于在页面上绘制水平线，只有开始标签，没有结束标签。

在<HR>中可以使用align，默认为center（还有left\right）

如： <HR size=”5” color=”red” width=”300”>

说明：
1。size属性用于设置水平线的高度（粗细），以像素为单位
2。width用于设置水平线的长度，像素或%均可
3。水平线的位置用align设置，上例中没写，则去默认值center
4。还有一个属性为 noshade 意为没有阴影

另外：

制作垂直线：把水平线长度(width)设置为1
水平线粗细size设置为很大，即可。

如：<IMG size=”300” color=”red” width=”1”>

2）如何使用文字列表

在HTML文档中包含两种文字列表：有序列表/无序列表

1$ 无序列表

无序列表就是“项目列表”。包含在<UL>…</UL>标签中

列表中的每一项都用列表标签<LI>表示，列表标签结束</LI>为可选

如：<UL type=”circle”>
      <LI>如何激活会员名？<./LI>
      <LI>如何注册会员名？</LI>
     </UL>

说明：
1。<UL>中的type属性决定列表项开始的符号，可以取值得范围：
       默认：disc 实心圆点
       circle 空心圆环
       square 空心正方形

2$ 有序列表

有序列表包含<OL>…</OL>标签中，列表项以自动生成的顺序显示。

如： <OL type=”1”>
       <LI>填写信息</LI>
       <LI>收电子邮件</LI>
     </OL>

说明：
1。Type属性决定有序列表的序号类型，可取范围：
       1：阿拉伯数字序列
       a：小写英文字母序列
       A：大写英文字母序列
       i：小写罗马数字序列
       I：大写罗马数字序列

3）如何使用预格式文本<PRE>标签（即格式化输出，略）

<PRE>… </PRE>标签用于
显示预先在HTML代码中已经定义好格式的文本

5￥页面链接<A>标签

<A>标签用于创建超级链接，是到另一个文档或文件（图形、音频、视频）甚至到同一文档的另一部分的链接。

单击超级链接时，就会进入链接中指定的URL（href=””）

要创建超级链接，应指定以下两个组件：

1。要链接文件的完整地址(href=””)
      2。将提供链接的热点
             热点可以是文本行，也可以是图像
             单击热点时，浏览器将读取URL中指定的地址并跳转到新位置

1）链接到其他页面（注意绝对路径和相对路径）

如： <A href=”register\register.html”>[免费注册]</A>

说明：
1。“href”参数可提供链接到其他目录中的文件

2）链接到本页面
1$ 设置锚记（页面中链接的目标位置）

页面的内容太多，为了方便用户，可以使用锚点链接。

<A>标签的name属性用于在文本中创建链接要搜寻的锚记。

如： <A name=”market”>主题名称</A>
//定义一个名为market的锚记，即<A>超链接将搜索的名字。

2$ 给超链接设置页面中的跳转位置

为了达到跳转的效果，超链接所在位置的href中应标记同名文件源,而且，必须带有“#”

如： <A href=”#market”>主题名称</A>

3）电子邮件链接

用户可从网页发送电子邮件，可在链接标签中插入mailto:邮箱地址

如： <A href=“mailto:taobaoWebMater@taobao.com”>站长信箱</A>

6￥滚动<MARQUEE>标签

使用<MARQUEE>标签不仅可以移动文字，还可以移动图片。

如：
<MARQUEE scrolldelay=”100” direction=”up” οnmοuseοver=”this.stop()”
                    οnmοuseοut=”this.start()”>
            滚动的文字或图像
      </MARQUEE>

说明：
1。scrolldelay：表示滚动延迟时间，默认值为90毫秒
2。direction：表示文字或图像的滚动方向，默认为从右向左
3。滚动方向可以取4个值：
up down left right
4。
设置鼠标在滚动区域和移出滚动区域时的动作

this.stop() 停止滚动
this.start() 开始滚动

转载于:https://blog.51cto.com/rzmars/804095

ACCP学习旅程之----- 使用HTML语言开发商业站点(第一章 HTML的基本标签)相关推荐

使用HTML语言和CSS开发商业站点_HTML基础
使用HTML语言和CSS开发商业站点第一章 HTML基础 WEB页面呈现信息已成为各种信息共享和发布的主要形式超文本标记语言(Hyper Text Markup Lanuage,HTML)或超文本 ...
accp使用html语言,Accp6.0_S1.使用HTML语言和CSS开发商业站点
课程"Accp6.0_S1.使用HTML语言和CSS开发商业站点"题库试题汇编 [001]以下()是HTML常用的块状标签 (选择一项) A) B) C) D) [002]以下( ...
学习虫师的《web接口开发与自动化测试1-5章》
有时候越来越觉得以前写的博客是流水帐,看到有些人说他会为了一个博客文章可能会准备好几天,唉,很多时候就可能是别人的态度更好吧,每个细节差一点别人就成为了大牛. 然后看了这本书的前五章,是让你写一个来 ...
c语言程序第一章编程,c语言程序的设计第一章 C语言编程入门.ppt
c语言程序的设计第一章 C语言编程入门第1章 C语言编程入门本章是本书的入门篇,专为初学者熟悉编程过程.掌握程序结构而准备的. 本章学习目标 ? 1)? 能够通过模仿与改变来构造带有测试函数的C语 ...
Android项目驱动式开发教程第2版,《Android项目驱动式开发教程》第一章开发入门.ppt...
<Android项目驱动式开发教程>第一章开发入门 1.4 项目框架分析 4 android:versionName="1.0" > 5 8 第9行代码andro ...
scratch3.0 二次开发-基本介绍(第一章)
scratch3.0系列章节列表 scratch3.0 二次开发-基本介绍(第一章) scratch3.0二次开发运行scratch-gui项目并了解工程结构(第二章) scratch3.0二次自定义 ...
html css 开发商业站点,《使用HTML语言和CSS开发商业站点》
其中包含了html文本语言的全部单词第一学期英语单词--<使用HTML语言和CSS开发商业站点> chapter1 head [hed]头 title ['taitl] 标题 body ...
题库明细使用HTML+CSS开发商业站点
题库明细使用HTML+CSS开发商业站点 HTML5基础列表.表格与媒体元素表单初识CSS3 CSS3美化网页元素盒子模型浮动定位网页元素利用CSS3制作网页动画
c语言基础题库·第一章
c语言基础题库·第一章第1章一.填空题下列是合法的用户标识符的是( A ). A)_w1 B)3_xy C)int D)LINE-3 2．一个C语言程序是由( B ). A)一个主程序和若干子程 ...

ACCP学习旅程之----- 使用HTML语言开发商业站点(第一章 HTML的基本标签)

ACCP学习旅程之----- 使用HTML语言开发商业站点(第一章 HTML的基本标签)相关推荐

最新文章

热门文章