Bootstrap学习记录

Bootstrap学习记录-1.Navigation

Bootstrap中的导航栏功能需要添加bootstrap.css.jquery.js.bootstrap.js,其中,jquery.js文件是bootstrap.js文件中必须的,否则就会抛出异常信息:Bootstrap\'s JavaScript requires jQuery. 1. 工作原理学习Navbar之前,学习知道以下知识点: nav标签必须使用.navbar..navbar-expand{-sm|-md|-lg|-xl}.颜色主题类进行装饰. 导航栏内容默认是流动布局,可以使用…

积跬步，聚小流------Bootstrap学习记录(2)

现阶段开启每一次新的征程,已然离不开"Hello World"的习惯仪式.这次自然也不例外.先来看下给出的官网给出的演示样例: 1.bootstrap官网提供的html基本模板代码 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible&qu…

bootstrap学习记录（慕课网教程）

1.当主标题下需要副标题时可在h中嵌套small<h1>nihao<small>a</samll></h1> 2.当某一段落需要突出显示时可添加lead类,其作用就是增大文本字号,加粗文本,而且对行高和margin也做相应的处理 class="lead" 3.在普通的元素中我们一般通过font-weight设置为bold关键词给文本加粗.在Bootstrap中,可以使用<b>和<strong>标签让文本直接加粗.…

Bootstrap学习记录-3.Badge、Breadcrumb、Buttons、 Button Group、Card、Carousel

1. Badge Badge作为数值标记组件,它能作为链接或按钮的一部分来提供计数作用,而且它通过使用相对字体大小来适应父级元素的大小.它的最基本的修饰符为.badge .badge-*. <button type="button" class="btn btn-primary"> Notifications <span class="badge badge-light">4</span> </butto…

Bootstrap学习记录-2.container和table

1. Container Bootstrap中容器类提供了2个类标识:container.container-fluid. 两者的区别在于: container:容器不止有15px的padding,还有一个随着浏览器宽度变化而变化的margin.container-fluid:只有固定的15px的padding. 因此,container类的自适应是通过修改margin的改变来完成的,而container-fluid类的百分百宽度是指在固定的15px的padding前提下宽度总是当前视窗的宽度.…

中文官网 Bootstrap 插件 Bootstrap Multiselect bootstrap-multiselect 的简单使用,样式修改,动态创建option JS组件系列——Bootstrap Select2组件使用小结基于Metronic的Bootstrap开发框架经验总结(3)--下拉列表Select2插件的使用 JS组件系列——两种bootstrap multiselect组件大比拼 JS组件系列——再推荐一款好用的bootstrap-select组件,亲测还不错 bootst…

积跬步，聚小流------Bootstrap学习记录(3)

响应式作为Bootstrap的一大特色.栅格系统可谓是功不可没,既然如此,那我们就来看一下栅格系统是怎样帮助bootstrap实现响应式布局的呢? 1.什么是栅格系统我们能够从Bootstrap的官网上找到比較官方的回答:Bootstrap提供了一套响应式.移动设备优先的流失栅格系统,随着屏幕或视口(viweport)的添加,系统会自己主动分为最多12列. 它包括了易于使用的提前定义类,还有强大的mixin用于生成更具语义的布局. 这样的说法是比較精准并且明了的.可是还能够更通俗一点的来解释:…

积跬步，聚小流------Bootstrap学习记录(1)

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center"> 1.什么是bootstrap? 2011年8月 Twitter推出的开源的整套前端解决方式简单了说:用以创建web页面的html.css.javascript的前端工具集再简单了说:给对应的结构写好了对应的样式和行为,直接调用就…

Bootstrap 我的学习记录3 导航条理解

以下理论内容copy自Bootstrap中文网 (一个不错的bootstrap学习网站) 导航条默认样式的导航条导航条是在您的应用或网站中作为导航页头的响应式基础组件.它们在移动设备上可以折叠(并且可开可关),且在视口(viewport)宽度增加时逐渐变为水平展开模式. 以下代码和注释是我学习过程中的理解 (注意引入必要的.css 和 .js查看) <!DOCTYPE html> <html lang="zh-CN"> <head> <m…

Bootstrap 我的学习记录2 栅格系统初识

以下理论内容copy自bootstrap中文网(一个不错的bootstrap学习网站). 栅格系统 Bootstrap 提供了一套响应式.移动设备优先的流式栅格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列.它包含了易于使用的预定义类,还有强大的mixin 用于生成更具语义的布局. 简介栅格系统用于通过一系列的行(row)与列(column)的组合来创建页面布局,你的内容就可以放入这些创建好的布局中.下面就介绍一下 Bootstrap 栅格系统的工作原理: "行(…

Spring Boot学习记录(二)--thymeleaf模板 - CSDN博客

