BootStrap入门教程 (一) ：手脚架Scaffolding（全局样式(Global Style),格网系统(Grid System),流式格网(Fluid grid System),自定义(Customing),布局(Layouts)）

2011年，twitter的“一小撮”工程师为了提高他们内部的分析和管理能力，用业余时间为他们的产品构建了一套易用、优雅、灵活、可扩展的前端工具集--BootStrap。Bootstrap由MARK OTTO和Jacob Thornton所设计和建立，在github上开源之后，迅速成为该站上最多人watch&fork的项目。大量工程师踊跃为该项目贡献代码，社区惊人地活跃，代码版本进化非常快速，官方文档质量极其高(可以说是优雅)，同时涌现了许多基于Bootstrap建设的网站：界面清新、简洁;要素排版利落大方。如下图所示：

                                                                           https://kippt.com/

BootStrap入门教程 (一) ：手脚架Scaffolding（全局样式(Global Style),格网系统(Grid System),流式格网(Fluid grid System),自定义(Customing),布局(Layouts)）_第1张图片

                                                                              http://www.fleetio.com/

BootStrap入门教程 (一) ：手脚架Scaffolding（全局样式(Global Style),格网系统(Grid System),流式格网(Fluid grid System),自定义(Customing),布局(Layouts)）_第2张图片

     GitHub上这样介绍  bootstrap：简单灵活可用于架构流行的用户界面和交互接口的html,css,javascript工具集。基于html5、css3的bootstrap，具有大量的诱人特性：友好的学习曲线，卓越的兼容性，响应式设计，12列格网，样式向导文档，自定义JQuery插件，完整的类库，基于Less等。本系列教程遵循官方文档结构来介绍bootstrap，包括手脚架（Scaffolding),基础CSS,组件,javascript插件，使用LESS与自定义.本文主要介绍Bootstrap的基础布局--Scaffolding.

      Bootstrap建立了一个响应式的12列格网布局系统，它引入了fixed和fluid-with两种布局方式。我们从全局样式(Global Style),格网系统(Grid System),流式格网(Fluid grid System),自定义(Customing),布局(Layouts),响应式设计(Responsive  Design)这六五个方面深入讲解Boostrap的scaffolding.

  1.  全局样式(Global Style).Bootstrap要求html5的文件类型，所以必须在每个使用bootstrap页面的开头都引用: 
    <!DOCTYPE html> <html lang="en"> ... </html>
    同时，它通过Bootstrap.less文件来设置全局的排版和连接显示风格.其中去掉了Body的margin，使用@baseFontFamily,@baseFontSize,@linkColor等变量来控制基本排版。
  2.  格网系统(Grid System).默认的Bootstrap格网系统提供一个宽达940像素的,12列的格网。这意味着你页面默认宽度是940px,最小的单元要素宽度是940/12px.Bootstrap能够使得你的网页可以更好地适应多种终端设备(平板电脑，智能手机等)。默认格网系统直观概念如图1-1所示：BootStrap入门教程 (一) ：手脚架Scaffolding（全局样式(Global Style),格网系统(Grid System),流式格网(Fluid grid System),自定义(Customing),布局(Layouts)）_第3张图片                                                                                                                                                            图1-1 默认格网系统(Default Grid System)                                                                                                                                                                 以下简单的代码则是实现图1-1中，第三列的宽度为4和宽度为8的两个div. 
    <div class="row"> <div class="span4">...</div> <div class="span8">...</div> </div>

    2.2   偏移列. 有时候，页面要素前面需要一些空白，bootstrap提供了偏移列来实现，如图1-2所示：

                                                                              图1-２ 偏移列(Offset columns)

    以下代码实现了是实现图1-2中，第一列的宽度为4和偏移度为4宽度为4的两个div.

    <div class="row"> <div class="span4">...</div> <div class="span4 offset4">...</div> </div>

    2.3 嵌套列.  嵌套列是容许用户实现更复杂的页面要素布局。在bootstrap中实现嵌套列非常简单，只需要在原有的div中加入.row 和相应的长度的span* div即可。        如图1-3所示：

                                                                                                                                                    图1-3     嵌套列(Nesting columns) 

    以下代码实现了是实现图1-3中，第一层的宽度为12和第二层两个宽度为6的两个div.

    复制代码 
    <div class="row"> <div class="span12"> Level 1 of column <div class="row"> <div class="span6">Level 2</div> <div class="span6">Level 2</div> </div> </div> </div>
    复制代码

    嵌套的div长度之和不能大于它的父div，否则会溢出叠加。各位可以试试将第一层的div长度改为其他值，看看效果。

  3. 流式格网系统(Fluid grid system).它使用%，而不是固定的px,来确定页面要素的宽度.只需要简单的将.row 改成.row-fluid ，就可以将fixed行改为fluid.如图1-4所示：                                                     BootStrap入门教程 (一) ：手脚架Scaffolding（全局样式(Global Style),格网系统(Grid System),流式格网(Fluid grid System),自定义(Customing),布局(Layouts)）_第4张图片                                                                                                                     图1-4 流式格网系统(Fluid grid system)                                                                                                                                                                                  以下代码实现了是实现图1-4中，两个不同长度的流式页面要素. 
    <div class="row-fluid"> <div class="span4">...</div> <div class="span8">...</div> </div>

    嵌套的流式格网和嵌套的固定格网，稍微有些不同。嵌套流式格网(Fluid nesting)的子要素不用匹配父要素的宽度，子要素用100%来表示占满父要素的页面宽度。

  4. 自定义格网(Grid customization).Bootstrap允许通过修改variables.less的参数值来自定义格网系统。主要包括如表1-1所示的变量：
    变量 默认值 说明
    @gridColumns 12 列数
    @gridColumnWidth 60px 每列的宽度
    @gridGutterWidth 20px 列间距

                                                                                                    表1-1 格网变量                                                                                                                                                                                                                                               我们通过修改以上值，并重新编译Bootstrap来实现自定义格网系统。如果添加新的列，需要同时修改grid.less.同样的,需要修改responsive.less来获得多设备兼容.

  5. 布局(Layout).本文最后我们讨论创建页面基础模板的布局。如前面所言，Bootstrap提供两种布局方式，包括固定(Fixed)和流式(Fliud)布局。如图1-5所示，左边为Fixed布局，右边为Fluid布局：                           BootStrap入门教程 (一) ：手脚架Scaffolding（全局样式(Global Style),格网系统(Grid System),流式格网(Fluid grid System),自定义(Customing),布局(Layouts)）_第5张图片                                                                                                                    图1-5 布局(Layout)                                                                                                                                                                                           固定布局代码如下： 
    <body> <div class="container"> ... </div> </body>

    流式布局代码如下：

    复制代码 
    <div class="container-fluid"> <div class="row-fluid"> <div class="span2"> <!--Sidebar content--> </div> <div class="span10"> <!--Body content--> </div> </div> </div>
    复制代码

    如果对Bootstrap提供的布局不够满意，可以参见Less Frame Work 提供的模板。

    最后，再次强调，官方文档极其优秀，强烈推荐各位直接参考和学习之。http://twitter.github.com/bootstrap/index.html

    参考文献与延伸阅读：

    1.Bootstrap的来由和发展。http://www.alistapart.com/articles/building-twitter-bootstrap/

    2.Less与Sass的介绍与对比.http://coding.smashingmagazine.com/2011/09/09/an-introduction-to-less-and-comparison-to-sass/

    3.Html5模板 http://html5boilerplate.com/

    4.Html5与Bootstrap混合项目(H5BP)https://gist.github.com/1422879

    5.20个有用的Bootstrap资源 http://www.webresourcesdepot.com/20-beautiful-resources-that-complement-twitter-bootstrap/

    6.Bootstrap按钮生成器 http://charliepark.org/bootstrap_buttons/

    7.前后端结合讨论  http://stackoverflow.com/questions/9525170/backend-technology-for-front-end-technologies-like-twitter-bootstrap

    8. Bootstrap英文教程  http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/stepping-out-with-bootstrap-from-twitter/

     

