写一个基本功能的购物网站，一个挑战杯的项目，首先想写的是后台的功能，然后是电脑版的前台页面。之后是手机版的前台页面（微信微网站）
使用的技术是django + bootstrap
要学习的太多了
django的基本功能还可以吧，主要的是逻辑的设计还有页面的设计。
业务逻辑慢慢的去想吧，前台设计现在就开始学习。
html + css + js + bootstrap的特色用法
http://www.w3school.com.cn/css/pr_padding-top.asp
-----------------
用.container包裹页面上的内容即可实现居中对齐。在不同的媒体查询阈值范围内都为container设置了width，用以匹配栅格系统。
注意，由于设置了padding 和 固定宽度，.container不能嵌套。
<div class="container"> ... </div>
为了确保适当的绘制和触屏缩放，需要在<head>之中添加viewport元数据标签。
<meta name="viewport" content="width=device-width, initial-scale=1.0">
在移动设备浏览器上，通过为viewport meta标签添加user-scalable=no可以禁用其缩放（zooming）功能。这样禁用缩放功能后，用户只能滚动屏幕，就能让你的网站看上去更像原生应用的感觉。注意，这种方式我们并不推荐所有网站使用，还是要看你自己的情况而定！
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
通过文本对齐class，可以简单方便的将文字重新对齐。
<p class="text-left">Left aligned text.</p> <p class="text-center">Center aligned text.</p> <p class="text-right">Right aligned text.</p>
强调class
这些class通过颜色来表示强调。也可以应用于链接，当鼠标盘旋于链接上时，其颜色会变深，就像默认的链接样式。
<p class="text-muted">...</p> <p class="text-primary">...</p> <p class="text-success">...</p> <p class="text-info">...</p> <p class="text-warning">...</p> <p class="text-danger">...</p>
鼠标悬停
利用.table-hover可以让<tbody>中的每一行响应鼠标悬停状态。
<table class="table table-hover"> ... </table>