用 Django 构建简易博客（五）：添枝加叶
在我建立这个网站之初，我就发了一个系列的博客《Django 博客系统开发》，当时的想法是将自己所学和所实践的一些东西整理一下、记录下来。时至今日，三年的时光已在眨眼间过去，我发现这几篇文章在我网站的访问量排行中依然居高不下。说明这几年大家对 Python 和 Django 的关注度确实比较高并且有很多新的开发者加入其中，这当然要数是一个非常好的趋势。但技术是不断发展的，特别 Python 和 Django 都一直处于快速发展期，当年的文章中提到的方法很多已不再适用。因此萌发了做一个更新的想法，让更多的朋友关注最新的技术，而不是面对一个旧版冥思苦想。
本文一共分为五篇。在前四篇中，我们已经实现了一个非常简易的博客，本文作为最后一篇则意在引导如何去“添枝加叶”让博客真正成为一个成型的网站。
拥抱灵活的流式布局
为什么使用流式布局流式布局可以满足不同分辨率的需求，特别是如今的移动设备和桌面设备在分辨率或是在视口大小上的差异都非常大，曾经经常使用的固定布局就会受到很大的局限。也许可以从媒体查询入手，不过它也具有局限性。那些仅使用媒体查询来适应不同视口的固定宽度设计，只会从一组CSS媒体查询规则突变到另一组，两者之间没有任何平滑，缺乏友好性。因此需要借助于百分比布局使网页呈现更为灵活，让页面元素根据视口大小在一个又一个媒体查询之间灵活伸缩修正样式。开始尝试通常，我们的设计都会在诸如Photoshop、FireWorks一类的软件中完成，其中度量元素的大小、边距或文字等都会以固定尺寸进行设计和标注。因...
WinPhone中IE的字体大小
在Windows Phone中，经常会看到网页中的文字被默认放大了，这可算是一个功能特色吧，不过时常会让页面变得很难看。关于这个功能的描述，微软官方网站中是这样描述的：Internet Explorer for Windows Phone gives developers the option to control the webpage text size by setting the–ms-text-size-adjust CSS property. When the user double-taps a page element, Internet Explorer fo...
深入解析CSS样式层叠权重值
本文为转载内容，源地址：http://www.ofcss.com/2011/05/26/css-cascade-specificity.html读到《重新认识CSS的权重》这篇，鬼哥在文章最后给出了便于记忆的顺序：“important > 内联 > ID > 类 > 标签 | 伪类 | 属性选择 > 伪对象 > 继承 > 通配符”那么这个顺序是怎么得出来的呢？实际上在CSS2规范关于具体性(specificity)的定义中，描述是非常明确的，但是很多中文版本的css图书中采用了10进制的简单相加计算方式（包括第一版《CSS权威指南》，第二版中已经...
学习记录：CSS选择器归纳
一、通配符选择器： 用于匹配任意元素或某元素下的所有元素。 示例：* {
margin: 0;
padding: 0;
} 兼容性：所有浏览器均支持。 二、ID选择器： 用于匹配含有制定id的元素。使用ID选择器之前需要在HTML元素上定义ID名。 示例：#left_nav&n...
解决IE6下png不能透明的问题
IE6是不能支持png的透明效果的，为了解决这个问题，我使用的是DD_belatedPNG，可以支持图片或背景。
1.首先下载DD_belatedPNG_0.0.8a-min.js（官方下载）；
2.上传到站点js目录下；
3.在页面中添加以下代码：
<!--[if IE 6]>
<script src="DD_belatedPNG.js"></script>
<script>
DD_belatedPNG.fix('...
解决IE6下div高度的问题
在IE6下如果对一个div需要设置很小的高度时，就会出现定义无效的情况。
这是因为当定义div的高度小于IE6下默认字体的大小时会自动“帮”你加宽，导致以上情况的出现。
解决方法是在CSS中定义一个overflow: hidden属性来，如：
#my_div {
height: 5px;
overflow: hidden;
}
常见的CSS简写规则
CSS简写也是代码优化中的一个重要的环节，这样有利于缩减CSS文件的大小，增加效率。
这里整理了一些常见的简写规则。
一、外边距（margin）：
margin-top、margin-right、margin-bottom、margin-left
简写顺序为顺时针方向（上、右、下、左），如：margin: 1px 2px 3px 4px;
其中四边都相等时可简写为一个，如：margin: 1px;
当上下、左右分别相等时，也可简写，如：margin: 1px 2px; 代表上下1px，左右2px
只有左右相等时，可简写为：margin: 1px ...