你可能感兴趣的:(bootstrap)

  • 【Python自动化办公脚本】Excel文件批量转PDF文件 一只小哪吒AE python
    importosimportwin32com.clientimporttkinterastkfromtkinterimportttkfromttkbootstrapimportStylefromtkinterimportfiledialog,messageboxfromthreadingimportThreadclassExcelToPDFConverter:def__init__(self,ma
  • Bootstrap CSS 概览 froginwe11 开发语言
    BootstrapCSS概览引言Bootstrap是一个流行的前端框架，它可以帮助开发者快速构建响应式、移动优先的网站和应用程序。Bootstrap使用CSS、HTML和JavaScript来构建界面，其中CSS部分提供了丰富的样式和组件，使得开发者可以轻松实现各种设计效果。本文将为您提供一个关于BootstrapCSS的概览，帮助您了解其核心功能和用法。BootstrapCSS简介Bootstr
  • 【Elasticsearch源码解读】代码包结构概述 risc123456 elasticsearch
    Elasticsearch的代码库包含多个包，每个包负责不同的功能。以下是这些包的主要功能：####action封装了Elasticsearch的各种操作，如索引、搜索、删除等，提供了与集群交互的接口。####bootstrap包含启动Elasticsearch节点所需的引导程序，负责初始化环境和配置。####client/internal提供客户端与Elasticsearch集群交互的内部实现，
  • NVRAM配置文件，Flash系统映像，BootROM硬件初始值，SDRAM内存 顺漆自然 智能路由器
    企业级路由器的初始配置文件通常保存在NVRAM（非易失性随机存取存储器）上。因此，本题的答案是B.NVRAM。NVRAM是一种特殊的内存类型，它可以在系统关闭或断电的情况下保持数据。路由器启动时，会从ROM中的Bootstrap程序开始，然后查找NVRAM中的配置文件以继续启动过程。这样可以确保即使在系统关闭或断电后，路由器也能恢复到其先前的配置状态。正确答案是B.NVRAM（非易失性随机访问存储
  • 手搓操作系统-如何创建虚拟磁盘并装载内核(超详细版） Refulic. linuxbootstrap系统架构系统安全
    写在前面：本篇是完整的在Linux环境下，创建一个虚拟磁盘，并且将内核安装到磁盘并用虚拟机运行的过程。需要对bootstrap过程有一定的基础知识。遇到不懂的概念，如MBR，Grub等请务必参考笔者的另一篇文章操作系统架构-Linux主机从按下电源键到加载内核，都经历了什么？（超详细版）此外，读者还需要对文件系统有基本的理解。1.创建磁盘镜像1）通过在Shell提示符下输入以下命令创建磁盘镜像（提
  • 大数据知识图谱之深度学习——基于BERT+LSTM+CRF深度学习识别模型医疗知识图谱问答可视化系统_bert+lstm 2301_76348014 程序员深度学习大数据知识图谱
    文章目录大数据知识图谱之深度学习——基于BERT+LSTM+CRF深度学习识别模型医疗知识图谱问答可视化系统一、项目概述二、系统实现基本流程三、项目工具所用的版本号四、所需要软件的安装和使用五、开发技术简介Django技术介绍Neo4j数据库Bootstrap4框架Echarts简介NavicatPremium15简介Layui简介Python语言介绍MySQL数据库深度学习六、核心理论贪心算法A
  • Bootstrap4 信息提示框 lsx202406 开发语言
    Bootstrap4信息提示框Bootstrap是一个流行的前端框架，它提供了一系列的工具和组件来帮助开发者快速搭建响应式网站。在Bootstrap4中，信息提示框（Tooltip）是一个非常有用的组件，它可以帮助用户更好地理解页面上的元素。本文将详细介绍Bootstrap4的信息提示框组件，包括其基本用法、配置选项以及与实际应用的结合。一、基本用法1.1HTML结构要使用Bootstrap4的信
  • Netty UDP 客户端发消息后接收服务器信息 一顿敲代码的小朋 nettyjava
    在本站大神的文章的基础上，加入了我的项目需求,当客户端用UDP给服务端发送消息后，接收到服务端返回的消息再关闭客户端。UdpServer.javaimportio.netty.bootstrap.Bootstrap;importio.netty.channel.ChannelOption;importio.netty.channel.EventLoopGroup;importio.netty.ch
  • js 使用缓存判断在规定时间内显示一次弹框 洪洪呀 javascript缓存开发语言
    js使用缓存判断在规定时间内显示一次弹框功能拆分，新用户注册完成登录跳转首页，js根据注册时间判断显示一个新手指引的弹窗，只在注册当天登录且显示一次jQuery(document).ready(function($){getWinnerModalShow()});//新手指引functiongetWinnerModalShow(){varwinnerModal=newbootstrap.Modal
  • .NET 9.0 的 Blazor Web App 项目，Bootstrap Blazor 全局异常 ＜ErrorLogger＞ 使用备忘 cqths BootstrapBlazorBlazorWebAppbootstrap前端c#.net
    一、全局异常通过组件实现，可以对全局的日志、异常进行统一输出，该组件【已经包含】在中，使用了组件包裹的razor组件【不用】再额外添加组件包裹。二、全局异常默认已经开启、后台自动生效，【不用】在项目中做其他任务额外操作，项目发布后执行时，自动拦截异常，项目不会因为发生异常而崩溃、导致不可用，可能会在页面顶端显示全局异常的简要说明，如下图所示。三、如果要显示全局异常的详细说明，可以在appsetti
  • 教育定制开发中，如何通过代码实现多终端适配？ 万岳科技系统开发 外卖系统外卖系统开发小程序android开源
    随着移动设备、平板电脑和PC的普及，教育平台的用户往往使用多种终端访问系统。为了提供一致的用户体验，教育定制开发必须考虑多终端适配问题。本文将探讨在教育系统开发中，如何通过代码实现多终端适配，并提供一些核心技术和代码示例。一、多终端适配的关键技术响应式设计（ResponsiveDesign）使用CSS媒体查询，根据屏幕大小动态调整页面布局。前端框架支持借助前端框架如Bootstrap、Tailwi
  • Blazor 组件库 BootstrapBlazor 中Editor组件介绍 虚幻私塾 python计算机
    优质资源分享学习路线指引（点击解锁）知识定位人群定位Python实战微信订餐小程序进阶级本课程是pythonflask+微信小程序的完美结合，从项目搭建到腾讯云部署上线，打造一个全栈订餐系统。Python量化交易实战入门级手把手带你打造一个易扩展、更安全、效率更高的量化交易系统组件介绍Editor组件是对Summernote组件的二次封装。组件分为div模式和editor模式。默认状态下edito
  • Bootstrap Blazor 实战 Dialog 对话框组件快速入门 Densen2014 BootstrapBlazorBlazor组件Blazorhtml5bootstrap.net
    官方文档1.注入服务DialogService@injectDialogServiceDialogService或者后置代码[Inject][NotNull]privateDialogService?DialogService{get;set;}2.弹出说明awaitDialogService.Show(newDialogOption(){Title="运行结果",IsScrolling=true
  • .NET 9.0 的 Blazor Web App 项目，自定义日志 TLog V2 使用备忘 cqths BlazorWebAppEFCoreBlazorwebapp.netc#数据库
    一、TLogV1使用静态数据库上下文，优点是速度快，缺点是内存占用大，参见.NET9.0的BlazorWebApp项目、BootstrapBlazor组件库、自定义日志TLog使用备忘_navigationmanager.tobaserelativepath-CSDN博客二、TLogV2改为依赖注入方式，优点、缺点与V1相反，使用方法与V1相同。namespaceBlazorWebAppNet9S
  • Vulhub靶机 MinIO信息泄露漏洞（CVE-2023-28432）（渗透测试详解） 芜丶湖 安全性测试网络linux服务器
    一、开启vulhub环境docker-composeup-d启动dockerps查看开放的端口二、访问靶机IP9001端口1、漏洞复现这个漏洞的节点存在于这个路径：http://your-ip:9000/minio/bootstrap/v1/verify对该路径发送POST请求会返回一段JSON数据：burp抓登陆包，修改post接口返回包内json字段中，我们可以看到MINIO_ROOT_USE
  • 【ElasticSearch】Es 启动流程 初始化流程 源码分析 九师兄 源码es启动流程
    文章目录1.概述1.1核心类2.主要流程2.1主方法2.1.1关闭过程分析2.2execute方法2.3Bootstrap.init2.4INSTANCE.setup方法2.5创建节点2.5.1创建PluginsService2.5.2创建ThreadPool及ThreadContext实例2.5.3初始化ResourceWatcherService2.5.4创建NodeClient2.5.5创建
  • GitHub 上的开源项目推荐 临水逸 github开源
    GitHub上的开源项目有成千上万，涵盖了从前端框架到数据科学、机器学习、系统工具等各个领域。不同的人根据兴趣和需求，可能会有不同的排名。不过，一些开源项目因为其广泛的应用、社区支持和技术创新，通常被认为是“最好”的开源项目之一。下面是一些广受欢迎、常被认为是GitHub上最好的开源项目（按领域分类）：1.开发工具与库Bootstrap最流行的前端框架之一，用于快速开发响应式和现代化的网页。Vue
  • 深入拆解Tomcat&Jetty(七) r09er_0407
    回顾一下Tomcat的启动步骤1.安装JDK,配置环境变量2.下载Tomcat并解压3.执行tomcat/bin目录下的start.sh执行脚本后的流程image1.Tomcat本质上还是一个Java程序,因此startup.sh脚本会启动一个JVM来运行Tomcat的启动类BootStrap其实Tomcat和我们自己平时写的代码并没有本质上的区别,只是Tomcat的启动时通过脚本.我们常用的Sp
  • 用HTML+bootstrap制作个人简历 星糖曙光 html前端javascript
    用HTML+bootstrap制作个人简历index.html&l
  • java ssm mysql 开源_SSM(Spring+Spring MVC+Mybatis)开发简约漂亮的java开源博客管理系统，其中前台后台功能完整。... weixin_39750598 javassmmysql开源
    项目描述本项目通过SSM(SpringMVC+Mybatis+Spring)框架编写的一个人博客管理系统，使用hexo主题，以及MAVEN进行对项目管理，并且前端具有粒子和点击爱心效果.后端的页面框架为bootstrap.数据库为mysql.运行环境jdk8+tomcat8+mysql+eclipse+maven(idea)项目技术(必填)spring+springmvc+mybatis+boot
  • 【旅游管理与推荐系统】Python+Django网页界面平台+协同过滤推荐算法+管理系统 网站开发
    一、介绍旅游管理与推荐系统。本系统使用Python作为主要编程语言，前端采用HTML、CSS、BootStrap等技术实现界面展示平台的开发，后端使用Django框架处理用户响应请求，并使用Ajax等技术实现前后端的数据通信。本系统主要功能有：系统分为两个角色：用户和管理员对于用户角色可以进行登录、注册、查看旅游景点信息、点赞、收藏、购买景点门票、发布评论、对景点进行评分、查看个人订单、查看个人收
  • 用python制作网站 bicart python开发语言服务器人工智能计算机视觉
    本文使用创作助手。为了制作一个介绍Python的美观网站界面，我们可以使用Python的Web框架（例如Flask或Django）以及一些前端技术（例如HTML，CSS和JavaScript）。下面是一个简单的示例，展示了如何使用Flask和Bootstrap库创建一个简洁而美观的网站界面。首先，我们需要安装Flask和Bootstrap库。可以使用以下命令在终端中安装它们：$pipinstall
  • 12. k8s二进制集群之kubelet部署 smart_ljh k8s二进制搭建kuberneteskubelet
    什么是kubelet准备事项创建kubelet-bootstrap.kubeconfig文件创建kubelet配置文件创建kubelet服务配置文件（将kubelet配置成系统服务）分发CA证书及Kubelet-bootstrap.kubeconfig到所有工作节点最后启动工作节点的kubelet服务总结什么是kubeletKubelet是Kubernetes的核心组件之一，运行在每个节点（Nod
  • | ERROR: [2] bootstrap checks failed. You must address the points described in the following [2] lin 讓丄帝愛伱 环境elasticsearch大数据bigdata
    elasticsearch启动报错:|ERROR:[2]bootstrapchecksfailed.Youmustaddressthepointsdescribedinthefollowing[2]linesbeforestartingElasticsearch.jvm1|bootstrapcheckfailure[1]of[2]:maxfiledescriptors[4096]forelasti
  • python安装jupyter qq_27390023 pythonjupyter
    JupyterNotebook的本质是一个Web应用程序，便于创建和共享程序文档，支持实时代码，数学方程，可视化和markdown。用途包括：数据清理和转换，数值模拟，统计建模，机器学习等等。###安装pip##pip是一个安装和管理Python包的工具wgethttps://bootstrap.pypa.io/get-pip.pypython3get-pip.py##创建软连接ln-s/usr/
  • bootstrap.yml文件未自动加载问题解决方案 XiaoyuEr_6688 bootstrapjava前端
    在添加bootstrap.yml文件后,程序未自动扫描到,即图标是这样的:查了一些资料,是缺少bootstrap相关依赖,虽然已经添加了spring-cloud-context依赖,但是这个依赖并未引入bootstrap依赖,可能是版本问题,需要手动引入org.springframework.cloudspring-cloud-starter-bootstrap3.1.1引入这个依赖以后,boot
  • ttkbootstrap界面美化系列之简介(一) ftzchina Pythonttkbootstrap界面美化python
    一：前言相信很多同学用Python进行界面设计第一个用到的就是Tkinter，Tkinter是Python的一个标准接口，用于创建GUI（图形用户界面）应用程序。它是Tcl/Tk的封装，Tkinter的名称来源于Tk技术工具包(ToolKit)的首字母缩写。Tkinter的历史可以追溯到1989年，当时为了让程序员能更容易地创建图形用户界面，开发了Tk工具包。Tkinter是Python语言的一部
  • tk（ttkbootstrap）下拉实现简单模糊查询 liuyili610 tkinterpythonpythonbootstraplist
    大致原理：通过点击下拉框之前获取下拉文本内容，通过筛选所有选项，选出符合条件的数据，然后再渲染给弹出的下拉选项框。默认是全部选项数据。实现效果图：代码如下：importttkbootstrapastkfromttkbootstrap.constantsimport*base_server_data=['刘小二','刘备','刘邦','刘秀','张三','张三丰','张X良','张X友','德华',
  • 【项目分享】使用python的ttkbootstrap模块构建一个炫酷的计时器 命运之光 我的项目源代码集：持续更新python开发语言
    目录前言项目背景项目展示（图片）项目实现1.安装与设置2.创建主窗口3.初始化计时器功能4.实现计时功能5.实现隐藏边框与置顶功能6.运行应用完整代码结论嗨，我是命运之光！2024，每日百字，记录时光，感谢有你一路同行。携手启航，探索未知，激发潜能，每一
  • 【机器学习BDT】python代码实现(下) mcoc132 Python机器学习机器学习python人工智能
    文章目录BDT(BootstrapDecisionTree)python实现导入库分类树主体代码回归树主体代码输出函数完整代码后续可能添加的功能BDT(BootstrapDecisionTree)python实现代码仅供参考导入库importCART树_自己写importnumpy其中一个库之前写的分类树主体代码在原始数据权重基础上使用更新的数据权重以更新BDT模型.def分类树(self,BDT
  • sql统计相同项个数并按名次显示 朱辉辉33 javaoracle
    现在有如下这样一个表： A表 ID Name time ------------------------------ 0001 aaa 2006-11-18 0002 ccc 2006-11-18 0003 eee 2006-11-18 0004 aaa 2006-11-18 0005 eee 2006-11-18 0004 aaa 2006-11-18 0002 ccc 20
  • Android+Jquery Mobile学习系列-目录 白糖_ JQuery Mobile
    最近在研究学习基于Android的移动应用开发，准备给家里人做一个应用程序用用。向公司手机移动团队咨询了下，觉得使用Android的WebView上手最快，因为WebView等于是一个内置浏览器，可以基于html页面开发，不用去学习Android自带的七七八八的控件。然后加上Jquery mobile的样式渲染和事件等，就能非常方便的做动态应用了。   从现在起，往后一段时间，我打算
  • 如何给线程池命名 daysinsun 线程池
            在系统运行后，在线程快照里总是看到线程池的名字为pool-xx，这样导致很不好定位，怎么给线程池一个有意义的名字呢。参照ThreadPoolExecutor类的ThreadFactory，自己实现ThreadFactory接口，重写newThread方法即可。参考代码如下：     public class Named
  • IE 中"HTML Parsing Error:Unable to modify the parent container element before the 周凡杨 html解析errorreadyState
      错误： IE 中"HTML Parsing Error:Unable to modify the parent container element before the child element is closed"     现象： 同事之间几个IE 测试情况下，有的报这个错，有的不报。经查询资料后，可归纳以下原因。
  • java上传 g21121 java
    我们在做web项目中通常会遇到上传文件的情况，用struts等框架的会直接用的自带的标签和组件，今天说的是利用servlet来完成上传。 我们这里利用到commons-fileupload组件，相关jar包可以取apache官网下载：http://commons.apache.org/ 下面是servlet的代码： //定义一个磁盘文件工厂 DiskFileItemFactory fact
  • SpringMVC配置学习 510888780 springmvc
    spring MVC配置详解 现在主流的Web MVC框架除了Struts这个主力 外，其次就是Spring MVC了，因此这也是作为一名程序员需要掌握的主流框架，框架选择多了，应对多变的需求和业务时，可实行的方案自然就多了。不过要想灵活运用Spring MVC来应对大多数的Web开发，就必须要掌握它的配置及原理。 　　一、Spring MVC环境搭建：（Spring 2.5.6 + Hi
  • spring mvc-jfreeChart 柱图(1) 布衣凌宇 jfreechart
    第一步：下载jfreeChart包，注意是jfreeChart文件lib目录下的，jcommon-1.0.23.jar和jfreechart-1.0.19.jar两个包即可； 第二步：配置web.xml; web.xml代码如下 <servlet>     <servlet-name>jfreechart</servlet-nam
  • 我的spring学习笔记13-容器扩展点之PropertyPlaceholderConfigurer aijuans Spring3
    PropertyPlaceholderConfigurer是个bean工厂后置处理器的实现，也就是BeanFactoryPostProcessor接口的一个实现。关于BeanFactoryPostProcessor和BeanPostProcessor类似。我会在其他地方介绍。PropertyPlaceholderConfigurer可以将上下文（配置文件）中的属性值放在另一个单独的标准java P
  • java 线程池使用 Runnable&Callable&Future antlove javathreadRunnablecallablefuture
    1. 创建线程池 ExecutorService executorService = Executors.newCachedThreadPool();   2. 执行一次线程，调用Runnable接口实现 Future<?> future = executorService.submit(new DefaultRunnable()); System.out.prin
  • XML语法元素结构的总结 百合不是茶 xml树结构
    1.XML介绍1969年   gml (主要目的是要在不同的机器进行通信的数据规范)1985年   sgml  standard generralized markup language1993年   html(www网)1998年  xml   extensible markup language
  • 改变eclipse编码格式 bijian1013 eclipse编码格式
    1.改变整个工作空间的编码格式         改变整个工作空间的编码格式，这样以后新建的文件也是新设置的编码格式。         Eclipse->window->preferences->General->workspace-
  • javascript中return的设计缺陷 bijian1013 JavaScriptAngularJS
    代码1： <script> var gisService = (function(window) { return { name:function () { alert(1); } }; })(this); gisService.name(); &l
  • 【持久化框架MyBatis3八】Spring集成MyBatis3 bit1129 Mybatis3
    pom.xml配置 Maven的pom中主要包括： MyBatis MyBatis-Spring Spring MySQL-Connector-Java Druid applicationContext.xml配置   <?xml version="1.0" encoding="UTF-8"?> &
  • java web项目启动时自动加载自定义properties文件 bitray javaWeb监听器相对路径
    创建一个类 public class ContextInitListener implements ServletContextListener 使得该类成为一个监听器。用于监听整个容器生命周期的，主要是初始化和销毁的。 类创建后要在web.xml配置文件中增加一个简单的监听器配置，即刚才我们定义的类。 <listener> <des
  • 用nginx区分文件大小做出不同响应 ronin47
    昨晚和前21v的同事聊天，说到我离职后一些技术上的更新。其中有个给某大客户(游戏下载类)的特殊需求设计，因为文件大小差距很大——估计是大版本和补丁的区别——又走的是同一个域名，而squid在响应比较大的文件时，尤其是初次下载的时候，性能比较差，所以拆成两组服务器，squid服务于较小的文件，通过pull方式从peer层获取，nginx服务于较大的文件，通过push方式由peer层分发同步。外部发布
  • java-67-扑克牌的顺子.从扑克牌中随机抽5张牌，判断是不是一个顺子，即这5张牌是不是连续的.2-10为数字本身，A为1，J为11，Q为12，K为13，而大 bylijinnan java
    package com.ljn.base; import java.util.Arrays; import java.util.Random; public class ContinuousPoker { /** * Q67 扑克牌的顺子 从扑克牌中随机抽5张牌，判断是不是一个顺子，即这5张牌是不是连续的。 * 2-10为数字本身，A为1，J为1
  • 翟鸿燊老师语录 ccii 翟鸿燊
    一、国学应用智慧TAT之亮剑精神A 1. 角色就是人格     就像你一回家的时候，你一进屋里面，你已经是儿子，是姑娘啦，给老爸老妈倒怀水吧，你还觉得你是老总呢？还拿派呢？就像今天一样，你们往这儿一坐，你们之间是什么，同学，是朋友。     还有下属最忌讳的就是领导向他询问情况的时候，什么我不知道，我不清楚，该你知道的你凭什么不知道
  • [光速与宇宙]进行光速飞行的一些问题 comsci 问题
         在人类整体进入宇宙时代，即将开展深空宇宙探索之前，我有几个猜想想告诉大家     仅仅是猜想。。。未经官方证实      1：要在宇宙中进行光速飞行，必须首先获得宇宙中的航行通行证，而这个航行通行证并不是我们平常认为的那种带钢印的证书，是什么呢？ 下面我来告诉
  • oracle undo解析 cwqcwqmax9 oracle
    oracle undo解析2012-09-24 09:02:01     我来说两句       作者：虫师收藏    我要投稿 Undo是干嘛用的？         &nb
  • java中各种集合的详细介绍 dashuaifu java集合
    一，java中各种集合的关系图 Collection       接口的接口     对象的集合  ├ List           子接口   &n
  • 卸载windows服务的方法 dcj3sjt126com windowsservice
    卸载Windows服务的方法 在Windows中，有一类程序称为服务，在操作系统内核加载完成后就开始加载。这里程序往往运行在操作系统的底层，因此资源占用比较大、执行效率比较高，比较有代表性的就是杀毒软件。但是一旦因为特殊原因不能正确卸载这些程序了，其加载在Windows内的服务就不容易删除了。即便是删除注册表中的相 应项目，虽然不启动了，但是系统中仍然存在此项服务，只是没有加载而已。如果安装其他
  • Warning: The Copy Bundle Resources build phase contains this target's Info.plist dcj3sjt126com iosxcode
        http://developer.apple.com/iphone/library/qa/qa2009/qa1649.html Excerpt: You are getting this warning because you probably added your Info.plist file to your Copy Bundle
  • 2014之C++学习笔记（一） Etwo C++EtwoEtwoiterator迭代器
            已经有很长一段时间没有写博客了，可能大家已经淡忘了Etwo这个人的存在，这一年多以来，本人从事了AS的相关开发工作，但最近一段时间，AS在天朝的没落，相信有很多码农也都清楚，现在的页游基本上达到饱和，手机上的游戏基本被unity3D与cocos占据，AS基本没有容身之处。so。。。最近我并不打算直接转型
  • js跨越获取数据问题记录 haifengwuch jsonpjsonAjax
    js的跨越问题，普通的ajax无法获取服务器返回的值。   第一种解决方案，通过getson，后台配合方式，实现。 Java后台代码： protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { String ca
  • 蓝色jQuery导航条 ini JavaScripthtmljqueryWebhtml5
    效果体验：http://keleyi.com/keleyi/phtml/jqtexiao/39.htmHTML文件代码： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jQuery鼠标悬停上下滑动导航条 - 柯乐义<
  • linux部署jdk,tomcat,mysql kerryg jdktomcatlinuxmysql
    1、安装java环境jdk:     一般系统都会默认自带的JDK,但是不太好用，都会卸载了，然后重新安装。    1.1）、卸载：      （rpm -qa :查询已经安装哪些软件包；        rmp -q 软件包：查询指定包是否已
  • DOMContentLoaded VS onload VS onreadystatechange mutongwu jqueryjs
    1. DOMContentLoaded 在页面html、script、style加载完毕即可触发，无需等待所有资源（image/iframe）加载完毕。（IE9+） 2. onload是最早支持的事件，要求所有资源加载完毕触发。 3. onreadystatechange 开始在IE引入，后来其它浏览器也有一定的实现。涉及以下 document , applet, embed, fra
  • sql批量插入数据 qifeifei 批量插入
    hi，   自己在做工程的时候，遇到批量插入数据的数据修复场景。我的思路是在插入前准备一个临时表，临时表的整理就看当时的选择条件了，临时表就是要插入的数据集，最后再批量插入到数据库中。    WITH tempT AS ( SELECT item_id AS combo_id, item_id, now() AS create_date FROM a
  • log4j打印日志文件 如何实现相对路径到 项目工程下 thinkfreer Weblog4j应用服务器日志
    最近为了实现统计一个网站的访问量，记录用户的登录信息，以方便站长实时了解自己网站的访问情况，选择了Apache 的log4j,但是在选择相对路径那块 卡主了，X度了好多方法(其实大多都是一样的内用，还一个字都不差的)，都没有能解决问题，无奈搞了2天终于解决了，与大家分享一下 需求： 用户登录该网站时，把用户的登录名,ip,时间。统计到一个txt文档里，以方便其他系统调用此txt。项目名
  • linux下mysql-5.6.23.tar.gz安装与配置 笑我痴狂 mysqllinuxunix
    1.卸载系统默认的mysql [root@localhost ~]# rpm -qa | grep mysql mysql-libs-5.1.66-2.el6_3.x86_64 mysql-devel-5.1.66-2.el6_3.x86_64 mysql-5.1.66-2.el6_3.x86_64 [root@localhost ~]# rpm -e mysql-libs-5.1
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他