分分钟教会你使用HTML写Web页面_html/css_WEB-ITnose-html教程-PHP中文网

分分钟教会你使用HTML写Web页面_html/css_WEB-ITnose

php中文网

发布： 2016-06-24 11:55:18

原创

1477人浏览过

在学习如何使用html编写网页之前，我们必须先搞清楚什么是html？当然了不是系统的给大家介绍html的前世今生，如果对其身世感兴趣的小伙伴可以去问度娘，她会给你想要的答案。

所谓HTML，就是我们常听到的“超文本标记语言”，是标准通用标记语言下的一个应用，目前最新的版本是5.0，上面的图片就是官方发布的Logo。“超文本”就是指页面的内容不仅有文字，还有可以有图片、链接，甚至是声音、动画和小程序等非文字元素。你只需知道Web页面就是网页，而HTML就是用来写网页的一种标记语言即可。

了解了HTML的概念之后，我们再来看HTML文档的大体结构：简单来说，包含两大部分，一个是头（Head），另一个就是主体，也就是身体（Body），Head部分主要用来描述关于网页的信息，Body部分则是网页的具体内容。通常我们用三对标签来表示一个页面的整体结构，它们分别为,

和。我们使用VS新建一个HTML文件，来看看它的具体结构，如下图所示：

立即学习“前端免费学习笔记（深入）”；

说到标签，也叫作标记符。一个标签就是左右分别有一个小于号（）的字符串。开始标签是指不以斜杠（/）开头的标签，其内部是一串允许的属性-值对。结束标签则是以一个斜杠（/）开头的标签。网页文档的结构和格式的定义是由HTML元素来完成的，而HTML元素是由单个或一对标签定义的包含范围。下图给出了HTML元素的四种主要形式：

立即学习“前端免费学习笔记（深入）”；

在HTML中常用的Head元素如下图所示

立即学习“前端免费学习笔记（深入）”；

常用的字符集如下图所示

立即学习“前端免费学习笔记（深入）”；

说了这么多，我想你也许有点不耐烦了，那种迫不及待的想动手的激动心情我能理解。下面我们就来小试牛刀一把，编写一个简单的网页。

首先就是要新建一个HTML文件，建好之后的样子如上面的那个整体结构图

然后我们就在相应的标签之间插入我们想要展示的内容即可，我先把代码给一下：

<!DOCTYPE html><html ><head>    <title>廊坊师范学院</title></head><body>    <!--这是一个关于我们学校的网页Demo-->			<center>				<h2>@@##@@<font color="bule">廊坊师范学院</font></h2>                        						       <b>厚德博学，弘毅致远</b>                						<hr color="blue">						<p>						<b><i><font color="green" size="3">廊坊师范学院地处被誉为“京津走廊上一颗璀璨明珠”的河北省廊坊市。                            1946年建校，2000年经教育部批准，升格为省属普通本科院校。升本以来，学校为社会输送了4万余名各级各                            类专业人才。<br>						    学校分两个校区办学，占地2000亩，教育教学设施与设备条件优越，馆藏文献140万册，电子图书107万册。                            设有14个二级学院和继续教育学院、图书馆、社科部、期刊部等教辅单位，14个党政部门；含有普通本、专科                            教育、高职教育、成人教育等多种教育模式；现有全日制在校生近20000名，教职员工 1394名，其中专任教师                            902人，具有副高级以上职称的教师491名，具有博士、硕士学位及研究生以上学历的教师638名。<br>                            学校坚持以学科专业建设为龙头，努力打造以教师教育学科专业为主体，理、工、经、管、法等多科协调发展                            的专业格局。现开设本、专科专业108个，涵盖九大学科门类。其中汉语言文学专业为国家级特色专业和国家级                            专业综合改革试点，同时还拥有一大批省级特色专业、教育创新高地、重点发展学科、实验教学示范中心、教学                            团队、专业综合改革试点和精品课程。						      </font></i></b></br>                            @@##@@                            <a href="http://www.lfsfxy.edu.cn/" target=”_blank“><font color="bule" size="12">更多了解</a></br>                            		</center></body></html>

登录后复制

下面我们来看一下使用IE浏览器运行的结果

在上面的例子中我应用了文字，图片以及链接等等简单的网页元素，而且并没有对布局进行设计，因为也只是看了两个小时的视频，在这里想说的是用HTML写Web页面是一件很简单的事，也就是我题目所说的“分分钟教会你使用HTML写Web页面”。

但是想要做出无论内容还是结构俱佳的网页，是需要我们认真研究和学习的，如今比较流行的B/S模式的应用，需要我们能够设计和制作出比较好的前端页面，因此还需要进一步的去学习和总结。今天就先到这里，赶紧动手DIY自己想象之中的Web页面吧。分分钟教会你使用HTML写Web页面_html/css_WEB-ITnose