18-----BBS论坛
BBS论坛(十八)
18.首页轮播图实现
(1)front/css/front_base.css
.main-container{
width: 990px;
margin: 0 auto;
overflow: hidden;
}
.lg-container{
width: 730px;
float:left;
}
.sm-container{
width: 250px;
float:right;
}
(2)front_base.html
<link rel="stylesheet" href="{{ url_for('static',filename='front/css/front_base.css') }}"> <div class="main-container">
{% block body %} {% endblock %}
</div>
(3)front_index.html
{% extends "front/front_base.html" %} {% block title %}
仙剑论坛
{% endblock %} {% block head %}
<link rel="stylesheet" href="{{ static('front/css/front_index.css') }}">
{% endblock %} {% block body %}
<div class="lg-container">
<div id="carousel-example-generic" class="carousel slide index-banner" data-ride="carousel">
<!-- 指示器 -->
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
</ol> <!-- 轮播图-->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="https://static-image.xfz.cn/1512989310_955.jpg" alt="...">
<div class="carousel-caption">
...
</div>
</div>
<div class="item">
<img src="https://static-image.xfz.cn/1528079965_535.jpeg" alt="...">
<div class="carousel-caption">
...
</div>
</div>
...
</div> <!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div> <div class="sm-container"> </div> {% endblock %}
(4)front/css/front_index.css
.index-banner{
border-radius: 10px;
overflow: hidden;
height: 190px;
} .index-banner img{
height: 190px;
}
- 18.首页轮播图实现
18-----BBS论坛的更多相关文章
- Python之路,Day17 - 分分钟做个BBS论坛
Python之路,Day17 - 分分钟做个BBS论坛 本节内容: 项目:开发一个简单的BBS论坛 需求: 整体参考"抽屉新热榜" + "虎嗅网" 实现不同 ...
- Python之路【第十八篇】Django小项目简单BBS论坛部分内容知识点
开发一个简单的BBS论坛 项目需求: 整体参考“抽屉新热榜” + “虎嗅网” 实现不同论坛版块 帖子列表展示 帖子评论数.点赞数展示 在线用户展示 允许登录用户发贴.评论.点赞 允许上传文件 帖子可被 ...
- python 学习笔记二十 django项目bbs论坛
项目:开发一个简单的BBS论坛 需求: 整体参考“抽屉新热榜” + “虎嗅网” 实现不同论坛版块 帖子列表展示 帖子评论数.点赞数展示 在线用户展示 允许登录用户发贴.评论.点赞 允许上传文件 帖子可 ...
- python第一百三十天 ---简单的BBS论坛
简单的BBS论坛 实现功能 git仓库地址:https://github.com/uge3/BBS 1.整体参考“抽屉新热榜” + “博客园” 2.实现不同论坛版块 3.帖子列表展示 4.个人博客主页 ...
- Django小项目简单BBS论坛
开发一个简单的BBS论坛 项目需求: 1 整体参考"抽屉新热榜" + "虎嗅网" 2 实现不同论坛版块 3 帖子列表展示 4 帖子评论数.点赞数展示 5 在线用 ...
- Python开发一个简单的BBS论坛
项目:开发一个简单的BBS论坛 需求: 整体参考“抽屉新热榜” + “虎嗅网” 实现不同论坛版块 帖子列表展示 帖子评论数.点赞数展示 在线用户展示 允许登录用户发贴.评论.点赞 允许上传文件 帖子可 ...
- bbs论坛浏览器兼容性问题
一直都是在chrome上进行调试,今天终于把bbs论坛这个项目搭建完了,进入IE.Firefox看了看 吓哭了!!! 火狐 Edge chrome 特别是加了<!DOCTYPE html> ...
- 开源BBS论坛软件推荐
七款开源BBS论坛软件推荐(1) 本文介绍了七个开源的BBS论坛软件(在英文界一般叫做Forum).可能国内的朋友们比较熟悉Discuz!和PHPwind,但其实我们的选择还是很多的,而且下面介绍的这 ...
- LNMP环境搭建BBS论坛及伪静态
我们在mysql备份 LNMP环境中的数据库迁移为独立的服务器的基础上搭建BBS论坛: [root@bqh-117 ~]# mysql -uroot -p123456 Welcome to the ...
- Django项目 BBS论坛
BBS论坛 一.项目表分析 二.自定义form组件 三.注册功能 四.BBS论坛 登录功能
随机推荐
- 前端学习笔记2017.6.12 HTML的结构以及xhtml、html、xml的区别
HTML的结构 一个HTML文档可分为几个部分,如下图所示: DOCTYPE部分.head部分和body部分 DOCTYPE部分,这个很重要,可以理解为不同的DOCTYPE意味着不同的html标准,因 ...
- C语言访问网页
一.理论 http://www.zixue7.com/thread-3860-1-1.html
- parseXXX的用法
转换字符串. parseXXX是Integer类.等基本数据类型包装类的方法,用于实现String和int型数据的转换.例如, Integer.getInteger(String s) 从字符串中获取 ...
- 100722E The Bookcase
传送门 题目大意 给你一些书的高度和宽度,有一个一列三行书柜,要求放进去书后,三行书柜的高的和乘以书柜的宽度最小.问这个值最小是多少. 分析 我们可以先将所有书按照高度降序排好,这样对于每一层只要放过 ...
- Entity Framework Tutorial Basics(12):Model First
Model First development with Entity Framework: In the Model First approach, you create Entities, rel ...
- SDUT 3402 数据结构实验之排序五:归并求逆序数
数据结构实验之排序五:归并求逆序数 Time Limit: 40MS Memory Limit: 65536KB Submit Statistic Problem Description 对于数列a1 ...
- spark 1.5的hivecontext的问题
spark升级到1.5,里面的hive版本升级到1.2.1版本,我写了如下的代码 object SQLApp extends App{ val sparkconf = new SparkConf(). ...
- Python中list常用的10个基本方法----list的灰魔法
########################list 的常用的10个基本方法################################## list 类 列表# 1 列表的基本格式#2 可以 ...
- HDU 5033 Building (维护单调栈)
题目链接 题意:n个建筑物,Q条询问,问所在的位置,看到天空的角度是多少,每条询问的位置左右必定是有建筑物的. 思路 : 维护一个单调栈,将所有的建筑物和所有的人都放到一起开始算就行,每加入一个人,就 ...
- DNS线路
文章介绍 填写DNS地址时候,比较好记的就114.114.114.114,8.8.8.8,9.9.9.9,几个,但是常用的有哪些呢?这篇文章就简单介绍下了. 前言 两年多前,曾发帖对国内主流公共 DN ...