有一句名言,Talk is cheap,show me the code.这句话无论放到那里都非常合适
我们也废话少说,首先给大家展示一下我们PC端最终实现的效果。
上面的网页很简单,但也很完整。麻雀虽小,但五脏俱全。
我们可以通过这个案例,将HTML5+CSS3中主要的功能以及响应式布局全都掌握。
整个课程的目标是让大家可以从零基础完成一个简单页面的制作, 了解制作网页的思路和最佳实践,有能力实现自己的想法和产品
网页入门知识, 下图就好比是一个网页, 但是我们经常会说的是网站, 网页和网站之间有什么关系呢?
我们都上过各种网站,百度、谷歌、新浪、facebook等等。
这些网站看着很庞大,像是一个整体。但其实他们是由一些很小的部分构成的。
我们说九层之台,始于雷同。其实网站就是一个个网页,网页相互连接起来就构成一个网站。
其实每个网页都是一个文件,文件不仅有文件名,还有扩展名。
下面我们通过三张图,让大家了解一下文件名和扩展名。
文件名: 当然就是文件的名字。
扩展名: 实际就是文件的类型。
我们现在说一下网页文件,扩展名就是html,html的全拼是什么呢,有两种解释,
第一个就是How to make love(这和PHP(拍黄片)可以说是如出一辙).
正规的解释当然就是Hyper Text Markup Langeage(超.文本.标签.语言)。
超文本也就是超链接了,我们网页的制作就是由html超文本标签语言来完成的。
所以大家一定要记住这个后缀.html.
工欲善其事,必先利其器
上面两个是我们选择的两款必要工具,Sumlime3是编辑器,可以利用Sumlime3编辑我们的网页,
Chrome是用来查阅效果、调试用到的浏览器。浏览器有多中,但在现在主流的浏览器中,
最常见也就是三种,Chrome、Safari以及Firefox。
通过上图的百分比,我们不难发现,我们为什么选择Chrome,其中的一个主要原因就是市场的占有率,
也就是市场上有快将近一半的人使用Chrome,这是市场的优势。
我们用它来进行测试我们的网页以及条件网页都是有利的。
当然还有另外一个让我们不得不选择Chrome的原因,那就是它具有强大而的开发者工具,这可以大大的提高我们制作网页的效率。
我在这里就不给大家介绍如何安装谷歌浏览器和Sublime3工具了,我相信大家一定有能力将这两个工具准备好。
下一节: 我们将来介绍“标签和属性”