鸡叔学前端

在经历了将近一周的练手项目后，我们基本习惯了HTML+CSS制作网页的流程，不再轻易地使用被HTML 5抛弃的标签（如font、center、strike等）和属性。

字体是网页中最常见的，但也可能是最容易被忽视的一部分。但其实网页从一开始出现，就面临着与字体打交道的问题——文字排版。文字排版是各类出版物（包括网页、纸媒等）在内最

图片新闻是门户网站最能吸引用户眼球的内容之一。许多栏目都有大量的图文内容需要展示，比如明星八卦、体育竞技、数码科技等。本文将通过实现一个图片新闻栏目来继续探讨内容布局以及CSS 3动画。

对于栏目众多的门户网站来说，站点栏目导航能够方便用户浏览整个网站。今天我们通过实现网易首页的站点地图部分来继续熟悉Flexbox弹性布局。

大型门户网站为了吸引尽可能多的用户，所涉及的内容非常广泛。通过标签页的设计在有限的页面展示空间里呈现更多的内容，是每个门户型网站的共同选择。

在浏览新闻或资讯的时候，大家通常会关注文章的时效，也就是文章发布时间。因此许多网站会之间在列表页将发布时间显示出来，甚至还会顺便增加作者、

内容区是新闻门户网站最重要的组成部分。它一般用来显示网站的热门版块以及其热点内容（新闻）条目。根据内容、性质、热度等不同，会采用文字、图片、视频链接等方式进行呈现。在接下来的内容中，我们将通过实现几种

导航菜单区是网站最重要的组成部分之一，对于一个新闻门户网站来说更是这样。网易首页的导航菜单采用平铺展开的两级菜单，最终效果如下。

在上一节中我们实现了网易新闻首页的标题部分，接下来了解一下其中所用到的前端知识点。HTML 5页面有一些固定的内容，我们可以将它作为模板，在开发任何一个HTML 5页面时都可以直接拿来使用，甚至一些I

在上一章我们了解到不同类型的网站，页面布局差异极大。但不同的网页的功能结构之间还是包含了许多共同之处。每一个网页都是由许多功能模块所组成。通过了解页面布局组成，练习这些组成结构的实现，能够帮助我们积累