==他的博客应该不错,没有细看 Spring Boot学习记录(二)--thymeleaf模板 - CSDN博客 http://blog.csdn.net/u012706811/article/details/52185345 --关于springboot的 springboot - 蜕变之路 - CSDN博客http://blog.csdn.net/u012706811/article/category/6357760 自从来公司后都没用过jsp当界面渲染了,因为前后端分离不是很好,反而模板引…

区块链Hyperledger Fabric 学习记录（一）开发环境搭建（ubuntu16.04/ubuntu18.04）

目录 Fabric开发环境搭建更新说明教程环境及软件版本 Docker 安装Docker 配置用户组配置Aliyun Docker加速器安装docker-compose Go 下载源码安装源码 Node.js && NPM Node.js源码安装安装Python 安装Fabric范例.源码和Docker镜像总结 Fabric开发环境搭建 Author:ljo0412@live.com 更新说明在根据Fabric手册进行学习的过程中,遇到了一个严重的问题,导致无法向下继续,总…

ansible 学习记录

Ansible 的重新学习记录这里我的Ansible的宿主机是centos 7.2系统,这里我通过yum 安装Ansible 1.配置epel源 sudo yum -y install epel-release 2.安装Ansible sudo yum -y install ansible 3.安装pip mkdir /data/tools && cd /data/tools wget --no-check-certificate https://bootstrap.pypa.io/ez…

SpringCloud基础教程学习记录

这个学习记录是学习自翟永超前辈的SpringCloud的基础教程. 自己写这个教程的目的主要是在于,想要更凝练总结一些其中的一些实用点,顺便做个汇总,这样自己在复习查看的时候更加方便,也能顺着自己的思路走. 在这里感谢一下翟永超前辈的教程与分享,希望自己以后有一定积累后,也能成为一个优秀的开源分享人. 注:pom文件可以去原链接找,顺便给前辈的网站增加访问量. 第一章服务注册与发现(基于eureka) 微服务框架(这个基于自己理解,可能会有错误,欢迎指正) 微服务框架:前一阵公司刚刚做了一个小的…

【Bootstrap5】精细学习记录

[Bootstrap5]精细学习记录 Bootstrap模板 <!DOCTYPE html> <html> <head> <title>Bootstrap 模板</title> <meta name="viewport" content="width=device-width, initial-scale=1.0">  <link hr…

Quartz 学习记录1

原因公司有一些批量定时任务可能需要在夜间执行,用的是quartz和spring batch两个框架.quartz是个定时任务框架,spring batch是个批处理框架. 虽然我自己的小玩意儿平时不需要定时任务,但是我觉得这个框架还是蛮有意思的,所以就打算来研究学习一下.记录分享一下我的学习记录. 另外网上有的一些定时任务的时间CRON怎么配置什么的我就不介绍了...烂大街了...我就说说我的理解. 与Spring整合现在可能不太有不用Spring的地方了吧..Spring与quartz整合…

Java 静态内部类与非静态内部类学习记录.

目的为什么会有这篇文章呢,是因为我在学习各种框架的时候发现很多框架都用到了这些内部类的小技巧,虽然我平时写代码的时候基本不用,但是看别人代码的话至少要了解基本知识吧,另外到底内部类应该应用在哪些场合,我并不是很清楚,留下一些值得思考的问题作为记录,说不定以后能自己来填.于是就会有这篇文章啦. 常规使用方法我也不想介绍,网上一大把,我就说说比较容易错的,值得注意的地方. 注意这篇文章只是分享一下我对内部类的一些研究与困惑吧,说不定对大家有帮助,说不定能引导大家一起思考学习.Java语法知识其实…

Apache Shiro 学习记录4

今天看了教程的第三章...是关于授权的......和以前一样.....自己也研究了下....我觉得看那篇教程怎么说呢.....总体上是为数不多的精品教程了吧....但是有些地方确实是讲的太少了....而这些地方又是蛮难的..比如3.5节Authorizer.PermissionResolver及RolePermissionResolver...可能作者觉得讲清楚要花太多的篇幅涉及太多的类吧.....但是我看起来就很不爽0.0....既然提到了就想弄明白.....不然太纠结了....所以就有了这篇…

UWP学习记录12-应用到应用的通信

UWP学习记录12-应用到应用的通信 1.应用间通信 “共享”合约是用户可以在应用之间快速交换数据的一种方式. 例如,用户可能希望使用社交网络应用与其好友共享网页,或者将链接保存在笔记应用中以供日后参考. 如果你的应用需要为处于另一个应用的上下文中的用户快速完成内容接收,则可以考虑使用“共享”合约. 应用可以通过两种方式支持“共享”功能. 首先,应用可以是提供用户要共享的内容的源应用. 其次,应用可以是用户选择作为共享内容目标的目标应用. 一个应用也可以既是源应用,也是目标应用. 如果你希望你的…

