文档章节

Django + Bootstrap 创建blog

R
 RabbitZack
发布于 2016/04/12 00:00
字数 398
阅读 53
收藏 0
点赞 1
评论 0

首先是制作home,也就是网站的首页。

由于Djangotemplates可以包含基础(暂时先跳过)。

简单来讲就是base.html中有navibar、content和footer等block,由于每个页面都有导栏和尾栏,所以使用{% include %}包含以便复用navibar和footer。

 

简单记录怎么在html中使用bootstrap的导航栏自己不知道,查到的点:

1)bootstrap有专门的导航栏实例,直接copy和paste即可(详见http://v3.bootcss.com/components/#navbar)。

2)如果使用响应式下拉导航条,需要在script标签加jQuery的js(需在bootstrap的js前)。

3)如果使用的标签不是nav而是div需要制定role是navigation。

4)增加一层div为container可以是导航栏有居中的效果

5)增加注册、登陆按钮,可以新建一个navbar-form,然后再在里面建立a标签,例如:

<form class="navbar-form navbar-right">
        <a class="btn btn-primary" href="https://beta.umbreo.com/login">Log In</a>
        <a class="btn btn-primary" href="https://beta.umbreo.com/signup">Sign Up</a>
    </form>

6)靠右,如果有多个class有.navbar-right,则前面的在后面的右边。

 

ps:补充css学到的一个水平居中的知识点:

    如果是块元素居中,设置style为

width: auto; display: table; margin-left: auto; margin-right: auto

    如果是行内元素,使用

text-align: center

就可以了

遗留问题:

1)品牌图标嵌入导航栏,导航条不居中。

2)pycharm总是不识别utf-8的中文,改了配置还不行。

 

项目发到github的远程目录上了,改天再看弄到自己的目录下吧

© 著作权归作者所有

共有 人打赏支持
R
粉丝 0
博文 1
码字总数 398
作品 0
朝阳
Ubuntu利用Django框架快速搭建网站

