a137268431
a137268431

BootStrap入门教程 (一)

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

https://kippt.com/

BootStrap入门教程 (一)_第1张图片

http://www.fleetio.com/

BootStrap入门教程 (一)_第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入门教程 (一)_第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入门教程 (一)_第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入门教程 (一)_第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)

  • 每日免费分享之精品Wordpress主题系列~DAY24 wordpress主题下载 wordpress主题wordpress主题下载wordpress主题wordpress模板
    每日免费分享之精品Wordpress主题系列~DAY24今天介绍的这款wordpresscms主题是一款精仿韩寒”ONE一个“的官网主题，被用在wordpress上甚好！像这样的wordpresscms主题用作个人博客的话，还是不错的，主题设计采用了Bootstrap框架，依然是没玩自适应的效果！这款wordpress主题上手后在主题设置里设置外，还需要修改主题文件的header.php里的一些代
  • 用MVC做一个bootstrap-table的实例 qq_23982569 MVCMVCknockout-min.jsbootstrap
    前台HTML：注意需要引用js和cssBootStrapTable使用@*1、Jquery组件引用*@@*2、bootstrap组件引用*@@*3、bootstraptable组件以及中文包的引用*@@*4、页面Js文件的引用*@@*查询条件*@查询条件学号用户名查询*@@*工具栏和table*@新增@*修改删除@*添加用户dialog*@<inputt
  • 基于springboot的企业OA管理系统 Olivia-gogogo springboot后端java
    摘要随着企业规模的扩大和业务的复杂化，传统的办公方式已难以满足企业高效管理的需求。本论文旨在设计并实现一个基于SpringBoot的企业OA（OfficeAutomation）管理系统，以提高企业办公效率、优化业务流程和加强信息共享。系统采用分层架构，结合MySQL数据库存储数据，前端使用Thymeleaf模板引擎和Bootstrap框架实现页面展示。通过需求分析、系统设计、代码实现和测试等环节，
  • 基于Python+Django的计算机专业就业分析可视化系统 QQ79278590 javawebpythondjango开发语言
    基于Python+Django的计算机专业就业分析系统1.使用django-simpleui实现后端管理系统，使用requests爬取的数据2.使用django-allauth插件实现登录注册修改密码等，实现数据的搜索3.使用django框架实现的后端4.前端使用html5，css3，JavaScript，bootstrap2，使用echarts实现可视化
  • 【Django】教程-4-一个增删改查的Demo 唐古乌梁海 Djangodjango
    【Django】教程-1-安装+创建项目+目录结构介绍【Django】教程-2-前端-目录结构介绍【Django】教程-3-数据库相关介绍9.demo一个包含前后端的，增删查demo9.1前端代码layout.html定义父级，需要被其他前端页面继承的html模板,JQ跟bootstrap使用cdn的就可以！我的为本地的{%loadstatic%}{%blocktitle%}{%endblock%
  • 基于HTML的邮件发送状态查询界面设计示例 大霸王龙 html前端javascript
    以下是一个基于HTML的邮件发送状态查询界面设计示例，结合筛选功能、状态展示和重新发送操作，采用Bootstrap框架实现响应式布局：邮件发送状态监控系统.status-badge{padding:4px8px;border-radius:12px;font-size:0.9em;}.success{background-color:#d4edda;color:#155724;}.failed{b
  • 输入菜单关键字，遍历匹配到 menuIds，展开 匹配节点 的所有父节点以及 匹配节点 本身，高亮 匹配节点 菲力蒲LY bootstrap
    菜单检索，名称、地址、权限标志等关键字匹配、展开、高亮(全程借助DeepSeek)便捷简洁的企业官网的后台菜单管理，图示：改造点：（1）修改bootstrapTreeTable的节点class命名方式为：treegrid-{item[options.id]}，即采用id作为节点的唯一标识；（2）展开所有父节点；（3）展开该节点本身；（4）高亮该节点。1.修改bootstrapTreeTable的节
  • C# WebForm显示bootstrap模态对话框 boluo_people12345 c#bootstrap开发语言asp.net
    1、在aspx中添加，将依赖添加进来2、添加模态对话框的divModaltitle...CloseSavechanges3、我封装了两个C#函数来显示和隐藏bootstrp的对话框publicvoidshowModal(stringid){stringscript="varmyModal=newbootstrap.Modal(document.getElementById('"+id+"'),{\
  • nacos-gateway动态路由 汤汤程序员 gatewayjava前端
    在Nacos官网中给出了手动监听Nacos配置变更的SDK：NacosJavaSDK所需依赖com.alibaba.cloudspring-cloud-starter-alibaba-nacos-configorg.springframework.cloudspring-cloud-starter-bootstrapnacos提供了监视配置文件的功能，当配置文件发生更改的能够实时推送到服务器，这个
  • 随机森林算法 编码雪人 机器学习算法随机森林机器学习
    目录第一章分类回归树1.1分类回归树概述1.2模型训练1.2.1递归分裂1.2.2寻找最佳分裂第二章随机森林2.1随机森林概述2.2模型组件2.2.1Bootstrap2.2.2Bagging2.3模型训练2.4Sklearn随机森林模型参数2.4.1随机森林参数说明第三章工程实践3.1数据收集3.1.1数据集介绍3.1.2数据集的下载地址3.1.3加载数据3.2数据探索3.2.1数据概述3.3特
  • gradio调用多个CSS的HTML页 li_li_rui csshtml前端gradio大语言模型
    很多博客介绍的gradio读取html和css比较简单，如果要做很细致的前端页面优化，比如丰富的响应式的css+js，至少要有html+多个css，是暂不能实现的。bootstrap、font-awesome、jquery等方案一当然是直接更换html+css为主的部署方式，仅用gradio传回的数据，重新设计前端方案二可以考虑把多个css直接拼接后再生效，举例如下：1.原html404PageO
  • MySQL 8.0.32 MGR常见操作及添加新节点 IT_木头人 MySQLmysql数据库
    MySQL8.0.32MGR常见操作及添加新节点启动MGRMGR单主多主模式切换组的写入并发性添加新节点启动MGR单主模式启动第一个节点（引导）：SETGLOBALgroup_replication_bootstrap_group=ON;STARTGROUP_REPLICATION;SETGLOBALgroup_replication_bootstrap_group=OFF;其他节点：STARTG
  • JNPF.java前后端分离框架，SpringBoot+SpringCloud开发微服务 「已注销」
    JNPF.java版本采用全新的前后端分离架构模式。前后端分离已成为互联网项目开发的业界标准开发方式，通过nginx+tomcat等方式有效的进行解耦合，并且前后端分离会为以后的大型分布式架构、弹性计算架构、微服务架构、多端化服务打下坚实的基础。技术选型:SpringBootSpringCloudMybatis-PlusRedisjqueryvueBootstrapElementUIUniapph
  • JVM 类加载器之间的层次关系，以及类加载的委托机制 冰糖心书房 JVM2025Java面试系列javajvm
    JVM类加载器之间存在一种层次关系，通常被称为双亲委派模型(ParentDelegationModel)。这种层次关系和委托机制是Java类加载机制的核心，对于保证Java程序的安全性和避免类冲突至关重要。1.类加载器的层次关系:JVM中的类加载器（ClassLoader）主要分为以下几种，它们之间存在自顶向下的层次关系（父子关系，但不是继承关系，而是组合关系）：启动类加载器(BootstrapC
  • 若依集成knife4j实现swagger文档增强 Roc-xb knife4j
    knife4j的前身是swagger-bootstrap-ui，为了契合微服务的架构发展,由于原来swagger-bootstrap-ui采用的是后端Java代码+前端Ui混合打包的方式,在微服务架构下显的很臃肿,因此项目正式更名为knife4j。目录一、单体版本1、ruoyi-admin\pom.xml模块添加整合依赖2、SwaggerController.java修改跳转访问地址二、前后端分离
  • 内核调试环境：buildroot/debootstrap制作文件系统、编译内核、QEMU模拟 苏打呀 linuxqemukernel
    编译内核#安装常用工具和依赖，可能会多，懒得分了，全装了吧反正以后说不定还要用。。。sudoaptinstallcurlwgetgpgzshtreegitnet-toolsproxychains4remminavimtarstracellvmclangunzipgccgcc-multilibbuild-essentialflexbisoncmakemakegawkdkmsautoconfninja
  • HTML5实现左右滑动数据变化 ice_junjun HTML左右滑动
    在HTML中怎么样实现左右滑动？代码附上Bootstrap实例-下拉菜单（Dropdowns）-->-->欢迎登陆页面！这是一个超大屏幕（Jumbotron）的实例。学习更多-->响应式表格布局产品付款日期状态产品123/11/2013待发货产品210/11/2013发货中产品320/10/2013待确认产品420/10/2013已退货产品123/11/2013待发货产品210/11/2013发货
  • selectpicker.js 下拉框多选控件的属性和方法 草木红 #JavaScriptjsjqueryjavascriptbootstrap
    中文网：https://www.bootstrapselect.cn/index.htmgithub：https://github.com/snapappointments/bootstrap-select需要用到的js和css（按顺序引用）：bootstrap.min.cssbootstrap-select.cssjquery.min.jsbootstrap.min.jsbootstrap-se
  • Netty源码分析之Reactor线程模型详解 Java-进阶架构师 javajava编程java后端java-ee
    在分析源码之前，我们先分析，哪些地方用到了EventLoop？NioServerSocketChannel的连接监听注册NioSocketChannel的IO事件注册NioServerSocketChannel连接监听在AbstractBootstrap类的initAndRegister()方法中，当NioServerSocketChannel初始化完成后，会调用case标记位置的代码进行注册。f
  • 集成学习（Ensemble Learning）基础知识1 代码骑士 #机器学习集成学习机器学习人工智能
    文章目录一、集成学习1、基本概念2、回顾:误差的偏差-方差分解3、为什么集成学习有效？4、基学习器：“好而不同”5、集成学习的两个基本问题（1）如何训练出具有差异性的多个基学习器？（2）如何将多个基学习器的预测结果集成为最终的强学习器预测结果？二、自助法（Bagging）1、Bagging2、BootstrapBootstrap采样的数学性质3、Bagging:集成学习的两个基本问题（1）如何训练
  • Kafka系列之—向Kafka 写入数据（四） 葛旭朋 Kafkakafka分布式java
    一，创建Kafka生产者1.1必选的三个属性1.1.1bootstrap.servers指定broker的地址清单，不需要包含所有的broker地址，生产者会从给定的broker里找到其它broker的信息，建议最少提供两个broker的信息。1.1.2key.serializerbroker希望接收到的消息的键和值都是字节数组。1.1.3value.serializer指定的类会将值序列化。1.
  • Android 高频面试必问之Java基础 2401_83641443 程序员android面试java
    BootstrapClassLoader：Bootstrap类加载器负责加载rt.jar中的JDK类文件，它是所有类加载器的父加载器。Bootstrap类加载器没有任何父类加载器，如果调用String.class.getClassLoader()，会返回null，任何基于此的代码会抛出NUllPointerException异常，因此Bootstrap加载器又被称为初始类加载器。ExtClassL
  • 推荐开源项目：vue-strap —— Bootstrap与Vue.js的完美结合 殷巧或
    推荐开源项目：vue-strap——Bootstrap与Vue.js的完美结合去发现同类优质开源项目:https://gitcode.com/项目介绍虽然该项目已被废弃，但它的两个替代方案，bootstrap-vue和uiv，仍然是构建基于Vue.js应用时，实现Bootstrap组件的强大选择。vue-strap原本是一个用Vue.js实现的Bootstrap组件库，无需依赖jQuery或Boo
  • JavaEE系统架构师学习路线(基础篇) 淘小五
    大纲：第1阶段(Java程序员)-Java语言基础第2阶段(Java初级软件工程师)-JSP、Servlet、HTML、CSS、JS、Bootstrap、XML、AJAX、MySQL、SQLServer、Oracle第3阶段(Java中级软件工程师)-Struts2、Spring、Hibernate、SpringMVC、Mybatis、Shiro、JVM第4阶段(Java高级软件工程师)-WebS
  • Spring Boot 启动失败：Failed to start bean ‘documentationPluginsBootstrapper’ 解决方案 总是学不会. 异常报错处理springboot后端java
    文章目录1.问题描述2.可能原因分析原因1：SpringFox版本与SpringBoot版本不兼容❌✅解决方案：添加兼容性配置（首选！！！！）原因2：SpringFox依赖冲突⚠️✅解决方案：确保只使用正确的SpringFox依赖原因3：SpringBoot3.x不支持SpringFox✅解决方案：使用springdoc-openapi替代SpringFox原因4：Swagger配置文件错误✅解决
  • AI大模型测试用例生成平台 王根生 测试开发测试用例质量保障AI编程nlp测试管理软件测试
    AI测试用例生成平台项目背景技术栈业务描述项目展示项目重难点项目背景针对传统接口测试用例设计高度依赖人工经验、重复工作量大、覆盖场景有限等行业痛点，基于大语言模型技术实现接口测试用例智能生成系统。技术栈LangChain框架+GLM-4模型+PromptEngineering+Flask+Python+Bootstrap+jQuery业务描述用户在该平台上传Markdown形式的接口文档，点击生成
  • 用Python写一个天气预报小程序 穿梭的编织者 Python脚本python小程序
    一、界面效果二、完整代码importtkinterastkfromtkinterimportttkimportrequestsimportjsonfromdatetimeimportdatetimefromPILimportImage,ImageTkimportiofromttkbootstrapimportStyleclassWeatherApp:def__init__(self,root):s
  • kubernetes集群证书过期问题解决 后端java
    证书过期问题查看证书过期时间kubeadmalphacertscheck-expiration证书过期升级命令kubeadmalphacertsrenewall日志查看命令journalctl-xefukubelet发现更新证书后，日志还是报错未发现/etc/kubernetes/bootstrap-kubelet.conf，则继续执行如下操作重新生成证书cd/etc/kubernetes/pki
  • JVM 如何保证 Java 程序的安全性？ 冰糖心书房 JVM2025Java面试系列jvmjava
    JVM（JavaVirtualMachine）在设计时就考虑了安全性，它提供了一套多层次的安全机制，以保护系统免受恶意代码的侵害。这些机制主要包括：1.类加载器(ClassLoader)及双亲委派模型:类加载器的作用：负责加载Java类（.class文件）到JVM中。将类的字节码转换为内存中的Class对象。执行类的初始化。类加载器的类型：启动类加载器(BootstrapClassLoader):
  • 23章11节：自助抽样及其在R语言中的实现与验证 DAT｜R科学与人工智能 用R探索医药数据科学r语言开发语言r-4.2.1microsoft信息可视化
    在统计学中，数据分析的核心任务之一是如何在样本数据的基础上推断总体的性质。传统方法往往依赖于已知的概率分布假设和解析推导，但在现实问题中，我们往往无法准确得知总体分布，或者数据样本量较小，难以满足经典统计推断方法的要求。自助抽样作为一种非参数的计算方法，为我们提供了基于样本数据“自我重复”构建抽样分布的途径。1977年，斯坦福大学的B.Efron在著名论文《BootstrapMethods:Ano
  • SQL的各种连接查询 xieke90 UNION ALLUNION外连接内连接JOIN
    一、内连接   概念：内连接就是使用比较运算符根据每个表共有的列的值匹配两个表中的行。                 内连接（join 或者inner join ）       SQL语法：       select * fron
  • java编程思想--复用类 百合不是茶 java继承代理组合final类
          复用类看着标题都不知道是什么,再加上java编程思想翻译的比价难懂,所以知道现在才看这本软件界的奇书   一:组合语法:就是将对象的引用放到新类中即可     代码:     package com.wj.reuse; /** * * @author Administrator 组
  • [开源与生态系统]国产CPU的生态系统 comsci cpu
          计算机要从娃娃抓起...而孩子最喜欢玩游戏....       要让国产CPU在国内市场形成自己的生态系统和产业链,国家和企业就不能够忘记游戏这个非常关键的环节....       投入一些资金和资源,人力和政策,让游
  • JVM内存区域划分Eden Space、Survivor Space、Tenured Gen，Perm Gen解释 商人shang jvm内存
    jvm区域总体分两类，heap区和非heap区。heap区又分：Eden Space（伊甸园）、Survivor Space(幸存者区)、Tenured Gen（老年代-养老区）。 非heap区又分：Code Cache(代码缓存区)、Perm Gen（永久代）、Jvm Stack(java虚拟机栈)、Local Method Statck(本地方法栈)。 HotSpot虚拟机GC算法采用分代收
  • 页面上调用 QQ oloz qq
    <A href="tencent://message/?uin=707321921&amp;Site=有事Q我&amp;Menu=yes">   <img style="border:0px;" src=http://wpa.qq.com/pa?p=1:707321921:1></a>
  • 一些问题 文强chu 问题
    1.eclipse 导出 doc  出现“The Javadoc command does not exist.” javadoc command 选择 jdk/bin/javadoc.exe 2.tomcate 配置 web 项目 ..... SQL:3.mysql  * 必须得放前面 否则  select&nbs
  • 生活没有安全感 小桔子 生活孤独安全感
           圈子好小，身边朋友没几个，交心的更是少之又少。在深圳，除了男朋友，没几个亲密的人。不知不觉男朋友成了唯一的依靠，毫不夸张的说，业余生活的全部。现在感情好，也很幸福的。但是说不准难免人心会变嘛，不发生什么大家都乐融融，发生什么很难处理。我想说如果不幸被分手(无论原因如何)，生活难免变化很大，在深圳，我没交心的朋友。明
  • php 基础语法 aichenglong php 基本语法
    1 .1 php变量必须以$开头 <?php $a=” b”; echo ?> 1 .2 php基本数据库类型 Integer  float/double Boolean string 1 .3 复合数据类型 数组array和对象 object 1 .4 特殊数据类型  null 资源类型(resource)    $co
  • mybatis tools 配置详解 AILIKES mybatis
    MyBatis Generator中文文档 MyBatis Generator中文文档地址： http://generator.sturgeon.mopaas.com/ 该中文文档由于尽可能和原文内容一致，所以有些地方如果不熟悉，看中文版的文档的也会有一定的障碍，所以本章根据该中文文档以及实际应用，使用通俗的语言来讲解详细的配置。 本文使用Markdown进行编辑，但是博客显示效
  • 继承与多态的探讨 百合不是茶 JAVA面向对象 继承 对象
    继承 extends   多态 继承是面向对象最经常使用的特征之一：继承语法是通过继承发、基类的域和方法 //继承就是从现有的类中生成一个新的类，这个新类拥有现有类的所有extends是使用继承的关键字：     在A类中定义属性和方法； class A{ //定义属性 int age； //定义方法 public void go
  • JS的undefined与null的实例 bijian1013 JavaScriptJavaScript
    <form name="theform" id="theform"> </form> <script language="javascript"> var a alert(typeof(b)); //这里提示undefined if(theform.datas
  • TDD实践（一） bijian1013 java敏捷TDD
    一.TDD概述         TDD：测试驱动开发，它的基本思想就是在开发功能代码之前，先编写测试代码。也就是说在明确要开发某个功能后，首先思考如何对这个功能进行测试，并完成测试代码的编写，然后编写相关的代码满足这些测试用例。然后循环进行添加其他功能，直到完全部功能的开发。     
  • [Maven学习笔记十]Maven Profile与资源文件过滤器 bit1129 maven
    什么是Maven Profile Maven Profile的含义是针对编译打包环境和编译打包目的配置定制，可以在不同的环境上选择相应的配置，例如DB信息，可以根据是为开发环境编译打包，还是为生产环境编译打包，动态的选择正确的DB配置信息   Profile的激活机制 1.Profile可以手工激活，比如在Intellij Idea的Maven Project视图中可以选择一个P
  • 【Hive八】Hive用户自定义生成表函数(UDTF) bit1129 hive
    1. 什么是UDTF   UDTF，是User Defined Table-Generating Functions，一眼看上去，貌似是用户自定义生成表函数，这个生成表不应该理解为生成了一个HQL Table， 貌似更应该理解为生成了类似关系表的二维行数据集   2. 如何实现UDTF 继承org.apache.hadoop.hive.ql.udf.generic
  • tfs restful api 加auth 2.0认计 ronin47
    　　目前思考如何给tfs的ngx-tfs api增加安全性。有如下两点： 　　一是基于客户端的ip设置。这个比较容易实现。 　　二是基于OAuth2.0认证，这个需要lua，实现起来相对于一来说，有些难度。 　　现在重点介绍第二种方法实现思路。 　　 前言：我们使用Nginx的Lua中间件建立了OAuth2认证和授权层。如果你也有此打算，阅读下面的文档，实现自动化并获得收益。SeatGe
  • jdk环境变量配置 byalias javajdk
    进行java开发，首先要安装jdk，安装了jdk后还要进行环境变量配置： 1、下载jdk（http://java.sun.com/javase/downloads/index.jsp），我下载的版本是：jdk-7u79-windows-x64.exe 2、安装jdk-7u79-windows-x64.exe 3、配置环境变量：右击"计算机"-->&quo
  • 《代码大全》表驱动法-Table Driven Approach-2 bylijinnan java
    package com.ljn.base; import java.io.BufferedReader; import java.io.FileInputStream; import java.io.InputStreamReader; import java.util.ArrayList; import java.util.Collections; import java.uti
  • SQL 数值四舍五入 小数点后保留2位 chicony 四舍五入
    1.round() 函数是四舍五入用，第一个参数是我们要被操作的数据，第二个参数是设置我们四舍五入之后小数点后显示几位。 2.numeric 函数的2个参数，第一个表示数据长度，第二个参数表示小数点后位数。 例如： 　　select   cast(round(12.5,2)   as   numeric(5,2))  
  • c++运算符重载 CrazyMizzz C++
    一、加+，减-，乘*，除/ 的运算符重载 Rational operator*(const Rational &x) const{ return Rational(x.a * this->a); } 在这里只写乘法的，加减除的写法类似 二、<<输出,>>输入的运算符重载      &nb
  • hive DDL语法汇总 daizj hive修改列DDL修改表
    hive DDL语法汇总 １、对表重命名 hive> ALTER TABLE table_name RENAME TO new_table_name;   2、修改表备注 hive> ALTER TABLE table_name SET TBLPROPERTIES ('comment' = new_comm
  • jbox使用说明 dcj3sjt126com Web
    参考网址：http://www.kudystudio.com/jbox/jbox-demo.html jBox v2.3 beta [ 点击下载]  技术交流QQGroup：172543951 100521167 [2011-11-11] jBox v2.3 正式版 - [调整&修复] IE6下有iframe或页面有active、applet控件
  • UISegmentedControl 开发笔记 dcj3sjt126com
      //    typedef NS_ENUM(NSInteger, UISegmentedControlStyle) {     //        UISegmentedControlStylePlain,     // large plain   &
  • Slick生成表映射文件 ekian scala
    Scala添加SLICK进行数据库操作，需在sbt文件上添加slick-codegen包 "com.typesafe.slick" %% "slick-codegen" % slickVersion 因为我是连接SQL Server数据库，还需添加slick-extensions，jtds包 "com.typesa
  • ES-TEST gengzg test
    package com.MarkNum; import java.io.IOException; import java.util.Date; import java.util.HashMap; import java.util.Map; import javax.servlet.ServletException; import javax.servlet.annotation
  • 为何外键不再推荐使用 hugh.wang mysqlDB
    表的关联，是一种逻辑关系，并不需要进行物理上的“硬关联”，而且你所期望的关联，其实只是其数据上存在一定的联系而已，而这种联系实际上是在设计之初就定义好的固有逻辑。 在业务代码中实现的时候，只要按照设计之初的这种固有关联逻辑来处理数据即可，并不需要在数据库层面进行“硬关联”，因为在数据库层面通过使用外键的方式进行“硬关联”，会带来很多额外的资源消耗来进行一致性和完整性校验，即使很多时候我们并不
  • 领域驱动设计 julyflame VODAO设计模式DTOpo
    概念： VO（View Object）：视图对象，用于展示层，它的作用是把某个指定页面（或组件）的所有数据封装起来。 DTO（Data Transfer Object）：数据传输对象，这个概念来源于J2EE的设计模式，原来的目的是为了EJB的分布式应用提供粗粒度的数据实体，以减少分布式调用的次数，从而提高分布式调用的性能和降低网络负载，但在这里，我泛指用于展示层与服务层之间的数据传输对
  • 单例设计模式 hm4123660 javaSingleton单例设计模式懒汉式饿汉式
           单例模式是一种常用的软件设计模式。在它的核心结构中只包含一个被称为单例类的特殊类。通过单例模式可以保证系统中一个类只有一个实例而且该实例易于外界访问，从而方便对实例个数的控制并节约系统源。如果希望在系统中某个类的对象只能存在一个，单例模式是最好的解决方案。      &nb
  • logback zhb8015 loglogback
    一、logback的介绍      Logback是由log4j创始人设计的又一个开源日志组件。logback当前分成三个模块：logback-core,logback- classic和logback-access。logback-core是其它两个模块的基础模块。logback-classic是log4j的一个 改良版本。此外logback-class
  • 整合Kafka到Spark Streaming——代码示例和挑战 Stark_Summer sparkstormzookeeperPARALLELISMprocessing
    作者Michael G. Noll是瑞士的一位工程师和研究员，效力于Verisign，是Verisign实验室的大规模数据分析基础设施（基础Hadoop）的技术主管。本文，Michael详细的演示了如何将Kafka整合到Spark Streaming中。 期间， Michael还提到了将Kafka整合到 Spark Streaming中的一些现状，非常值得阅读，虽然有一些信息在Spark 1.2版
  • spring-master-slave-commondao 王新春 DAOspringdataSourceslavemaster
    互联网的web项目，都有个特点：请求的并发量高，其中请求最耗时的db操作，又是系统优化的重中之重。 为此，往往搭建 db的 一主多从库的 数据库架构。作为web的DAO层，要保证针对主库进行写操作，对多个从库进行读操作。当然在一些请求中，为了避免主从复制的延迟导致的数据不一致性，部分的读操作也要到主库上。（这种需求一般通过业务垂直分开，比如下单业务的代码所部署的机器，读去应该也要从主库读取数
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他