0

点赞

收藏

分享

HTML 4.0 语法教学

荷一居茶生活 2022-09-01 阅读 62

标签: 分隔线 html 表单 OpenStack 云计算

HTML 4.0 语法教学
	■ 认识HTML语法 (标签快速导览) ◆ 网页架构 ◆ 分隔标签 ◆ 排版标签 ◆ 字体标签 ◆ 文字标签 ◆ 影像标签 ◆ 背景标签 ◆ 连结标签◆ 表格标签 ◆ 序列标签 ◆ 表单标签 ◆ 框架标签 ◆ 其他技巧

■ 细说HTML标签在HTML语法中，大致上可以分为： ( 节录自‘网站建置百宝箱’) 网页架构：主要网页主架构的介绍分隔标签：也就是所谓的水平线排版标签：针对标签的属性，可做适当的版面编排字体标签：教导您设定文字的字体。文字标签：教导您设定文字的颜色、行距、变化.....等等。影像标签：教导您如何在网页中，植入图像。背景标签：教导您如何设定背景颜色或是背景图像。连结标签：教导您如何设定超连结，以及开视窗的条件。表格标签：教导您如何在网页中运用表格。序列标签：教导您如何设定文字序列或图形序列。表单标签：教导您如何制作可填写用的表单。框架标签：可让同一个视窗由多个网页一起组成。其他技巧：让您的整个网页背景可以让您设定为图片或是声音。 4.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文件喔！也就是说它是一个网页的格式啦！通常都包在网页的最上下两端，将所有的原始码都包起来。 4.2 分隔标签 <回细说索引> 4.3 排版标签 <回细说索引> 4.4 字体标签 <回细说索引> 4.5 文字标签 <回细说索引> 4.6 影像标签 <回细说索引> 4.7 背景标签 <回细说索引> 4.8 连结标签 <回细说索引> 4.9 表格标签 <回细说索引> 4.10 序列标签 <回细说索引> 4.11 表单标签 <回细说索引> 4.12 框架标签 <回细说索引> 4.13 其他技巧 <回细说索引> ■ 网页配色及背景音乐首先是网页的底色，通常是白白的，要怎么做变化呢？可以做自己的背景图片。要注意一点，如果背景和文字颜色一样～或者颜色相近，天啊～那谁知道你在写什么呀？最好文字与背景颜色有对比，像敝人当初，网页背景是黑的，字是白的红的，就可以很明显的突显出文字。如果图片中有文字，也要尽量淡化，否则影响内容就不好啰！内容的东西颜色要配的适宜（除非你想要有奇怪的风格），不然像背景大红大红，太刺眼了，有人会想去吗？剩下的就让您自己配配看吧！然后是音乐，有人喜欢用bgsound标签 <bgsound src="music.mid"> 可是用NetScape看就没有声音了最好用embed标签 <embed src="music.mid"> 这样就可以正常播放了唷～ ■ 首页应有的特质及重要性 About Open Page：打开browser看到网站的第一个部份，有人称之为Open Page(通常是首页的一半或三分之一)，这个部份应该包含网站的主功能(亦即使用者上这个网站最希望或者最可能做的事)，ex. 一进入Allproducts.com即可看到“Key word search”及“Search by category”，应该尽量避免让使用者还要使用mouse上下左右拉才能看到他(她)所想要的功能或资讯，有时资讯太多，在不得已的情况下，页面可以往下沿申，但切忌右左划面过大，不符一般人的使用习惯，也会造成列印上的困扰。主题明确：Open Page应包含公司Logo、网站主题(最好是一段简短的Slogan，让使用者一看就知道这个网站主要功能或架站目的,ex. Allproducts.com上的The world's best products directory for volume buyers) Navigation：让使用者很明确了解他(她)目前在网站的什么地方(或功能)，首页上应该有主要功能的连结，各个icon如果可能的话，尽可能加上一些纯文字的说明及link；至于icon或者link的摆放亦应有其相对应的逻辑，如与整个网站或大架构较为相关的，放在较外层，与目前执行的功能或页面较为相关的link应该放在内层；另外，最好能在首页上提供Site Map的连结，让使用者可以很快了解网站的架构；所有的link应该把握 intuitive , obvious , fast的原则。 Color or image：对于颜色的采用，应该考虑到该网站的特性及与其它相关网站的区别，特别是首页的颜色配置，应该让使用者感觉很舒服、没有压迫感，但又不失其专业性，但切忌过度追求美感而牺牲其功能性，就公司目前的网站设计理念，应该是功能性的考量优于纯美术的考量，首页的设计最好设定在60k以内，而且不要用太多层的table。 Meta tag：该部份不会出现在前端的页面上，但网站规划时应该将该部份一并考量，做为网站登录时使用，网站上线时务必将相关资料加入。其它：首页上应该有service account 及联络资料 ■ Meta Tag 的简介一般常用的格式如下： <Title>All Products Online</title> 这虽说不是meta的一部份，但是也不可忽略，总长度不要超过85个Character (约10个字)。 <meta http-quive="content-type" content="text/html; charset=iso-8859-1"> 说明网站的格式及编码方式，另外这个功能也可以拿来说明网站的名称。 <meta name="keyword" contents="关键字一, 关键字二, 关键字三, ….."> 铲明整个网站的关键字，关键字间用逗点隔开，总长度最好不要超过1000个Character (约44个字)。 <meta name="description" contents="整个网站的描述…."> 铲明整个网站为何吸引人的地方，可用逗点隔开，总长度最好不要超过200个Character (约15个字)，若文章真的太长，可以切割成两个部分，较不重要的部分置入下一个Description。 <meta name="robots" content=" ALL, NONE, INDEX, NOINDEX, FOLLOW, NOFOLLOW"> 此功能是要给搜寻引擎使用的，是要用来告诉Spider哪些网页是要去撷取的或不用去撷取的，一般都设定成All(内定值)。

【文字上的分隔标签】 <br><p> 或许你已经发现这个问题了：天啊！我不是在记事本里排版排得很漂亮，为何透过浏览器看起来一切都走了样？对啊！别太讶异，在网页的编排里，并不像汉书或WORD一样，只要拼命按Enter键或空白键，便能完成分段或分行，因为，HTML语言是不认识我们所谓的Enter键或空白键，所以不管您按了多少次的空白或Enter，浏览器都会当作没看见啦！使用方法：强制断行标签<br>、强制分段标签<p> 标签解说：我们在写文章时，有时候在特定的地方会强迫断行（<br>），或是在写完某一段的时候便会分段（<p>），写网页也一样，而且更需要断行及分段的功能，以免整个网页看起来乱糟糟的。使用范例：【分隔线标签】 <hr><hr color=“颜色” width=“宽度”size=“厚度”align=“水平对齐”> 使用方法：上一段文字内容<hr>下一段文字内容标签解说：利用<hr>这个标签便可产生一条横分隔线。另外，其有些属性分别说明如下：使用范例：原始码呈现结果这是一个断行的范例<br>看出来了吗？这是一个断行的范例看出来了吗？这是一个分段的范例<p>基本上他会比断行还多空出一行这是一个分段的范例基本上分段会比断行还多空出一行

0 条评论

荷一居茶生活

关注