前言 Django是一个开源的Web应用框架,由Python写成,它的主要目标是使得开发复杂的、数据库驱动的网站变得简单。Django采用MVC设计模式注重组件的重用性和“可插拔性”,敏捷开发和DRY法则(...

初雪之音
2016/08/02
126
0
Python+Django+Boostrap搭建个人Blog-Part01开发环境及安装

最近看到很多人,都在用python搭建自己的博客。通过python+Django+git,or发布在云平台上。对于一个目标为全栈工程师的测试开发人员来说,这个搭个自己的Blog也不算装13了吧!接下来的整个开...

丰_申
2016/08/21
778
0
django1.8引用bootstrap创建响应式登录界面

最近在鼓捣django,学了几天的html。在网上发现bootstrap这个好东西。刚好最近要搞个B/S模式的管理平台。css还没有学,html还不熟,走了很多弯路,发现其实很简单的说。由于是django新手,参...

落叶刀
2015/11/08
0
0
python + django + bootstrap 快速web开发初探

Python 是一种面向对象、解释型计算机程序设计语言,由Guido van Rossum于1989年底发明,第一个公开发行版发行于1991年。Python语法简洁而清晰,具有丰富和强大的类库。 Django 是一个开放源...

dchuang
2014/11/17
0
0
liufeily/sadmin

#Sadmin ###版本: python v2.6 django v1.6 Bootstrap v3.2.0 ###部署(linux): 1.安装django 1.6 2.将项目解压在任意目录下,进入项目目录 3.同步数据库,需要先创建好数据库,数据库连接信...

liufeily
2015/03/14
0
0
最全的 Twitter Bootstrap 开发资源清单

Bootstrap是Twitter推出的一个开源的用于前端开发的工具包,由Twitter的设计师Mark Otto和Jacob Thornton合作开发。Bootstrap提供了优雅的HTML和CSS规范,它由动态CSS语言LESS写成,与CSS框架...

Jeky
2012/11/29
15K
48
Python+Django+Boostrap搭建个人Blog-Part02 Django简介及bootstrap引用

一、Django 简介 1.1Django是什么? 原本想自己去写这块,但是既然有《Django Book》这么好的资源,那就不必再去浪费这个好的资源了对吧。废话少说,什么是Django? 根据Django Book 3.0中的解...

丰_申
2016/09/15
624
0
billvsme/vmaig_blog

vmaig.com 网站源码 #有问题欢迎加qq群 vmaig qq群: 458788510 我的qq: 994171686 #更新日志 2015/5/15 从django1.6 升级到 django1.8 (还保留django1.6分支) 2015/6/21 添加xadmin分支,xadm...

billvsme
2015/05/10
0
0
Html+JS+PowerShell打造Web版AD管理系统

QQ群里的Evan童鞋分享了一个利用Flask 调用 Powershell API 实现的运维管理系统。可惜现在该分享被删除了。很喜欢,所以也依样画葫芦做了一个。 后来发现豆子同学实现了一个django的,http:...

tliursc
01/11
0
0
在django项目中加入像bootstrap这样的css,js等静态文件

在django中,urls.py将URL请求转给view.py中的函数,函数将计算后的结果转给templates中的某个xxx.html文件,最后xxx.html文件发给了客户,在客户的页面显示出来,这里,我总结下我怎么在htm...

我的去哈哈
2014/02/16
0
1

没有更多内容

加载失败,请刷新页面

加载更多

下一页

sklearn学习笔记之简单线性回归

简单线性回归 线性回归是数据挖掘中的基础算法之一,从某种意义上来说,在学习函数的时候已经开始接触线性回归了,只不过那时候并没有涉及到误差项。线性回归的思想其实就是解一组方程,得到...

wangxuwei
6分钟前
0
0
feign之动态interceptor(二)

背景 上文提到了按照不同的feignClient可以根据多个不同的key来进行多个不同的bean的配置 那么我们如何完成多个interceptor的配置呢? 分析 我们刚提到多个配置的玄机就在FeignClientProper...

Mr_Qi
8分钟前
1
0
Linux Kernel 4.16 系列停止维护,用户应升级至 4.17

知名 Linux 内核维护人员兼开发人员 Greg Kroah-Hartman 近日在发布 4.16.18 版本的同时,宣布这是 4.16 系列的最后一个维护版本,强烈建议用户立即升级至 4.17 系列。 Linux 4.16 于 2018 年...

问题终结者
32分钟前
0
0
Apache配置时.htaccess失效不起作用的原因分析

.htaccess 失效的原因 1. 重写规则有问题,检查自己的重写规则 2.Apache配置问题,配置中没有配置启用 rewrite a2enmod rewrite 3.网站配置文件没有启用配置需要配置 000-default.conf <Dire...

TU-DESGIN
52分钟前
1
0
两个求最大公约数C/C++算法实现

#include<stdio.h> #include<time.h> #include <iostream>using namespace std;//求最大公约数 LCD(Largest Common Division)//短除法 //m=8251, n=6105; int LCD_ShortDiv(int m, ......

失落的艺术
58分钟前
1
0
QueryPerformanceCounter

windows的Sleep函数,睡眠线程指定毫秒数,可以用来做毫秒延时。 对于微秒延时,没有一个现成的函数,但是可以通过 QueryPerformanceFrequency QueryPerformanceCounter 来间接实现。原理就是...

开飞色
今天
1
0
log4j2使用AsyncRoot不显示行号问题处理

<AsyncRoot level="info" includeLocation="true"> <AppenderRef ref="File"/></AsyncRoot><!--1.异步logger,还需要在pom.xml中添加disruptor的依赖。2.includeLocation结合异......

小翔
今天
3
0
安卓手机上 K 歌,声音延迟怎么解决?

这篇文章可以为你提供一个解决录音和播放同步问题的思路,而且解决了声音从手机传输到耳机上有延时的问题。 初识音频 在开始之前,我先简单介绍一下音频相关的基础知识,方便下文理解。 我们...

编辑部的故事
今天
2
0
使用token实现在有效期内APP自动登录功能

使用token实现在有效期内APP自动登录功能 http://sevennight.cc/2016/07/19/auto_login_impl.html

风云海滩
今天
3
0
Spring Boot集成RabbitMQ发送接收JSON

默认情况下RabbitMQ发送的消息是转换为字节码,这里介绍一下如何发送JSON数据。 ObjectMapper 最简单发送JSON数据的方式是把对象使用ObjectMapper等JSON工具类把对象转换为JSON格式,然后发送...

小致dad
今天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部