网页设计HTML的规则代码教程很实用.docx

资源描述

网页设计HTML的规则代码教程很实用.docx

《网页设计HTML的规则代码教程很实用.docx》由会员分享，可在线阅读，更多相关《网页设计HTML的规则代码教程很实用.docx（63页珍藏版）》请在冰豆网上搜索。

网页设计HTML的规则代码教程很实用.docx

网页设计HTML的规则代码教程很实用

一、HTML的简单规则

1、HTML的构成要素

要素以段落式形成内容。

要素则由标签表现。

开始标签

结束标签

要素（如要素名为H1，要素内容为“给网页插上CSS的翅膀“）

属性值

2、HTML的基本结构

标签

1、使用“head”标签设定网页

1）给文本注标题

制作好的标题

稍微长一点没关系，关键是要写入供搜索的内容

简练的标题

能准确传达网站特性的内容

公司名或商标名

用中文表示主页名

2）掌握神奇的标签

标签是用来对文本自身进行说明的，也就是承载了文本由什么内容组成、关键词是什么、文本由谁制作、何时制作等信息。

最好将这些基本信息写入标签中，这样可以最大限度地被搜索引擎关注从而增加访问量，也可以确实地向他人告知基本信息。

提供建立网站的相关信息

可使网站被搜索引擎关注

设定在万维网上便于出现的中文

网页文本地址变更时可及时转换画面效果。

例如：

标签可使访问者增加

例如：

利用METATag

这是使我的主页能被搜索引擎察看的METATag，它虽然很难，也可以轻松搞定~

注意不要泄露信息

将下列源代码插入〈head〉〈/head〉中

网络文本的地址变更时自动更新

更新选项指的是过了时间后会自动跳转至其他网页或者多媒体文件的命令选项，在内容（CONTENT）属性中时间（单位：

秒），那么如果过了指定时间就会自动转向预定的地址。

例如：

//www.SOHU.COM”>

设定与制作者相关的信息

文件名称

制作日期

制作人员

关键词

2、使用标签设定页面

1）设定文本的背景色

或BGCOLOR=“颜色名”>

例如：

设定背景色

背景色变成黄色了~

2）设定文本的背景图片

例如：

把我的网页背景装点得像Windows桌面一样

插入背景图片

3）设定字体的基本颜色和链接色

TEXT=“#颜色”：

决定了正文全部文字的颜色。

LINK=”#颜色”：

超链接中使用的颜色，同时也适用于未曾访问过的链接颜色。

默认值为蓝色。

ALINK=”#颜色”：

适用于用鼠标单击超链接时的颜色。

默认值为红色。

vlink=”#颜色”：

适用于已访问过的链接颜色。

例如设置链接文字的颜色：

设定链接文字的颜色

至DAUM~

我参照颜色表用16进数设定颜色，单击已链接部分.

3）设置文本上端和左侧空白

例如：

设定上端和左侧的空白

**网页的上端和左侧的空白均设定为150pixel.

**运行画面中可以确认吧？

3、运用标签进行分段和对齐

1）换行时使用的标签

例如：

试试换行

******************************************************

有一些人教会我怎么去爱.

有一些人教会我怎么去思念.

有一些人教会我情为何物.

因此我不再寂寞.

某一天，当我渴望感情!

突然地..

某一天，当我失去微笑!

突然地..

请安抚我渴望的心灵.
/

而且懂得了爱情.

******************************************************

2）划分大段落时使用的标签

标签

是用来分段的，相当于两次换行。

具有对齐属性：

LEFTCENTERRIGHT

标签连续使用与单个使用所取得的效果是相同的。

不同。

例如：

划分段落

即便爱他甚于爱我自己

可我太过害羞而不敢说出口.

即便因为爱彻夜未眠

可我也会因为那爱的泪水而感到满足.

我虽然渺小，可希望他能成为栋梁

我即便死去，也要他健康存活.

祝他幸福

这就是暗恋，远远望着终不敢靠近.

抵不过暗恋之痛，终于苦求

希望这是我最后的爱.

耗尽心血的爱一定要这样的

只求前路上忍住泪水，互相祝福.

3）分段时使用的标签

标签不在上下方各空一行

例如：

划分段落

即便爱他甚于爱我自己

可我太过害羞而不敢说出口.

即便因为爱彻夜未眠

可我也会因为那爱的泪水而感到满足.

我虽然渺小，可希望他能成为栋梁

我即便死去，也要他健康存活.

祝他幸福

这就是暗恋，远远望着终不敢靠近.

抵不过暗恋之痛，终于苦求

希望这是我最后的爱.

耗尽心血的爱一定要这样的

只求前路上忍住泪水，互相祝福.

4）画线时使用的标签

例如：

画各式的线

hr的基本形态.

设定横长.

通过百分率设定横长，百分率指得是与与浏览器窗口的横宽进行对比的百分率.

窗口大小不同，长度也不同.

第二条的pixel单位是绝对数值，它与窗口大小无关，是固定长度值.

调整厚度，用各种数值试试.

现在制做平面性横线.

要在平面性横线中加色，采用如同color=“pink”的方式即可.

第三条的厚度高为20.

设定横线为左对齐，对齐属性为ALIGN.

居中对齐的横线.

右对齐的横线.

5）居中时使用的标签

使用

标签可以使网页画面中的文本和图片居中排列。

