网站制作

本类阅读TOP10

·IIS 安装配置全攻略
·用VS.NET打开网上下载的.NET web项目出错的解决办法
·HTML 4.0 语言快速参考
·限制TextArea区的文字输入数量
·如何在网页上实现进度条
·Apache的配置步骤及测试
·谈谈Jesse James Garrett提到的Ajax
·html基础学习笔记(2)
·页面垂直居中的两种方法
·用asp遍历目录下文件的例子

分类导航
VC语言Delphi
VB语言ASP
PerlJava
Script数据库
其他语言游戏开发
文件格式网站制作
软件工程.NET开发
html基础学习笔记(1)

作者:未知 来源:月光软件站 加入时间:2005-6-5 月光软件站

经过1天多的艰苦奋战,终于把html(Hypertext markup language)的基础教程给看完了。

这次为了xml而看了这“古老”的技术,还是有点收获的。。总体来说,虽然不是很熟练,但是看懂一般的html网页源文件已经不是问题了。闲来无事,就写写笔记吧,说说感受也好!

1总体架构

html给我的感觉是很标准,很有格式的。最主要的代码特点就是标记成对的出现,虽然有些可以省略,但是建议除非太过烦琐还是把前后都加上去吧!作为一个完整的html网页,总是有头部,主体和结尾3大部分,分别用<head></head>,<body></body>和</html>表示。另外,一个重要特性就是可以自定义风格(CSS),这是非常方便的,类似于编程语言的类的功能吧!同时,还可以嵌入其他script来增强其交互功能。而对于相当重要的标记,也只是由头部标识和属性所组成。(<标识 属性1 属性2 属性3...>)看来,学习html是学习其他网页脚本语言的基础吧,同时对于学习可视化网页设计也是有帮助的(这么说应该不过分吧!)!,下面就让我们一起来详细分析各个部分的构成元素。

2常见标记介绍

其实大多数html网页的标记不多,就只有10几个吧!(看到这里,好!)这里主要介绍一下常见的控制文件的外观和布局的标记!

<h>:从<h1>到<h6>所标识的字体依次减小,一般来说,<h1>用来标记文件标题<h2>用来标记一章的标题<h3>用来标记章节的标题,<h6>则是来作为小字印刷,如版权信息等等。

<p>和<br>:基本类似于回车键的功能,而<p>可以插入空格,同时也可以附带属性,如<p align=right>效果<p>(缺省情况是左对齐,左对齐很多排列方式的缺省情况)

<div>:虽然类似于<p>,也可以使用align属性,但是在使用风格表格时功能强大。(风格表格见后)

<hr>:可以产生一条水平线,对于组织格式是很有帮助的。

在这里应该说一说逻辑标记和物理标记的差别:物理标记表明信息的外观,而逻辑标记表明信息的语义。从适用范围来说,使用逻辑标记更值得推荐,因为逻辑标记表示的是本质特性,不随浏览器的变化而变化!

逻辑标记:<cite><dfn><strong><code><ins><del>(注:大家可以自己测试一下,看看有什么效果,其中ins和del是很有用的标记,特别是在多人合作开发的时候,看字面应该知道这两个是干嘛的吧!)

物理标记:<i><t><tt><big><small><sub><sup><strike>(注:大家测试吧,动手最重要◎)

3链接

链接是超文本(Hypertext)格式的重要实现方式,而使用的就是锚(Anchor)(,所以缩写也就是<a>),

一个典型的锚标记的定义:<a href="目标页面">激活热区</a>(注:href:hypertext reference,就是链接到哪里),现在分情况介绍:

1)外部链接

1。1非本地文件:<a href="http://www.zsu.edu.cn">中山大学</a>(这个很明显,不用解释了)

1。2其他形式的非本地资源:<a href="ftp://ftp.zsu.edu.cn">中山大学</a>(ftp资源)

                                                     <a href="mailto:mc02cxj@zsu.edu.cn">我的email</a>(email信息)

1。2本地文件:<a href="另一个网页.html">另一网页?</a>(同一文件夹的,当然也可以给出完整路径咯)

                            <a href="../另一个网页.html">另一网页?</a>(上一级别文件夹的)

                       (注:../表示上一级文件夹,同样../../就表示上上一级)

2)内部链接

什么是内部链接,就是在同一个网页里边的链接!这样做是为了避免网页太大而造成的浏览麻烦!

步骤:首先要定义一个引用目标锚,然后在另一处定义被锚引用的目标!看例子吧◎

<a herf="#top">top</a>(其中#top定义了该锚)

<a name="top">top</a>(这里就引用了该锚)

(注:这种方法最常见的应用就是网页上经常看到的网页最下边的“返回顶部”了)

4图像

使用图像:<img src="图像文件">(注:图像文件路径与链接路径相同)。在这里可以加入提示属性<alt>,如<img src="图片.gif" alt="图片">(注:看看有什么效果,如果图片不存在,会怎样呢?)

1)对齐方式:缺省是左对齐,可以使用<div align=..>进行更改。

2)高度和宽度:<img src="图片.gif" height=34mm width=34mm>(注:看明白了吧!不过应该注意的一点是,在ie里边高度和宽度的比例应该与源图相同,不然就显示不了,已在我的机子上测试过了)

3)四周区域和边框:<img src="图像文件" border=4 hspace=5 vspace=5>(注:很简单吧,测试一下吧!还有,边框默认情况是没有的,但是对于有链接的图来说,有个框框还是很好的)

啊。。今天就到这里吧。。下次继续。。




相关文章

相关软件




月光软件源码下载编程文档电脑教程网站优化网址导航网络文学游戏天地生活休闲写作范文安妮宝贝站内搜索
电脑技术编程开发网络专区谈天说地情感世界游戏元素分类游戏热门游戏体育运动手机专区业余爱好影视沙龙
音乐天地数码广场教育园地科学大观古今纵横谈股论金人文艺术医学保健动漫图酷二手专区地方风情各行各业

月光软件站·版权所有