Bootstrap入门学习笔记(只记录了效果)
基本头文件
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 实例</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<h1>我的第一个 Bootstrap 页面</h1>
<p>这是一些文本。</p>
</div>
</body>
</html>
容器类
container 固定宽度支持相应布局的容器
container-fluid 类似于100%宽度，占全部视窗的容器
display这个字体有点好看，可以使用。
文字排版
- display 标题样式
- small 小文本
- mark 高亮
- abbr 虚线边框
- dl 二级标题
- code 代码
- kdb 按键高亮
- pre 文本段
- 左对齐 文本
颜色
- https://www.runoob.com/try/try.php?filename=trybs4_txt_colors
- 背景颜色https://www.runoob.com/try/try.php?filename=trybs4_txt_bgcolors
表格
https://www.runoob.com/try/try.php?filename=trybs4_table_basic
条纹表格 挺好看 table thread标题行 tbody普通行 tr行 td单项
table class="table table-bordered" 边框表格
鼠标悬停
黑色背景表格
黑色条纹表格
鼠标悬停 黑色背景表格
指定颜色
图像形状
圆角图片
椭圆图片
缩略图
可以设置对齐方式
响应式图片 class="classname1 classname2" 好！！
Jumbotron
- 菜鸟教程的灰框
信息提示框
- vjudge上的提示框
- 关闭提示框
- 关闭提示框动画
按钮
进度条
- 动画进度条
分页
- 可以进行分页
- 当前页码可以高亮表示
列表组
- 激活状态
- 禁用
- 链接
- 颜色
卡片
- 可以用卡片来放小说吗？
- 标题文本和链接 牛逼！！！！
- 图片 卡片 牛逼！！！
- 还可以文字覆盖图片
下拉菜单
- 分割线
- 还有标题
- 禁用
- 改变方向
- 按钮中的下拉菜单
折叠
- 手风琴实例
导航
- 选项卡
- 胶囊导航
- 都有下拉菜单
- 动态选项卡
表单
- 注册表单
- 评论模板
- 复选框
- 表单下拉菜单
- 输入框组 大小
轮播
模态框
- 设置，让你提交的
提示框
滚动监听
提醒章节
弹性盒子
可以左对齐 右对齐
多媒体对象
- 基础多媒体对象可以有
Bootstrap入门学习笔记(只记录了效果)的更多相关文章
- Hadoop入门学习笔记---part3
2015年元旦,好好学习,天天向上.良好的开端是成功的一半,任何学习都不能中断,只有坚持才会出结果.继续学习Hadoop.冰冻三尺,非一日之寒! 经过Hadoop的伪分布集群环境的搭建,基本对Hado ...
- Sass简单、快速上手_Sass快速入门学习笔记总结
Sass是世界上最成熟.稳定和强大的专业级css扩展语言 ,除了Sass是css的一种预处理器语言,类似的语言还有Less,Stylus等. 这篇文章关于Sass快速入门学习笔记. 资源网站大全 ht ...
- dubbo入门学习笔记之入门demo(基于普通maven项目)
注:本笔记接dubbo入门学习笔记之环境准备继续记录; (四)开发服务提供者和消费者并让他们在启动时分别向注册中心注册和订阅服务 需求:订单服务中初始化订单功能需要调用用户服务的获取用户信息的接口(订 ...
- Three入门学习笔记整理
一.官方网站:https://threejs.org 二.关于Three.js 三.开始 四.实例 基本结构 结果 五.概念 坐标系 场景 相机 灯光 3D模型 六.简单动画 七.交互控制 结束 # ...
- Hadoop入门学习笔记---part4
紧接着<Hadoop入门学习笔记---part3>中的继续了解如何用java在程序中操作HDFS. 众所周知,对文件的操作无非是创建,查看,下载,删除.下面我们就开始应用java程序进行操 ...
- PyQt4入门学习笔记（一）
PyQt4入门学习笔记(一) 一直没有找到什么好的pyqt4的教程,偶然在google上搜到一篇不错的入门文档,翻译过来,留以后再复习. 原始链接如下: http://zetcode.com/gui/ ...
- Hadoop入门学习笔记---part1
随着毕业设计的进行,大学四年正式进入尾声.任你玩四年的大学的最后一次作业最后在激烈的选题中尘埃落定.无论选择了怎样的选题,无论最后的结果是怎样的,对于大学里面的这最后一份作业,也希望自己能够尽心尽力, ...
- Scala入门学习笔记三--数组使用
前言 本篇主要讲Scala的Array.BufferArray.List,更多教程请参考:Scala教程 本篇知识点概括 若长度固定则使用Array,若长度可能有 变化则使用ArrayBuffer 提 ...
- OpenCV入门学习笔记
OpenCV入门学习笔记 参照OpenCV中文论坛相关文档(http://www.opencv.org.cn/) 一.简介 OpenCV(Open Source Computer Vision),开源 ...
随机推荐
- 第7章 使用springMVC构建Web应用程序 7.1 springMVC配置
最近在看spring in action第3版,这里搭建一个简单的spring mvc,也算书没白看,当然老鸟可以不屑了,这里只是给自己做个笔记,配置也尽量删烦就简, Spring MVC的核心是Di ...
- StackOverflow 周报 - 与高关注的问题过过招（Java）
本篇文章是 Stack Overflow 周报的第二周,共收集了 4 道高关注的问题和对应的高赞回答.公众号「渡码」为日更,欢迎关注. DAY1. serialVersionUID 的重要性 关注: ...
- Fire Balls 07——砖块的淡出，消失以及砖塔的下落
版权申明: 本文原创首发于以下网站: 博客园『优梦创客』的空间:https://www.cnblogs.com/raymondking123 优梦创客的官方博客:https://91make.top ...
- 手机端apk文件安装
1.电脑端下载豌豆荚 2.手机连接电脑,打开手机USB调试模式(设置->开发人员选项,打开开发人员选项和USB调试) 3.在电脑中双击下载好的apk文件,即可打开豌豆角,然后便可安装到手机.
- hdu-6644 11 Dimensions
题目链接 11 Dimensions Problem Description 11 Dimensions is a cute contestant being talented in math. On ...
- codeforces 816 D. Karen and Test（逆元+思维+组合数）
题目链接:http://codeforces.com/contest/816/problem/D 题解:显然一看到这题应该会想到是有什么规律的于是多写几项就会发现偶数列之间是有关系的. 满足a[i][ ...
- 基于 APIGateway 打造生产级别的 Knative 服务
作者 | 阿里云智能事业群高级开发工程师 元毅 导读:在实际应用中,通过 APIGateway(即 API 网关),可以为内部服务提供保护.提供统一的鉴权管理.限流.监控等能力,开发人员只需要关注内 ...
- CentOS配置服务开机自启
本例子以nginx作为举例: CentOS7中 以systemctl 替代了chkconfig 进行服务的管理, 默认在CentOS6 中控制服务开机自启,是在vim /etc/rc.d/rc.loc ...
- Day004作业
1,写代码,有如下列列表,按照要求实现每⼀一个功能li = ["alex", "WuSir", "ritian", "barry& ...
- 基于soot的java方法名生成报告
0.生成XML格式文件 笔者使用soot将java文件解析生成xml格式文档,具体操作流程不再赘述.本文讨论执行结果的用途.笔者第一次采用的java文件如下:文件名为test.java 用soot解析 ...