理论教育 DIV+CSS3网页设计制作教程

DIV+CSS3网页设计制作教程

时间:2023-11-22 理论教育 版权反馈
【摘要】:当时,美国有所大学为表彰詹天佑的成就,决定授予他工科博士学位。可是,詹天佑正担负着另一条铁路的设计任务,毅然谢绝了邀请。从结构上来讲,HTML语言主要是由元素组成。新建一个HTML文件时,首先应该用<!doctype html>对文档进行声明,声明文档为HTML文档。案例HTML文件运行结果如图3.2.1所示。

DIV+CSS3网页设计制作教程

【案例引入】

近代科学先驱、著名工程师詹天佑,在国内一无资本、二无技术、三无人才的艰难局面面前,满怀爱国热情,受命修建京张铁路。他以忘我的吃苦精神,走遍了北京至张家口之间的山山岭岭,只用了500万元、4年时间就修成了外国人计划需资900万元、需时7年才能修完的京张铁路。前来参观的外国专家无不震惊和赞叹。当时,美国有所大学为表彰詹天佑的成就,决定授予他工科博士学位。可是,詹天佑正担负着另一条铁路的设计任务,毅然谢绝了邀请。他这种为国家不为个人功名的精神,赢得了国内外的称赞。

【案例分析】

詹天佑不为个人功名、满怀爱国热情的精神让人敬佩,我们在学习网页代码编写时,要学习詹天佑的不畏艰难、淡泊名利的高尚品质。

【主要知识点】

3.2.1 HTML5文件标记特征

HTML5文件基本结构是指构成HTML5文件的基本结构标记。从结构上来讲,HTML语言主要是由元素(element)组成。一般我们可以把元素看成容器,即它有起始标记和结尾标记。元素的开始标记叫作起始标记(Start Tag),元素的结束标记叫作结尾标记(End Tag),在起始标记和结尾标记之间的部分是元素体。HTML标记在使用时必须用方括号“<>”括起来,而且是成对出现,无斜杠的标记表示该标记的作用开始,有斜杠的标记表示该标记的作用结束。在HTML中,标记的大小写作用相同,如<TABLE>和<table>都表示一个表格的开始。

3.2.2 HTML5文件的主要结构标记

所有的HTML5文件一般都包括以下5个结构标签:

①文档声明:<!doctype html>。

②html文件标签:<html></html>。

③文件头标签:<head></head>。

④标题标签:<title></title>。

⑤主体标签:<body></body>。(www.daowen.com)

新建一个HTML文件时,首先应该用<!doctype html>对文档进行声明,声明文档为HTML文档。声明有助于浏览器正确显示网页。

无论是动态页面还是静态页面,都是以“<html>”开始,以“</html>”结尾。“<html>”标签后面接着是“<head>”标签,<head></head>标签中的内容在浏览器页面中是不能显示出来的,在“<title></title>”标签中放置的是网页标题。然后是正文“<body></body>”标签,也就是常说的主体区域,里面所有的内容都会通过浏览器页面呈现出来。最后以“</html>”结尾,也就是网页闭合,以上是一个完整的结构,还可以再增加更多的样式和内容来充实网页。

案例【3.2.1】HTML文件

运行结果如图3.2.1所示。

图3.2.1 我的第一个页面

课程育人】

本任务让我们掌握了HTML5的文件结构标记基本特征,并学会HTML5文件的5个主要结构标记的编写。我们在编写时要学习像詹天佑一样一丝不苟、严谨务实的工匠精神。

【课堂互动】

请问HTML5文件的5个主要结构标记都是哪些?各起什么作用?

免责声明:以上内容源自网络,版权归原作者所有,如有侵犯您的原创版权请告知,我们将尽快删除相关内容。

我要反馈