导航栏结构分析

有的网页导航栏直接将a标签放在div中，比如：百度和网易等。

<div id="nav">
    <a href="#">Home</a>
    <a href="#">About</a>
    <a href="#">Contact</a>
</div>

一个简易的相册

在上一次模仿新闻页的时候，学习了一种对图片进行处理的方式，这次换个思路，写一个简易的相册。

第一种思路

惯例 HTML框架

几个常见的CSS滤镜效果

今天学习几个CSS的滤镜效果，这里暂时只用CSS3的filter来实现，至于利用SVG和Canvas的坑以后再填

灰度图

在一些哀悼日，网页可能要设为全灰色。CSS3中用greyscale来实现 取值范围为0-1或0-100%；0表示无效果，1或100%表示最大效果

先是HTML代码：

<img src="images/xi.jpg">
<img class="filter" src="images/xi.jpg">

网页中的选项卡

在一些门户网站中，为了在有限的网页空间中尽可能的展示更多的信息，会采用tab选项卡的方式。比如网易首页就使用了大量的选项卡。

下面学习几种实现tab选项卡的方式

虽然题目是表格，其实是想把之前的文本，列表，图片，表单结合一起写个简单的小例子。这次就写一个全国最大的同性交友网B站的登录页面吧,毕竟之前的页面写起来不过瘾

权侵删

结构分析

首先把原网页结构搞明白
最上面是header，header里左侧是一个由li组成的导航栏，右侧是搜索、登录、注册和投稿按钮。
header下面是一个宽度为100%的图片。暂时把它称为img_wraper吧。