细说HTML标签.docx
- 文档编号:5096945
- 上传时间:2022-12-13
- 格式:DOCX
- 页数:45
- 大小:77.90KB
细说HTML标签.docx
《细说HTML标签.docx》由会员分享,可在线阅读,更多相关《细说HTML标签.docx(45页珍藏版)》请在冰豆网上搜索。
细说HTML标签
当中vs2005或者vs2008编写程序使用向导添加成员变量是会出现如下错误:
X:
/ProgramFiles/MicrosoftVisualStudio9.0/VC/VCWizards/CodeWiz/MFC/Variable/HTML/2052/default.htm
file:
///D:
/ProgramFiles/MicrosoftVisualStudio9.0/VC/VCWizards/CodeWiz/MFC/Variable/HTML/2052/default.htm
解决办法:
(自己使用的方法)
打开注册表编辑器
选择“HKEY_CURRENT_USER/Software/Microsoft/Windows/CurrentVersion/Internet
Settings/Zones“ (如果该项中没有名为1000的项,则建一个key名为1000)
在1000中建一个DWORD属性如下:
Name=1207
Type=REG_DWORD
Data=0x000000
根据错误信息,首先怀疑是ie的问题了,在ie中尝试打开该文件,同样出错,想到最近安装了ie8,呵呵,可能是微软自己的产品打架了。
网上找了一下,已经有不少vs2005开发人员发现了这个问题,同样也给出了不少的解决方法,比较权威比较安全的是一个msdn博客上发布的一个方法,原文描方法如下:
Pleasefollowthefollowingsteps:
-Openregedit(ona64-bitOS,openthe32-bitregedit)
-Under“HKEY_CURRENT_USER\Software\Microsoft\Windows\CurrentVersion\Internet
Settings\Zones”,createanewkeycalled1000(ifitisn'talreadythere)
-Under1000,createaDWORDentrywith:
oName=1207
oType=REG_DWORD
oData=0x000000
方法比较简单,就是打开注册表编辑器,找到“HKEY_CURRENT_USER\Software\Microsoft\Windows\CurrentVersion\Internet
Settings\Zones”,在这个项下面新增一个名字为1000的子项,并且在新增的1000项里添加一个名称为1207的DWORD键,值为0。
然后关闭重新打开vs2005,问题解决。
需要的朋友也可以将下面的这段文本复制并保存成一个后缀reg的文本文件,双击执行添加到注册表即可,
WindowsRegistryEditorVersion5.00
[HKEY_CURRENT_USER\Software\Microsoft\Windows\CurrentVersion\InternetSettings\Zones\1000]
"1207"=dword:
00000000
细说HTML标签
■ 细说HTML标签
在HTML语法中,大致上可以分为:
1.网页架构:
主要网页主架构的介绍
2.分隔标签:
也就是所谓的水平线
3.排版标签:
针对标签的属性,可做适当的版面编排
4.字体标签:
教导您设定文字的字体。
5.文字标签:
教导您设定文字的颜色、行距、变化.....等等。
6.影像标签:
教导您如何在网页中,植入图像。
7.背景标签:
教导您如何设定背景颜色或是背景图像。
8.链接标签:
教导您如何设定超链接,以及开视窗的条件。
9.表格标签:
教导您如何在网页中运用表格。
10.序列标签:
教导您如何设定文字序列或图形序列。
11.表单标签:
教导您如何制作可填写用的表单。
12.框架标签:
可让同一个视窗由多个网页一起组成。
13.其他技巧:
让您的整个网页背景可以让您设定为图片或是声音。
4.1 网页架构 <回细说索引>
BODY之间则为主要语法所在,也是网页的主要呈现部分。
【标签解说】
以上看到的就是一篇最简单架构的网页。
没错,网页其实就是一堆标签(所谓标签就是指被<>包起来的语法)集合起来的,透过浏览器的消化整理,就便成了美仑美奂的网页了。
简单而言,通常一份完整的网页包含了二个部份:
抬头(HEAD)、文件本体(BODY)。
也就是各位在上面所看到的
以及。在抬头的部份
中,有另一组标签打在
您可能会发现,为什么我一直没提到这一组标签,嗯!
因为它可有可无。
这一组标签是告诉浏览器说:
我是一份HTML文件喔!
也就是说它是一个网页的格式啦!
通常都包在网页的最上下两端,将所有的原始码都包起来。
4.2 分隔标签 <回细说索引>
【文字上的分隔标签】
或许你已经发现这个问题了:
天啊!
我不是在记事本里排版排得很漂亮,为何透过浏览器看起来一切都走了样?
对啊!
别太讶异,在网页的编排里,并不像汉书或WORD一样,只要拼命按Enter键或空白键,便能完成分段或分行,因为,HTML语言是不认识我们所谓的Enter键或空白键,所以不管您按了多少次的空白或Enter,浏览器都会当作没看见啦!
14.使用方法:
强制断行标签
、强制分段标签
15.标签解说:
我们在写文章时,有时候在特定的地方会强迫断行(
),或是在写完某一段的时候便会分段(
),写网页也一样,而且更需要断行及分段的功能,以免整个网页看起来乱糟糟的。
16.使用范例:
原始码
呈现结果
这是一个断行的范例
看出来了吗?
这是一个断行的范例
看出来了吗?
这是一个分段的范例
基本上他会比断行还多空出一行
这是一个分段的范例
基本上分段会比断行还多空出一行
【分隔线标签】
17.使用方法:
上一段文字内容
下一段文字内容
18.标签解说:
利用
这个标签便可产生一条横分隔线。
另外,其有些属性分别说明如下:
19.使用范例:
一般用法
尚未加任何属性。
原始码
普通分隔线
呈现结果
普通分隔线
颜色属性
用法:
原始码
橘色分隔线
呈现结果
橘色分隔线
宽度属性
用法:
原始码
宽度为240px的分隔线
呈现结果
宽度为240px分隔线
厚度属性
用法:
原始码
厚度为5的分隔线
呈现结果
厚度为5分隔线
位置属性
用法:
原始码
靠右的分隔线
呈现结果
靠右的分隔线
阴影属性
用法:
原始码
实心分隔线(无阴影)
呈现结果
实心分隔线(无阴影)
4.3 排版标签 <回细说索引>
【文字置左、置中、置右】
20.使用方法:
老实说,刚刚我们学过的分段标签
再加上一些简单的属性设定,就可以让其整个文字段落置左、置中或置右了,就如下表所示:
原始码
呈现结果
文字靠左
文字置中
文字靠右
标签解说:
嗯!
秘诀就在于“align=对齐位置”而已啦!
align是分段标签
的属性之一,这个属性将来会常常在不同标签中看到,它的功能是专门在设定“水平对齐位置”,其常见的设定值有三个,也就是置左(align="left")、置中(align="center")、置右(align="right")。
【置中标签】
21.使用方法:
22.标签解说:
这个标签是最常用到的标签了,除了文字,对于图片、表格,任何可以显现在网页上的东西都可以置中喔!
23.使用范例:
原始码
呈现结果
这是最中间
【向右缩排标签】
24.使用方法:
要缩排的文字
25.标签解说:
利用
这个标签可以将其包起来的文字,全部往右缩排。而且加一组标签,往右缩排一单位,加两组标签,往右缩排两单位,依此类推。
26.使用范例:
原始码
呈现结果
缩排1单位
缩排1单位
缩排2单位
缩排2单位
【保存原始格式标签】强烈推荐!
27.使用方法:
文字内容28.标签解说:
利用
这个标签可以将其包起来的文字排版、格式,原封不动的呈现出来。算是相当好用的标签之一。
29.使用范例:
原始码
呈现结果
文 字
格 式
文 字
格 式
4.4 字体标签 <回细说索引>
【标题标签】
30.使用方法:
标题内容
31.标签解说:
标题的大小一共有六种,两个标签一组,也就是从
到
,
最大,
最小。
使用标题标签时,该标签会将字体变成粗体字,并且会自成一行。
32.使用范例:
原始码
呈现结果
标题一
标题一
标题二
标题二
标题三
标题三
标题四
标题四
标题五
标题五
标题六
标题六
【设定字体大小标签】
33.使用方法:
文字内容 34.标签解说:
标题的大小一共有七种,也就是
(最小)到 (最大),另外,还有一种写法:
文字内容,其意思就是说: 比预设字大一级。
当然也可以fontsize=+2(比预设字大二级),或是fontsize=-1(比预设字小一级),以一般而言,预设字体多为3。
35.使用范例:
原始码
呈现结果
字体一或是
字体一 字体一
字体二或是
字体二 字体二
字体三或是
字体三 字体三
字体四或是
字体四 字体四
字体五或是
字体五 字体五
字体六或是
字体六 字体六
字体七或是
字体七 字体七
【字型变化标签】
36.使用方法:
文字
37.标签解说:
在文字标签里,对于文字的格式也有相当多的变化,如粗体、斜体...等,此外,也定义了一些现成的格式供编者使用,如‘强调’、‘原始码’...等,当然,这只是方便您参考用,并无强迫说遇到原始码就要加上‘原始码’的标签。
38.使用范例:
原始码
呈现结果
粗体
粗体
斜体
斜体
底线
底线
上标
上标
下标
下标
打字机
打字机
(ie没效果)
闪烁
强调
强调
加强
加强
范例
范例
原始码
原始码
变数
变数
定义
定义
引用
引用
所在地址所在地址
【文字颜色设定】
39.使用方法:
文字颜色 40.标签解说:
文字也可以设定颜色喔!
至于颜色有哪些....这....哪天我心血来潮再来做个色彩对应表吧!
41.使用范例:
原始码
呈现结果
红 红色的字喔!
橙 橙色的字喔!
黄 黄色的字喔!
绿 绿色的字喔!
蓝 蓝色的字喔!
靛 靛色的字喔!
紫 紫色的字喔!
黑 黑色的字喔!
灰 灰色的字喔!
4.5 文字标签 <回细说索引>
【文字字型设定】
42.使用方法:
文字 43.标签解说:
网页上也可以使用字型喔!
唯一的一个限制是:
对方也要有该字型!
否则看到的仍然还是宋体。
另外要说明的是,这个标签并无法保证在每个浏览器上都能正常的显现,不过这并没有关系,看不到特殊的字型时,浏览器仍会以宋体来显示,所以不用怕会一团乱!
另外,如果您的网页中有加上这一行叙述
(指定网页的语言格式,以后我会解释),那么,netscape可以正确显示出中文,但英文无反应。 若没有加该行,那么英文会正确显示,但中文却仍是宋体。
至于ie系列,均能正常显示。
44.使用范例:
原始码
呈现结果
楷体 楷体
华康俪中黑 华康俪中黑
【特殊字元】
45.使用方法:
46.标签解说:
很多特殊的符号是需要特别处理的,比如说"<"、">"这两个符号若想要呈现在网页上是没有办法直接打"<"的,要呈现"<"必须输入编码表示法:
“<”,常用的如下:
47.使用范例:
原始码
呈现结果
( 代表一个不断行空白)
<
<
>
>
&
&
"
"
【设定文字内定值大小】
48.使用方法:
49.标签解说:
这个标签可以改变文字大小的内定值,直接加在
标签之后就行了。一般而言,若是没有特别设定,文字大小内定值预定值为3。
4.6 影像标签 <回细说索引>
【影像标签】
在使用影像标签时有两件事值得注意一下,一是档名,二是路径。
首先要注意的就是,档名是否正确以及大小写是否一致!
图档名称不正确,任电脑再厉害也找不到您要的图,档名大小写不一致,如Image.gif、image.gif、image.GIF在自己的电脑中看都能正确的显示,但是一但传到网路上去时,因为系统不一样的关系(电脑伺服器的作业系统可比个人用电脑的作业系统严谨多了)就变成三个不一样的档案了,所以,可别忽略档名大小写不一致的影响。
另外一个就是路径问题了,这个问题也不难,我们在稍后会提到。
我们先来看看影像的标签如何写。
50.使用方法:
51.标签解说:
目前常见的网页图形格式有两种就是gif及jpg两种格式。
gif格式只有256色,不过色彩比较鲜艳干净漂亮,适合电脑美工图案。
而jpg格式的图案是全彩失真压缩,比较适合一大堆颜色的图片,如照片就较适合用jpg格式来呈现。
52.使用范例:
基本用法
用法:
显示图片最基本的方法(就是不加任何属性啦!
)其中boy.gif就是图档的档名。
原始码
//www.tool.la/logo/logo2.gif">嗨!
我是本站的模特儿喔!
呈现结果
嗨!
我是本站的模特儿喔!
长宽设定
用法:
设图片的大小,其实不用设也可以,但是有设更好,可以加快浏览速度,因为浏览器就不用在那边花时间算您的图片有多大啦!
此外您也可以自己随意设定图片大小。
原始码
//www.tool.la/logo/logo2.gif">
呈现结果
加上说明
用法:
滑鼠一到图上时,说明文字就会自动出现。
此外,在图片未显示出来或显示不出来时,也会以这一段字代替,让使用者知道这个未显示出来的图片究竟是干嘛用的。
原始码
//www.tool.la/logo/logo2.gif" alt="本站特约模特儿">移到图上看看。
呈现结果
移到图上看看。
图片位置
用法:
图片位置设定!
可以靠左放:
align=left、靠上align=top、靠下align=bottom、垂直置中align=middle,其中靠左放可以造成‘文绕图’的效果。
原始码
//www.tool.la/logo/logo2.gif" align=right>嗨!
我往右边靠!
呈现结果
嗨!
我往右边靠!
原始码
//www.tool.la/logo/logo2.gif" align=left>嗨!
我往左边靠!
呈现结果
嗨!
我往左边靠!
原始码
//www.tool.la/logo/logo2.gif" align=top>文字对齐我头顶!
呈现结果
文字对齐我头顶!
原始码
//www.tool.la/logo/logo2.gif" align=bottom>文字对齐我脚底!
呈现结果
文字对齐我脚底!
原始码
//www.tool.la/logo/logo2.gif" align=middle>文字对齐我中间!
呈现结果
文字对齐我中间!
原始码
//www.tool.la/logo/logo2.gif" align=absmiddle>文字对齐我绝对中间!
呈现结果
文字对齐我绝对中间!
边框设定
用法:
设定边框大小,通常都设成0感觉比较美观啦!
因为内定的框框实在是不怎么漂亮....。
尤其在链接时,设框框简直是丑毙了...。
原始码
//www.tool.la/logo/logo2.gif" border="4">
呈现结果
左右间距
用法:
离文字的水平距离,通常多少也设一点,以免靠文字太近,看起来才不会有太挤的感觉。
原始码
左边的字
//www.tool.la/logo/logo2.gif" hspace="15">右边的字
呈现结果
左边的字
右边的字
上下间距
用法:
离文字的垂直距离,通常多少也设一点,以免靠文字太近,看起来才不会有太挤的感觉。
原始码
上面的字
//www.tool.la/logo/logo2.gif" vspace="15">
下面的字呈现结果
上面的字
下面的字
由于此网页有用css控制版面图文,故在netscape下观看,会稍有不正确。
【网页影像重要观念】
53.关于路径:
现在我们来谈谈图片路径的事,路径不对,不管您的网页名称写的多正确也没用,因为浏览器无法寻着您的路径去找到该有的图片,所以,我们来看看该如何正确的使用路径。
有些人并不喜欢将网页及图通通放在同一个目录下,比如说有人将图档全放在c:
\images里,而网页档放在c:
\demo里,这样子的话,我们该如何正确的写图片的路径呢?
我将几种常见的情形整理成下表:
html档的位置
图档的位置
写法
情形说明
c:
\demo
c:
\demo
图文均在同一目录
c:
\demo
c:
\demo\images
图在网页下一层目录
c:
\demo
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 细说 HTML 标签