UWP学习记录11-设计和UI

UWP学习记录11-设计和UI 1.输入和设备通用 Windows 平台 (UWP) 中的用户交互组合了输入和输出源(例如鼠标.键盘.笔.触摸.触摸板.语音.Cortana.控制器.手势.注视等)以及支持扩展体验(包括鼠标滚轮和按钮.笔橡皮擦.筒状按钮.触摸键盘和后台应用服务)的各种模式或修饰符. 具体各种输入的详细处理方法,以后用到的时候再深入. 通用 Windows 平台 (UWP) 应用也支持很多种设备,了解支持的设备将帮助你提供每个外形规格的最佳用户体验. 针对特定设备进行设计时,主要…

UWP学习记录10-设计和UI之控件和模式7

UWP学习记录10-设计和UI之控件和模式7 1.导航控件 Hub,中心控件,利用它你可以将应用内容整理到不同但又相关的区域或类别中. 中心的各个区域可按首选顺序遍历,并且可用作更具体体验的起始点. 中心的内容可以显示在全景视图中,这样用户一眼就能看见新增内容.可用功能和相关信息. 中心通常具有一个页标题,每个内容部分各有一个部分标题. Pivot,透视表控件,用于导航经常访问的不同内容类别. 透视表允许在两个或多个内容窗格之间进行导航,并且依靠文本标题来表明内容的不同部分. SemanticZ…

UWP学习记录9-设计和UI之控件和模式6

UWP学习记录9-设计和UI之控件和模式6 1.图形和墨迹 InkCanvas是接收和显示墨迹笔划的控件,是新增的比较复杂的控件,这里先不深入. 而形状(Shape)则是可以显示的各种保留模式图形对象,例如椭圆.矩形.直线.贝塞尔曲线等,Path 是最通用的 Shape,因为使用它可以定义任意几何图形.图形这块,是和wpf一样的. 2.布局控件布局控件这块,大体上也是和wpf一样的.布局控件包含边框(Border).画布(Canvas).网格(Grid).RelativePanel.Stack…

UWP学习记录8-设计和UI之控件和模式5

UWP学习记录8-设计和UI之控件和模式5 1.日历.日期和时间控件日期和时间控件提供了标准的本地化方法,可供用户在应用中查看并设置日期和时间值. 有四个日期和时间控件可供选择,选择的依据如下: 日历日期选取器是一个下拉式控件,该控件已针对从日历视图中选取某个日期进行了优化,尤其是能够显示诸如星期几或丰富的日历信息等上下文信息. 可以修改日历以提供其他上下文或限制可用日期. 日历视图让用户查看可按月份.年份或十年期浏览的日历,并与之交互. 用户可选择单个日期或一组日期. 它没有选取器图面,并且…

UWP学习记录7-设计和UI之控件和模式4

UWP学习记录7-设计和UI之控件和模式4 1.翻转视图使用翻转视图浏览集合中的图像或其他项目(例如相册中的照片或产品详细信息页中的项目),一次显示一个项目. 对于触摸设备,轻扫某个项将在整个集合中进行浏览. 对于鼠标,导航按钮显示在鼠标悬停位置上. 对于键盘,使用箭头键移动浏览该集合. 翻转视图最适合浏览小到中型集合中的图像(最多 25 个项目左右). 此类集合的示例包括产品详细信息页中的项目或相册中的照片. 虽然微软不建议将翻转视图用于大多数大型集合,但是该控件通用于查看相册中的个别图像.…

UWP学习记录6-设计和UI之控件和模式3

UWP学习记录6-设计和UI之控件和模式3 1.按钮按钮,响应用户输入和引发 Click 事件的控件. 使用<Button>就能创建一个按钮控件了.按钮是 ContentControl,它的 XAML 内容属性为 Content.可以将任何对象设置为按钮的内容. 如果内容是一个 UIElement,则会在按钮中呈现它. 如果该内容是另一种类型的对象,则会在按钮中显示其字符串表示形式. RepeatButton 是一个从按下到释放为止重复引发 Click 事件的按钮. 设置 Delay 属性来…

UWP学习记录5-设计和UI之控件和模式2

UWP学习记录5-设计和UI之控件和模式2 1.应用栏和命令栏 CommandBar 控件是一款通用.灵活.轻型的控件,可显示复杂内容(如图像或文本块)以及简单的命令(如 AppBarButton.AppBarToggleButton 和 AppBarSeparator 控件).XAML 提供 AppBar 控件和 CommandBar 控件.对于 Windows 10 中的新应用,微软建议改用 CommandBar 控件. 命令栏分为 4 个主要区域: “查看更多”[•••] 按钮显示在该栏的…

【Bootstrap学习记录】的更多相关文章