Diff for "UliwebCssFile" - Woodpecker Wiki for CPUG

Differences between revisions 2 and 3

作者： limodou

TableOfContents

题目要求

CSS文件的引用，在模板中引入default.css

框架说明

Uliweb (http://code.google.com/p/uliweb)

步骤

在命令行下操作

创建Project4项目

uliweb makeproject project4

创建Hello App

cd project4
uliweb makeproject Hello

修改project4/apps/Hello/views.py

   1 @expose('/')
   2 def index():
   3     return {}

在project4/apps/Hello/templates下创建index.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <title>Hello World</title>
  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
  <link rel="stylesheet" type="text/css" href="{{= url_for_static('default.css') }}">
</head>
<body>
<h1>CSS Test</h1>
</body>
</html>

生成 default.css

创建project4/apps/Hello/static/default.css文件，内容为：

h1 {border:1px solid #f00;}

添加uliweb.contrib.staticfiles App

Uliweb已经提供了静态文件的处理，修改 apps/settings.ini 文件中的INSTALLED_APPS如下：

   1 INSTALLED_APPS = [
   2     'uliweb.contrib.staticfiles',
   3     'Hello',
   4     ]

结束

测试

cd project4
uliweb runserver

访问 http://localhost:8000/

结果如下：

attachment:image.jpg

-  ⇤ ← Revision 2 as of 2009-10-13 06:01:55 → 
  Size: 1429
  Editor: limodou
  Comment:
+   ← Revision 3 as of 2009-10-13 06:35:05 → ⇥
  Size: 1472
  Editor: limodou
  Comment:
-Deletions are marked like this.
+Additions are marked like this.
 Line 83:
+结果如下：

attachment:image.jpg