例如：

（11）

居中对齐

玫瑰家族Tag教室

6）引用文章时使用的标签

这是摘取文章、网站内容或引用他人原话时使用的标签。

使用该标签会自动插入所引用的句子，但不能调节插入的间隔。

例如：

引用文章

介绍禹柳松的歌词^^

++++++++++++++++++++++++++++++++++++++++++++++++++
+可乐，讨厌讨厌
+红茶，讨厌讨厌
+浓咖啡ohno
+热巧克力，讨厌讨厌
+汽水，讨厌讨厌
+白牛奶喜欢喜欢
+味道好，颜色好，营养足
/
+最适合我简单的口味
+有蛋白质，维生素
+最适合我健康的口味
+牛奶喜欢牛奶喜欢给我牛奶（再多给点）
+牛奶喜欢牛奶喜欢世上最喜欢
+要是没有牛奶，想都不敢想.
+最喜欢牛奶，给我牛奶
+milkmilkoh牛奶
+学习来一杯运动来一杯
+总在我身边的牛奶
+我喜欢喝奶瓶中的牛奶
+新鲜的牛奶才是牛奶
+喝了牛奶长得快
+成为国家的新一代.

+牛奶喜欢牛奶喜欢给我牛奶（再多给点）
+牛奶喜欢牛奶喜欢世上最喜欢
+牛奶喜欢牛奶喜欢给我牛奶（再多给点）
+牛奶喜欢牛奶喜欢世上最喜欢
+世上最喜欢
++++++++++++++++++++++++++++++++++++++++++++++++++

6）生成空格时使用的“ ；”

例如：

空格时使用的Tag

白牛奶喜欢喜欢^^

可乐，讨厌讨厌

红茶，讨厌讨厌

浓咖啡ohno

热巧克力，讨厌讨厌

汽水，讨厌讨厌

白牛奶喜欢喜欢

7）原封不动显示输入内容的标签

使用本标签可以将HTML源代码中的文本样式原封不动地显示在网页上。

即便中间没有
标签或

标签也可以维持换行和句子间的间距。

例如：

克隆文章

可自由设定文字位置的Tag

.*"'"*.!

.*"'"*.

''"*."...".*"''

.*'.*":

"*.'*.

也可以这么用

跟屁虫2

等一下，就等一下！

我是世上最可怕的跟屁虫

和你一起即便变成孤家寡人也还要跟着你

就算你再讨厌我，我也要跟着你...

也可以这么用.^^

与

标签具有相似属性的一些标签。

……

能显示不同的字体，它忽视内部的标签，只读取TAB和换行。

改变文本

设定文字大小、颜色和模样

1）

字体标签可以设定为1-7.1最小，7最大，默认值是3。

例如：

试着设定不同大小的文字?</p><p>

文字大小1

文字大小2

文字大小3

文字大小4

文字大小5

文字大小6

文字大小7

文字大小-2

文字大小+4

设定文字基本大小的标签

文本中如果没有使用标签，那么标签设定的内容将应用于该文本中。

例如：

设定文字的基本大小

一般情况下，BASEFONTTag用于BODYTag中，

可以对文本中所有的文字进行设定.

可是如果在使用BASEFONTTag的句子中

通过设定〈FONTCOLOR=“red”SIZE=“5”〉来改变部分文字

只需要将FONTTag插入其中即可.

容易吧~

2）〈FONTCOLOR=“字体颜色”>

3）

4）

2、设置标题文字的大小、颜色和对齐方式

……

例如：

设定标题文字的大小、颜色和对齐方式

欢迎!

欢迎您访问我们的玫瑰教室的Tag教室~

希望您能通过学习成为Tag高手~

3、制作四处运动的文字。

……

基本属性：

HEIGHT，WIDTH设定文字运动的幅度和跨度

BGCOLOR设定文字途经区域的背景色。

BEHAVIOR=“alternate”文字反复左右运动

BEHAVIOR=“scroll”文字从右到左连续旋转

BEHAVIOR=“slide”文字从右到左翻转后停止

DIRECTION设定文字的运动方向（左，右，上，下）

LOOP循环次数（默认值为无限次）。

例如LOOP=3，即运行3次。

SCROLLAMOUNT设定运动跨度（数值越大越快）

SCROLLDELAY设定延迟时间（数值越大越慢）

例如：

**MARQUEETag**

ㄧ

玫瑰家族Tag教室

ㄨ

玫瑰家族成员，我爱你⒔

ㄩ

玫瑰家族成员，我爱你⒔

__@/``慢慢移动.

..卡嗒.........卡嗒.....（Ξ紊Α.-）Π

~m（'.'）m~在宽为100的限制内，向上运动.

~m（..）m~在宽为100的限制内，向下运动.

盐娃娃

如同为了想知道大海有多深
而跑进大海的
盐娃娃一样，
我为了想知道你的心灵

毅然地投进了你，
慢慢地融化
悄无声息

美化文字的标签

许多与文字相关的标签其功能颇为相似，如……和……标签，功能都是使文字加粗，在网页上的使用效果基本相同，这些标签可以分为区别字形的物理标签形式和区分内容的逻辑标签形式。

1）物理标签

物理标签指的是设定文字自身属性的标签。

类型

标签

说明

粗体字

文字

……

使文字加粗

斜体字

文字

…

使

展开阅读全文