python测试开发django -141.Bootstrap 面板(Panels)
前言
面板组件用于把 DOM 组件插入到一个盒子中。创建一个基本的面板，只需要向
基础面板
不带标题的基本面板
<div class="container"><div class="panel panel-default"><div class="panel-body">这是一个基本的面板，没有标题</div></div>
</div>
显示效果
面板标题
通过以下两种方式来添加面板标题：
- 使用 .panel-heading class 可以很简单地向面板添加标题容器。
- 使用带有 .panel-title class 的
-
来添加预定义样式的标题。
panel-heading标题面板
<div class="panel panel-default"><div class="panel-heading">不带 title 的面板标题</div><div class="panel-body">面板内容</div>
</div>
带panel-title 的面板
<div class="panel panel-default"><div class="panel-heading"><h3 class="panel-title">带有 title 的面板标题</h3></div><div class="panel-body">面板内容</div>
</div>
面板脚注
面板分3个部分：标题，内容，脚注
<div class="panel panel-default"><div class="panel-heading"><h3 class="panel-title">面板标题</h3></div><div class="panel-body">这是一个基本的面板</div><div class="panel-footer">作者：张无忌</div>
</div>显示效果
添加颜色
添加panel-primary，panel-success， panel-info，panel-warning，panel-danger添加不同颜色
<div class="panel panel-primary"><div class="panel-heading"><h3 class="panel-title">面板标题</h3></div><div class="panel-body">这是一个基本的面板</div>
</div>
<div class="panel panel-success"><div class="panel-heading"><h3 class="panel-title">面板标题</h3></div><div class="panel-body">这是一个基本的面板</div>
</div>
<div class="panel panel-info"><div class="panel-heading"><h3 class="panel-title">面板标题</h3></div><div class="panel-body">这是一个基本的面板</div>
</div>
<div class="panel panel-warning"><div class="panel-heading"><h3 class="panel-title">面板标题</h3></div><div class="panel-body">这是一个基本的面板</div>
</div>
<div class="panel panel-danger"><div class="panel-heading"><h3 class="panel-title">面板标题</h3></div><div class="panel-body">这是一个基本的面板</div>
</div>
显示效果
python测试开发django -141.Bootstrap 面板(Panels)相关推荐
- python测试开发django（8）--django连接mysql
前言 Django对各种数据库提供了很好的支持,包括:PostgreSQL.MySQL.SQLite.Oracle.本篇以mysql为例简单介绍django连接mysql进行数据操作 Django连m ...
- python测试开发django（9）--模型models详解
前言 Django模型是与数据库相关的,与数据库相关的代码一般写在models.py中,Django支持sqlite3,MySQL,PostgreSQL等数据库 只需要在settings.py中配置即 ...
- python测试开发django（20）--admin首页和title修改
前言 django的admin首页默认显示的"Django管理",title显示的是"Django站点管理员",这里的文案内容可以修改成自己项目的后台页面内容 ...
- 可爱的python测试开发库及项目(python测试开发工具库汇总)
转载: https://www.jianshu.com/p/ea6f7fb69501 可爱的python测试开发库及项目(python测试开发工具库汇总) github地址 相关书籍下载 Python ...
- 可爱的python测试开发库(python测试开发工具库汇总)
2019独角兽企业重金招聘Python工程师标准>>> 欢迎转载,转载请注明来源: github地址 谢谢点赞 本文地址 Python测试开发库 参考资料 https://githu ...
- python测试开发自学教程-2019第一期《python测试开发》课程，10月13号开学
2019第一期<python测试开发>课程,10月13号开学! 主讲老师:上海-悠悠 上课方式:QQ群视频在线教学,方便交流 本期上课时间:10月13号-12月8号,每周六.周日晚上20: ...
- Python测试开发django5.urls.py参数name与a标签的引用
上一篇,我们学习了Python测试开发django5.templates模板变量传参 如果我们有2个页面home.html和demo.html,两个页面是独立的没有关系的,现在需要从home.html ...
- Python测试开发django5.templates模板变量传参
上一篇,我们学习了Python测试开发django4.templates模板配置 templates模板中html文件是一个静态页面,写四的,如果有时我们想动态的传入一些不同的参数,想实现在一个固定的 ...
- Python测试开发django4.templates模板配置
[上一篇]我们讲了Python测试开发django3.视图和URL配置 今天详细介绍下 Django 模板的应用,模板是一个文本,用于分离文档的表现形式和内容. 我们已经知道创建项目用django-a ...
最新文章
- 方法的运用_企业如何运用论坛做营销，千享科技分享技巧方法
- python-range用法
- block 实现原理详解（一）
- AtCoder Regular Contest 100 E - Or Plus Max Sos dp
- window xp系统安装php环境_Windows Server 2003及XP系统如何安装SQL Server 2000数据库？
- java收发邮寄_JavaMail收发邮件的一般流程与主要方法
- SpingMVC Model 和ModelAndView，以及从参数的设置和接收
- 省赛模拟一 又一道简单题
- JavaWeb开发——软件国际化(动态元素国际化)
- Spotlight搜索技巧
- 企业微信后台应用配置步骤
- SQL学习之now()函数
- 不要签名证书将网页打包封装成苹果APP，无需苹果企业签名，IPA证书签名，ios签名证书，免越狱安装...
- c语言搬石头 有100块石头,成语大挑战 一个人搬着一块大石头 答案是什么成语...
- Word 使用技巧大全
- w10系统excel无法启动服务器,w10excel无法打开怎么办_解决win10系统无法打开excel的方法...
- 周济来了，“牛皮癣”走了
- matlab描述统计分析步骤,MATLAB实现描述性统计分析的例子例题
- U7 Ubuntu系统的U盘启动与安装-孙宇彤-专题视频课程
- java魔方游戏代码_Java 3D魔方