零基础学网页制作系列教程之HTMl入门---第三章:网页的基本结构详解
零基础学网页制作系列教程之HTMl入门---第三章:网页的基本结构详解大家学了这一课,我们就可以把世界上所有的网站都拿出来看,不管是哪个国家的什么网站,不管它有多牛,内容有多丰富,版式有多复杂,网页基本结构都是一样的
说白了,不管你有多帅,脱光了衣服,大家都是一样的人,只是外部不一样,在本质上却是相同的
在讲述前,我先教大家怎么看一个网页的源代码:在浏览器上有个页面菜单,我们可以选择此菜单,选择里面的查看源文件,我们就可以轻松的看到我们当前浏览的网页的源文件,别人丰富的网页,你通过这种方式就可以轻松的看到别人站的背后真实的代码了.
有些人可能要问,那是不是可以通过这种方式盗取别人网站代码了呢,这个问题我暂时在这里不做答,保留大家思考,等我们后期课程大家学完了,就自然明白了
下面我们回到正题:
[quote]
3.1 网页的基本结构[code]
<html>
<head> </head>
<body> </body>
</html>[/code][/quote]
所有的网站都是按上面的结构构建的,是不是很简单啊,其实做网页就是这么简单,编代码也就这样简单
下面来为大家详细解说各标签的意义:[code]
<html> </html>
<html>标记符标志着HTML文件的开始,而</html>标志着HTML文件的结束,WEB页面中其他所有内容都放在这两个标记之间,html标记符没有任何属性[/code][code]<head> </head>
<head>是首页标记符,该标记符不包括WEB页面相关的特定信息.例如可以定义样式表和插入脚本
特别的:标题标记符title,样式表标记符style,脚本语言标记符script[/code][code]<body> </body>
web页的所有的内容,文字,图形,连接以及其他页面元素的都包含在这个标签里面,可以这么说,不管什么页面,我们能看到的东西都是在这个标记间[/code]
[quote]
[size=4][color=darkred][b]完整学习系列[/b][/color][/size]
[color=red]第一课:[/color][url=http://www.joy666.com/thread-147061-1-1.html][color=blue][size=14px]从今天起,正式开将零基础学做网站,本单元为网页基础课程HTML,什么是HTML[/size][/color][/url]
[color=red]第二课:[/color][url=http://www.joy666.com/thread-147123-1-1.html][color=blue][size=14px]零基础学网页制作系列教程之HTMl入门---第二章:HTML标记符基础[/size][/color][/url]
[color=red]第三课:[/color][url=http://www.joy666.com/thread-147129-1-1.html][color=blue][size=14px]零基础学网页制作系列教程之HTMl入门---第三章:网页的基本结构详解[/size][/color][/url]
[/quote] [quote]
<title>标记的作用:[code]
<html>
<head>
<title>我的第一个网页</title>
</head>
<body>
注意看到标题是什么了吗,这就是title的作用
</body>
</html>[/code][/quote]
你也可以将上面的文件放到记事本里面,把文件保存为.htm或者以.html后缀的文件,我们将看到的效果:
[attach]2030[/attach]
我做好的一个网页放在这里,是上面的代码大家可以下载下去看看
[attach]2029[/attach]
你可以之家在记事本上编辑上面的文字注意保存为.html格式就可以显示了,一个简单的网页就这样制作出来了 [quote]
body的属性:
background:定义网页的背景图片
bgcolor: 定义网页的背景颜色,默认的是白色(默认就是在你未设置的时候)
text: 定义网页中文字的颜色,默认的是黑色
link: 定义网页中超链接的颜色,默认的是蓝色
alink: 定义网页中被选中的超链接的颜色,默认的是红色
vlink: 定义网页中已经被访问过的超链接的颜色,默认的是紫色
[/quote]
用法:<body background="c:/images/1.jpg">
其中background为属性,c:/images/1.jpg为属性的值,类似的参照此用法就可以
我们可以利用上面的讲解做什么呢
[attach]2032[/attach]
这是源文件
[attach]2031[/attach] 大家可以根据今天的教程做一些简单的漂亮的页面.欢迎大家自己动手做做,有任何问题都可以跟贴讨论,请大家把自己做的效果切下图片发上来,秀一下自己的成果
老大能否再仔细讲讲head,还是有点模糊.其他的讲的很清楚.
老大能否再仔细讲讲head,还是有点模糊.其他的讲的很清楚.顶....................................................
还有你在讲解tile标记作用的时候是不是漏了一 个 /
还有你在讲解tile标记作用的时候是不是漏了一 个 /还有一个问题
还有一个问题是:那些代码的排序怎么定,就是分行就可以了吗?前面的空格有什么数量要求吗?? [quote]原帖由 [i]娟娟[/i] 于 2008-4-23 09:44 发表 [url=http://www.joy666.com/redirect.php?goto=findpost&pid=202188&ptid=147129][img]http://www.joy666.com/images/common/back.gif[/img][/url]老大能否再仔细讲讲head,还是有点模糊.其他的讲的很清楚.
顶.................................................... [/quote]
关于head部分的作用在开始的讲解中,我们一般只需要注意title的用发就可以了,这个title是用来定义网页标题栏信息的 [quote]原帖由 [i]娟娟[/i] 于 2008-4-23 10:06 发表 [url=http://www.joy666.com/redirect.php?goto=findpost&pid=202196&ptid=147129][img]http://www.joy666.com/images/common/back.gif[/img][/url]
还有一个问题是:那些代码的排序怎么定,就是分行就可以了吗?前面的空格有什么数量要求吗?? [/quote]
关于空格的问题在我们后续的讲课当中,我们将会有相关专题
这个怎么引用？
<body background="c:/images/1.jpg">,其中c:/images/1.jpg，是你事先存在c盘里，然后引用就好，是这样吗？我却引用不上，我对这个有兴趣，只不过是初学者，多多关照！页:
[1]