细说HTML标签
1 网页架构
<HTML>
<HEAD>
<TITLE> 智勇之家网页制作教学</TITLE>
<Meta>
</HEAD>
<BODY>
BODY之间则为主要语法所在,也是网页的主要呈现部分。
</BODY>
</HTML>
【标签解说】
以上看到的就是一篇最简单架构的网页。没错,网页其实就是一堆标签(所谓标签就是指被<>包起来的语法)集合起来的,透过浏览器的消化整理,就便成了美仑美奂的网页了。
简单而言,通常一份完整的网页包含了二个部份:抬头(HEAD)、文件本体(BODY)。也就是各位在上面所看到的<HEAD></HEAD>以及<BODY></BODY>。
在抬头的部份<HEAD></HEAD>中,有另一组标签<TITLE></TITLE>。打在<TITLE></TITLE>这里面的文字会出现在浏览器视窗最上头蓝色部份里,当作一篇网页的主题。
您可能会发现,为什么我一直没提到<HTML></HTML>这一组标签,嗯!因为它可有可无。这一组标签是告诉浏览器说:我是一份HTML文件喔!也就是说它是一个网页的格式啦!通常都包在网页的最上下两端,将所有的原始码都包起来。
2 分隔标签
【分隔线标签】
<HTML>
<HEAD>
<TITLE> 智勇之家网页制作教学</TITLE>
<Meta>
</HEAD>
<BODY>
BODY之间则为主要语法所在,也是网页的主要呈现部分。
</BODY>
</HTML>
【标签解说】
以上看到的就是一篇最简单架构的网页。没错,网页其实就是一堆标签(所谓标签就是指被<>包起来的语法)集合起来的,透过浏览器的消化整理,就便成了美仑美奂的网页了。
简单而言,通常一份完整的网页包含了二个部份:抬头(HEAD)、文件本体(BODY)。也就是各位在上面所看到的<HEAD></HEAD>以及<BODY></BODY>。
在抬头的部份<HEAD></HEAD>中,有另一组标签<TITLE></TITLE>。打在<TITLE></TITLE>这里面的文字会出现在浏览器视窗最上头蓝色部份里,当作一篇网页的主题。
您可能会发现,为什么我一直没提到<HTML></HTML>这一组标签,嗯!因为它可有可无。这一组标签是告诉浏览器说:我是一份HTML文件喔!也就是说它是一个网页的格式啦!通常都包在网页的最上下两端,将所有的原始码都包起来。
2 分隔标签
【文字上的分隔标签】 或许你已经发现这个问题了:天啊!我不是在记事本里排版排得很漂亮,为何透过浏览器看起来一切都走了样?对啊!别太讶异,在网页的编排里,并不像汉书或WORD一样,只要拼命按Enter键或空白键,便能完成分段或分行,因为,HTML语言是不认识我们所谓的Enter键或空白键,所以不管您按了多少次的空白或Enter,浏览器都会当作没看见啦!
|
- 使用方法:上一段文字内容<hr>下一段文字内容
- 标签解说:利用<hr>这个标签便可产生一条横分隔线。另外,其有些属性分别说明如下:
- 使用范例:
一般用法 尚未加任何属性。 原始码 普通分隔线<hr> 呈现结果 普通分隔线 颜色属性 用法:<hr color="颜色码或颜色名称"> 原始码 橘色分隔线<hr color="#ff8000"> 呈现结果 橘色分隔线 宽度属性 用法:<hr width="宽度">,其单位为px(像素),宽度亦可用百分比来作设定,如50%即意为宽度占萤幕50%。 原始码 宽度为240px的分隔线<hr width="240"> 呈现结果 宽度为240px分隔线 厚度属性 用法:<hr size="厚度"> 原始码 厚度为5的分隔线<hr size="5"> 呈现结果 厚度为5分隔线 位置属性 用法:<hr align="水平对齐位置">,其设定值有三个,也就是置左align="left"、置中align="center"、置右align="right" 原始码 靠右的分隔线<hr align="right"> 呈现结果 靠右的分隔线 阴影属性 用法:<hr noshade>,无设定值,只要将 noshade 加入即可,通常会配合颜色设定,效果较佳。 原始码 实心分隔线(无阴影)<hr noshade> 呈现结果 实心分隔线(无阴影)
3 排版标签
【文字置左、置中、置右】
【置中标签】
【向右缩排标签】
【保存原始格式标签】
|
4 字体标签
【标题标签】
【设定字体大小标签】
【字型变化标签】
【文字颜色设定】
|