cometwo
cometwo

使用CSS实现三栏自适应布局（两边宽度固定，中间自适应）

所谓三列自适应布局指的是两边定宽，中间block宽度自适应。这道题在今年网易内推前端工程师面试的时候也被问到。 我这里主要分为两大类，一类是基于position传统的实现，一类是基于css3新特性弹性盒模型布局实现。

 1. 基于传统的position和margin等属性进行布局

   这里也分为三种方法，分别为绝对定位法，圣杯布局，自身浮动法。

  1).绝对定位法

    绝对定位法原理是将左右两边使用absolute定位，因为绝对定位使其脱离文档流，后面的center会自然流动到他们上面，然后使用margin属性，留出左右元素的宽度，既可以使中间元素自适应屏幕宽度。
   代码如下：
文档代码：
[html]  view plain  copy
  1. >  
  2. <html>  
  3.     <head>  
  4.         <meta charset="UTF-8">  
  5.         <title>layout_boxtitle>  
  6.         <link rel="stylesheet" type="text/css" href="../css/layout_box.css">  
  7.     head>  
  8.     <body>  
  9.         <h3>实现三列宽度自适应布局h3>  
  10.         <div id = "left">我是左边div>  
  11.         <div id = "right">我是右边div>  
  12.         <div id = "center">我是中间div>  
  13.     body>  
  14. html>  
css代码：
[css]  view plain  copy
  1. html,body{ margin: 0px;width: 100%; }  
  2. h3{height: 100px;margin:20px 0 0;}  
  3. #left,#right{width: 200px;height: 200px; background-color: #ffe6b8;position: absolute;top:120px;}  
  4. #left{left:0px;}  
  5. #right{right: 0px;}  
  6. #center{margin:2px 210px ;background-color: #eee;height: 200px; }  
   该法布局的好处，三个div顺序可以任意改变。不足是 因为绝对定位，所以如果页面上还有其他内容，top的值需要小心处理，最好能够对css样式进行一个初始化，就像在上面例子中加了一个标题，如果不对样式进行初始化，则两边和中间的值会对不齐。 另外，随着浏览器窗口缩小，小于200px的时候，会发生压缩。
结果如图，可以看到中间栏宽度随着屏幕大小伸缩。

 2).使用自身浮动法

    自身浮动法的原理就是使用对左右使用分别使用float:left和float:right，float使左右两个元素脱离文档流，中间元素正常在正常文档流中，使用margin指定左右外边距对其进行一个定位。
   HTML代码：
[html]  view plain  copy
  1. <h3>使用自身浮动法定位h3>  
  2. <div id = "left_self">我是左边div>  
  3. <div id = "right_self">我是右边div>  
  4. <div id = "center_self">我是中间div>  
css代码：
[css]  view plain  copy
  1. #left_self,#right_self{ width: 200px;height: 200px; background-color: #ffe6b8 }  
  2. #left_self {float: left;}  
  3. #right_self{float: right;}  
  4. #center_self{margin: 0 210px;height: 200px; background-color: #a0b3d6}  
   该布局法的好处是受外界影响小，但是不足是 三个元素的顺序，center一定要放在最后，这是和绝对定位不一样的地方，center占据文档流位置，所以一定要放在最后，左右两个元素位置没有关系。当浏览器窗口很小的时候，右边元素会被击倒下一行。

 3). 圣杯布局

   圣杯布局的原理是margin负值法。使用圣杯布局首先需要在center元素外部包含一个div，包含div需要设置float属性使其形成一个BFC，并设置宽度，并且这个宽度要和left块的margin负值进行配合，具体原理参考这里。这里对圣杯布局解释特别详细。
实现代码：HTML文档：
   
[html]  view plain  copy
  1. <h3>使用margin负值法进行布局h3>  
  2.         <div id = "wrap">  
  3.             <div id = "center">div>  
  4.         div>  
  5.         <div id = "left_margin">div>  
  6.         <div id = "right_margin">div>  
CSS代码：
[css]  view plain  copy
  1. #wrap{ width: 100%;height: 100px; background-color: #fff;float: left;}  
  2. #wrap #center{ margin:0 210px; height: 100px;background-color: #ffe6b8; }  
  3. #left_margin,#right_margin{ float: left;width: 200px;height: 100px;background-color: darkorange }  
  4. #left_margin {margin-left: -100%; background-color: lightpink}  
  5. #right_margin{margin-left: -200px;}  
   该方法在网站布局中非常常见，也是面试常考点，优点是三栏相互关联，有一定的抗性。需要注意的是，布局中间部分一定要放在前面，左右顺序不限制。对于left快的margin负值一定要等于wrap的宽度。
三种方法实现三栏网页宽度自适应布局方法见下图。

2 ， css3新特性

   在外围包裹一层div，设置为display：flex；中间设置flex：1；但是盒模型默认紧紧挨着，可以使用margin控制外边距。

代码：

[html]  view plain  copy
  1. <div id = "box">  
  2.          <div id = "left_box">div>  
  3.          <div id = "center_box">div>  
  4.          <div id = "right_box">div>  
  5.         div>  
css样式：
[css]  view plain  copy
  1. #box{width:100%;display: flex; height: 100px;margin: 10px;}  
  2. #left_box,#right_box{width: 200px;height: 100px; margin: 10px; background-color: lightpink}  
  3. #center_box{ flex:1; height: 100px;margin: 10px; background-color: lightgreen}  
注意： center一定要放到中间。

效果图如下：


  css布局还有很多其他特性，下一步准备研究清楚浮动，再研究position、和display属性。

你可能感兴趣的:(使用CSS实现三栏自适应布局（两边宽度固定，中间自适应）)

  • [论文阅读]DAMO-YOLO——实时目标检测设计报告 一朵小红花HH 知识蒸馏目标检测YOLO目标检测目标跟踪论文阅读人工智能
    DAMO-YOLODAMO-YOLO:AReportonReal-TimeObjectDetectionDesign实时目标检测设计报告论文网址：DAMO-YOLO简读论文这篇论文介绍了一个名为DAMO-YOLO的新型目标检测方法,相比YOLO系列的其他方法有着更好的性能。该方法的优势来自于几项新技术:使用了MAE-NAS作为骨干网络,可以自动搜索出不同延迟预算下的优化网络结构。MAE-NAS被称
  • Flutter 国际化(跟随系统及应用内切换)和数据本地存储 油焖茄子 fluttercocoamacos
    iOS国际化项目配置苹果的我以前写过，点击链接查看，如果只是通过flutter配置国际化，那只需要把Localizations里面添加需要支持的语言包即可，其他的就不用配置了。Android国际化项目配置添加依赖flutter_localizations:sdk:flutterPubget两种方法，第一种是使用intl插件，第二种是使用JSON文件，先记录第一种，安装插件(AndroidStudi
  • 《AI大模型开发笔记》DeepSeek技术创新点 Richard Chijq AI大模型开发笔记人工智能笔记
    一、DeepSeek横空出世DeepSeekV3以颠覆性技术架构创新强势破局！革命性的上下文处理机制实现长文本推理成本断崖式下降，综合算力需求锐减90%，开启高效AI新纪元！最新开源的DeepSeekV3模型不仅以顶尖基准测试成绩比肩业界SOTA模型，更以惊人的训练效率引发行业震动——仅耗费280万H800GPU小时（对应4e24FLOP@40%MFU）即达成巅峰性能。对比同级别Llama3-40
  • Spring Data JPA与SpEL：实现通用泛型仓库 t0_54manong python数据库sql个人开发
    在SpringDataJPA中，SpEL（SpringExpressionLanguage）是一种强大的表达式语言，可以用于动态地构建查询语句。通过结合SpEL和泛型，我们可以创建通用的仓库接口，从而减少代码重复并提高开发效率。本文将通过一个具体的例子来展示如何使用SpEL和泛型创建通用仓库。一、背景与需求假设我们有一个任务管理系统，其中包含两种任务类型：异步任务（AsyncTask）和同步任务（
  • SpringBoot -拦截器Interceptor、过滤器 Filter 及设置 小登ai学习 springboot后端
    SpringBoot拦截器（Interceptor）的概念-在SpringBoot中，拦截器是一种AOP的实现方式。它主要用于拦截请求，在请求处理之前和之后执行特定的代码逻辑。与过滤器不同的是，拦截器更侧重于对SpringMVC中的控制器（Controller）进行拦截，能够访问到SpringMVC上下文中的对象，比如获取请求的处理器（Handler）信息、模型（Model）和视图（View）相关
  • Spring Boot拦截器(Interceptor)详解 大地爱 面试学习路线阿里巴巴springboot后端java
    拦截器Interceptor拦截器我们主要分为三个方面进行讲解：介绍下什么是拦截器，并通过快速入门程序上手拦截器拦截器的使用细节通过拦截器Interceptor完成登录校验功能1.快速入门什么是拦截器？是一种动态拦截方法调用的机制，类似于过滤器。拦截器是Spring框架中提供的，用来动态拦截控制器方法的执行。拦截器的作用：拦截请求，在指定方法调用前后，根据业务需要执行预先设定的代码。在拦截器当中，
  • 【笔记ing】牛津高阶英汉双解词典（第9版）Oxford Advanced Learner‘s English-Chinese Dictionary(Ninth) edition 许科大 英语
    Abbreviationsusedinthedictionary本词典使用的缩写abbr.abbreviation缩写adj.adjective形容词adv.adverb副词Ccountablenoun可数名词conj.conjunction连词det.determiner限定词Iintransitiveverb不及物动词n.noun名词pl.plural复数pppastparticiple过去分
  • flutter 中使用什么本地数据存储 草明 Flutterflutter
    在Flutter中，你可以使用多种本地数据存储方式来保存和管理应用程序的数据。以下是一些常用的本地数据存储方式：1.SharedPreferences：shared_preferences包是Flutter的一个插件，用于在应用程序的持久化存储中存储小量的键值对数据。这对于存储用户偏好设置和应用程序配置等数据非常有用。2.SQLite：SQLite是一个轻量级的关系型数据库引擎，可以嵌入到Flut
  • 使用flutter_secure_storage，保障你的应用数据安全无忧！ 平依佩Ula
    使用flutter_secure_storage，保障你的应用数据安全无忧！flutter_secure_storagemogol/flutter_secure_storage:这是一个为Flutter框架提供的安全存储插件，允许开发者在Android和iOS平台上加密存储敏感信息，如用户凭据、API密钥等。项目地址:https://gitcode.com/gh_mirrors/fl/flutte
  • Lua：Lua函数设计与实现_2024-07-14_15-37-17.Tex chenjj4003 游戏开发2lua开发语言kotlin网络android微信
    Lua：Lua函数设计与实现Lua函数基础函数定义与调用在Lua中，函数是一等公民，这意味着它们可以被赋值给变量、存储在数据结构中、作为参数传递给其他函数，甚至可以作为返回值。函数定义使用function关键字，后跟函数名和参数列表，然后是函数体，最后以end结束。--定义一个函数，计算两个数的和functionsum(a,b)returna+bend--调用函数localresult=sum(5
  • Anaconda 创建环境 aitie1479 python
    2019-03-2517:10:51Anaconda给不同的项目创建不同的环境真的非常重要，最近在使用flask的时候在base环境中安装flask-bootstrap，竟然将我原本的py3.7的conda直接删除，完全降到了py2。最后只能重新安装anaconda。这个事件给我一个启示就是尽量不要在初始环境中安装各种包，而是使用anaconda的环境，来给不同的项目分配各自的环境。Anacond
  • HashMap 曾续缘 哈希算法散列表算法
    “当你在深夜调试代码时，曾续缘的技术专栏始终亮着灯。这是第XX篇原创技术解析，关注我，我们一起把解决问题的过程变得有趣！”HashMap是基于哈希表实现的，通过键的hashCode来快速定位值的存储位置，它允许存储null键和null值。HashMap不保证元素的顺序，特别是它不保证该顺序恒久不变。HashMap是非同步的，它不支持多线程环境下的并发修改。HashMap可以说是Hashtable的
  • 【AI大模型应用开发】精读ToT：论文到源码，看透ToT思维树的实现流程 同学小张 大模型笔记经验分享人工智能AIGC思维树大模型
    大家好，我是同学小张，持续学习C++进阶知识和AI大模型应用实战案例，持续分享，欢迎大家点赞+关注，共同学习和进步。上篇文章（【AI大模型应用开发】从CoT到ToT，再到ReAct，提升大模型推理能力的方式探索（含代码））我们学习了当下提高大模型推理能力的几个主要技术，从CoT（ChainofThought）到TOT（TreeofThought），再到ReAct。关于ReAct的实现方式，我们前面
  • 基于Django框架的服务器监控系统详细设计与具体代码实现 杭州大厂Java程序媛 DeepSeekR1&AI人工智能与大数据javapythonjavascriptkotlingolang架构人工智能
    基于Django框架的服务器监控系统详细设计与具体代码实现1.背景介绍1.1问题由来在互联网和云计算时代，服务器作为数据中心的基础设施，其稳定性和可靠性直接影响着整个系统的运行。随着服务器的数量和复杂度的增加，服务器监控系统变得尤为重要。传统的服务器监控系统往往依赖于单一的工具或平台，难以实现全面、高效的监控需求。Django作为一种流行的PythonWeb框架，因其灵活性、可扩展性和社区支持，成
  • 【面试】Java 中的 BIO、NIO 和 AIO：区别、使用及实例 刘小炮吖i Java后端开发面试题Javajava面试
    在Java的I/O编程领域，BIO、NIO和AIO是三种重要的I/O模型，它们各自有着独特的特点和适用场景。理解这三种模型的区别，对于编写高效、高性能的Java网络应用程序至关重要。一、区别对比项BIO(BlockIO)NIO(NewIO)AIO(AsynchronousI/O)JDK版本所有版本JDK1.4及之后JDK1.7及之后异步/阻塞同步阻塞。一个连接一个线程。线程发起IO请求，不管内核是
  • Android AsyncLayoutInflater异步加载xml布局文件，Kotlin zhangphil Androidkotlinandroidkotlin
    AndroidAsyncLayoutInflater异步加载xml布局文件，Kotlinimplementation"androidx.asynclayoutinflater:asynclayoutinflater:1.1.0-alpha01"importandroid.os.Bundleimportandroid.util.Logimportandroid.view.Viewimportandr
  • STM32实战开发（172）：智能体育训练记录系统 嵌入式开发项目 stm32人工智能深度学习单片机嵌入式硬件lstm
    引言随着人们对健康和运动的关注，体育训练记录系统变得越来越重要。智能体育训练记录系统能够帮助运动员记录、分析并优化他们的训练数据。通过STM32微控制器结合多种传感器和数据存储模块，本文将介绍如何设计和实现一个智能体育训练记录系统。该系统能够实时采集运动员的训练数据，存储数据并通过分析生成训练报告，帮助运动员优化训练方法。项目目标本项目的目标是实现一个智能体育训练记录系统，能够实时记录运动员在训练
  • STM32实战开发（179）：智能体育训练计划反馈系统 嵌入式开发项目 stm32嵌入式硬件单片机深度学习人工智能
    引言随着现代科技的不断发展，运动科学领域也在不断取得突破，尤其是在体育训练中，科技的应用越来越普及。从专业运动员到普通健身爱好者，都开始使用智能设备来优化训练计划，提高训练效率。在这个过程中，智能体育训练计划反馈系统作为一种新型的辅助工具，越来越受到关注。智能体育训练计划反馈系统的主要目标是通过实时监测运动员在训练中的生理和运动状态，提供科学的训练反馈，帮助运动员及时调整训练策略，避免过度训练或者
  • Python Cookbook-2.13 使用C++的类iostream语法 我不会编程555 #Python学习python开发语言windowsc++
    任务C++的基于ostream和操纵符(插入了这种特定的对象后,它会在stream中产生特定的效果)的I/O方式，并想将此形式用在自己的Python程序中。解决方案Python允许使用对特殊方法(即名字前后带有连续两个下划线的方法)进行了重定义的类来重载原有的操作符。为了将>somewhere,"Theaverageof&dand&dis$f\n"%(1,3,(1+3)/2)这种方式是Python
  • Spring Boot拦截器（Interceptor）与过滤器（Filter）详细教程 蹦跑的蜗牛 springboot后端java
    SpringBoot拦截器（Interceptor）与过滤器（Filter）详细教程目录概述什么是拦截器（Interceptor）？什么是过滤器（Filter）？两者的核心区别使用场景拦截器的典型应用过滤器的典型应用实现步骤拦截器的创建与配置过滤器的创建与配置代码示例自定义拦截器自定义过滤器执行顺序与流程过滤器、拦截器、Controller的执行顺序可视化流程图常见问题与解决方案总结1.概述1.1
  • Django数据迁移 jay丿 django数据库sqlite
    在Django中，数据迁移是一个核心功能，它允许你通过定义模型（Models）来自动生成数据库表，并且能够随着模型的变化更新数据库结构。下面是对上述命令的详细解释和扩写，以及一些额外的注意事项和技巧。1.检查应用下的模型是否存在异常在执行任何迁移之前，确保你的模型没有语法错误或逻辑问题是很重要的。你可以使用以下命令来检查特定应用下的模型：pythonmanage.pycheckappNameapp
  • Python笔记 默默前行的蜗牛 python笔记开发语言
    1.如何在windows同时存在两个版本的Python2，Python3将Python2，Python3的路径添加到path中2.如何使用指定的Python版本pippython3-mpipinstalljupyter3.jupyternotebook使用http://blog.csdn.net/lee_j_r/article/details/52791228jupyternotebook4.中文
  • LangChain学习笔记 xiaomu_347 LLM——AIGC学习笔记
    LangChain是一个用来开发大型语言模型（LLM）应用的框架，为了简化构建基于LLM的应用，它能够为开发LLM应用带来如下能力：根据给定的Prompt方便构建上下文，并连接到LLM，得到更加符合查询的回答结果在构建整个基于LLM的应用提供各种工具，如各种模块（Modules）、LCEL、LangGraph等提供工具支持，使用户自己的LLM应用从原型版本到上线到生产环境过程中，一站式的调试、测试
  • 代码随想录刷题学习日记 努力向前ing 代码随想录学习日记算法数据结构学习回溯
    仅为个人记录复盘学习历程，解题思路来自代码随想录代码随想录刷题笔记总结网址:代码随想录40.组合总和II给定一个数组candidates和一个目标数target，找出candidates中所有可以使数字和为target的组合。candidates中的每个数字在每个组合中只能使用一次。说明：所有数字（包括目标数）都是正整数。解集不能包含重复的组合。提供参数：整数数组candicates，目标数tar
  • 基于51单片机的停车场车位管理系统 电子工程师成长日记 51单片机仿真设计51单片机
    具体实现功能由AT89S52单片机+AT24C02数据存储模块+按键模块+LCD1602显示+报警模块等构成。具体功能:（1）显示停车场现有车辆数和已停放过车辆数，总共16个车位，指示灯指示具体的车位占用情况；（2）可以手动设置总车位数以及剩余车位数；（3）车位满后将报警提示。单片机介绍51单片是一种低功耗、高性能CMOS8位微控制器，具有8K在系统可编程Flash存储器。在单芯片上，拥有灵巧的8
  • Esp32蓝牙Hid调用方案 http执行设备、鼠标、键盘相关操作 代码简单说 安卓自动化(autojs)http计算机外设网络协议物联网蓝牙hid
    本文主要介绍Esp32蓝牙Hid相关的多种操作方式，详细的设备、鼠标、键盘相关操作的http调用方法。下面是整理出的所有http调用方法和rhino引擎方式使用前需要一块烧录好的ESP32板子并在手机安装好embedded软件用于蓝牙通信文件地址:https://www.123865.com/s/Qtm4jv-xyZbd?提取码:6666本机调用的话直接使用http://localhost:808
  • 微信小程序自定义圆形进度条实现指南 金融先生-Frank
    本文还有配套的精品资源，点击获取简介：该指南详细讲解了如何在微信小程序中利用canvas组件创建圆形进度条，涵盖了微信小程序基础、Canvas绘图技术、进度条实现、动态角度计算、动画效果实现、事件监听与交互、样式定制以及项目结构和调试发布等关键知识点。开发者通过本指南可以全面掌握微信小程序中自定义图形的实现方法，并深入理解相关技术细节。1.微信小程序框架和API基础在微信小程序的世界里，一个开发者
  • C++输入输出（新手教程） Robots75 c++开发语言
    目录前言C++的输入输出C++风格输入输出C风格输入输出前言在C++中，输入和输出是非常重要的。在洛谷中，几乎每到题都需要用到输入输出。这篇文章就是简单的给大家介绍了输入输出。C++的输入输出C++风格C++风格的cin和cout需要使用iostream库输入输入一个数的示例代码：#includeusingnamespacestd;intmain(){inta;cin>>a;return0;}解释
  • C++输入输出语句 sir___sir6 c++开发语言
    在C++中，常用的输入输出语句主要是通过iostream库提供的cin和cout。这些语句用于从控制台获取输入和向控制台输出内容cin：cin用于从控制台获取输入，通常与提供的变量结合使用。示例：intnum;cin>>num;//从控制台读取一个整数并存储在变量num中输出语句：cout：cout用于向控制台输出内容，可以输出变量的值、文本等。示例：intage=25;coutusingname
  • 个人学习编程(2-26)有关进制转换 Rsecret2 编程笔记学习算法c++
    反序数代码：收录原因：感觉求逆序数更方便，更简洁。#includeintmain(){intn;scanf("%d",&n);intans=0;//将反序的数答案存在这里while(n>0){ans*=10;ans+=(n%10);n/=10;}printf("%d\n",ans);return0;}主要是先对一个数，让0加上他的最后一位（这里通过求余来实现），再除以十获得倒数第二位，依次循环，直
  • 深入浅出Java Annotation(元注解和自定义注解） Josh_Persistence Java Annotation元注解自定义注解
    一、基本概述     　　 Annontation是Java5开始引入的新特征。中文名称一般叫注解。它提供了一种安全的类似注释的机制，用来将任何的信息或元数据（metadata）与程序元素（类、方法、成员变量等）进行关联。   　　更通俗的意思是为程序的元素（类、方法、成员变量）加上更直观更明了的说明，这些说明信息是与程序的业务逻辑无关，并且是供指定的工具或
  • mysql优化特定类型的查询 annan211 java工作mysql
    本节所介绍的查询优化的技巧都是和特定版本相关的，所以对于未来mysql的版本未必适用。 1 优化count查询 对于count这个函数的网上的大部分资料都是错误的或者是理解的都是一知半解的。在做优化之前我们先来看看 真正的count()函数的作用到底是什么。 count()是一个特殊的函数，有两种非常不同的作用，他可以统计某个列值的数量，也可以统计行数。 在统
  • MAC下安装多版本JDK和切换几种方式 棋子chessman jdk
    环境： MAC AIR,OS X 10.10,64位   历史： 过去 Mac 上的 Java 都是由 Apple 自己提供，只支持到 Java 6，并且OS X 10.7 开始系统并不自带（而是可选安装）（原自带的是1.6）。 后来 Apple 加入 OpenJDK 继续支持 Java 6，而 Java 7 将由 Oracle 负责提供。   在终端中输入jav
  • javaScript （1） Array_06 JavaScriptjava浏览器
    JavaScript 1、运算符 　　运算符就是完成操作的一系列符号，它有七类： 　　赋值运算符（=,+=,-=,*=,/=,%=,<<=,>>=,|=,&=）、算术运算符(+,-,*,/,++,--,%)、比较运算符(>,<,<=,>=,==,===,!=,!==)、逻辑运算符(||,&&,!)、条件运算(?:)、位
  • 国内顶级代码分享网站 袁潇含 javajdkoracle.netPHP
           现在国内很多开源网站感觉都是为了利益而做的                  当然利益是肯定的,否则谁也不会免费的去做网站      &
  • Elasticsearch、MongoDB和Hadoop比较 随意而生 mongodbhadoop搜索引擎
      IT界在过去几年中出现了一个有趣的现象。很多新的技术出现并立即拥抱了“大数据”。稍微老一点的技术也会将大数据添进自己的特性，避免落大部队太远，我们看到了不同技术之间的边际的模糊化。假如你有诸如Elasticsearch或者Solr这样的搜索引擎，它们存储着JSON文档，MongoDB存着JSON文档，或者一堆JSON文档存放在一个Hadoop集群的HDFS中。你可以使用这三种配
  • mac os 系统科研软件总结 张亚雄 mac os
    1.1 Microsoft Office for Mac 2011      大客户版，自行搜索。      1.2 Latex （MacTex）:      系统环境：https://tug.org/mactex/     &nb
  • Maven实战（四）生命周期 AdyZhang maven
    1. 三套生命周期     Maven拥有三套相互独立的生命周期，它们分别为clean，default和site。 每个生命周期包含一些阶段，这些阶段是有顺序的，并且后面的阶段依赖于前面的阶段，用户和Maven最直接的交互方式就是调用这些生命周期阶段。 以clean生命周期为例，它包含的阶段有pre-clean, clean 和 post
  • Linux下Jenkins迁移 aijuans Jenkins
    1. 将Jenkins程序目录copy过去      源程序在/export/data/tomcatRoot/ofctest-jenkins.jd.com下面            tar -cvzf jenkins.tar.gz ofctest-jenkins.jd.com &
  • request.getInputStream()只能获取一次的问题 ayaoxinchao requestInputstream
    问题：在使用HTTP协议实现应用间接口通信时，服务端读取客户端请求过来的数据，会用到request.getInputStream()，第一次读取的时候可以读取到数据，但是接下来的读取操作都读取不到数据   原因： 1. 一个InputStream对象在被读取完成后，将无法被再次读取，始终返回-1； 2. InputStream并没有实现reset方法（可以重
  • 数据库SQL优化大总结之 百万级数据库优化方案 BigBird2012 SQL优化
    网上关于SQL优化的教程很多，但是比较杂乱。近日有空整理了一下，写出来跟大家分享一下，其中有错误和不足的地方，还请大家纠正补充。 这篇文章我花费了大量的时间查找资料、修改、排版，希望大家阅读之后，感觉好的话推荐给更多的人，让更多的人看到、纠正以及补充。 1.对查询进行优化，要尽量避免全表扫描，首先应考虑在 where 及 order by 涉及的列上建立索引。 2.应尽量避免在 where
  • jsonObject的使用 bijian1013 javajson
            在项目中难免会用java处理json格式的数据，因此封装了一个JSONUtil工具类。 JSONUtil.java package com.bijian.json.study; import java.util.ArrayList; import java.util.Date; import java.util.HashMap;
  • [Zookeeper学习笔记之六]Zookeeper源代码分析之Zookeeper.WatchRegistration bit1129 zookeeper
    Zookeeper类是Zookeeper提供给用户访问Zookeeper service的主要API，它包含了如下几个内部类     首先分析它的内部类，从WatchRegistration开始，为指定的znode path注册一个Watcher，   /** * Register a watcher for a particular p
  • 【Scala十三】Scala核心七：部分应用函数 bit1129 scala
    何为部分应用函数？ Partially applied function: A function that’s used in an expression and that misses some of its arguments.For instance, if function f has type Int => Int => Int, then f and f(1) are p
  • Tomcat Error listenerStart 终极大法 ronin47 tomcat
    Tomcat报的错太含糊了，什么错都没报出来，只提示了Error listenerStart。为了调试，我们要获得更详细的日志。可以在WEB-INF/classes目录下新建一个文件叫logging.properties，内容如下 Java代码  handlers = org.apache.juli.FileHandler, java.util.logging.ConsoleHa
  • 不用加减符号实现加减法 BrokenDreams 实现
            今天有群友发了一个问题，要求不用加减符号(包括负号)来实现加减法。         分析一下，先看最简单的情况，假设1+1，按二进制算的话结果是10，可以看到从右往左的第一位变为0，第二位由于进位变为1。    
  • 读《研磨设计模式》-代码笔记-状态模式-State bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ /* 当一个对象的内在状态改变时允许改变其行为，这个对象看起来像是改变了其类 状态模式主要解决的是当控制一个对象状态的条件表达式过于复杂时的情况 把状态的判断逻辑转移到表示不同状态的一系列类中，可以把复杂的判断逻辑简化 如果在
  • CUDA程序block和thread超出硬件允许值时的异常 cherishLC CUDA
    调用CUDA的核函数时指定block 和 thread大小，该大小可以是dim3类型的（三维数组），只用一维时可以是usigned int型的。 以下程序验证了当block或thread大小超出硬件允许值时会产生异常！！！GPU根本不会执行运算！！！ 所以验证结果的正确性很重要！！！ 在VS中创建CUDA项目会有一个模板，里面有更详细的状态验证。 以下程序在K5000GPU上跑的。
  • 诡异的超长时间GC问题定位 chenchao051 jvmcmsGChbaseswap
    HBase的GC策略采用PawNew+CMS, 这是大众化的配置，ParNew经常会出现停顿时间特别长的情况，有时候甚至长到令人发指的地步，例如请看如下日志： 2012-10-17T05:54:54.293+0800: 739594.224: [GC 739606.508: [ParNew: 996800K->110720K(996800K), 178.8826900 secs] 3700
  • maven环境快速搭建 daizj 安装mavne环境配置
    一 下载maven 安装maven之前，要先安装jdk及配置JAVA_HOME环境变量。这个安装和配置java环境不用多说。 maven下载地址：http://maven.apache.org/download.html，目前最新的是这个apache-maven-3.2.5-bin.zip，然后解压在任意位置，最好地址中不要带中文字符，这个做java 的都知道，地址中出现中文会出现很多
  • PHP网站安全，避免PHP网站受到攻击的方法 dcj3sjt126com PHP
    对于PHP网站安全主要存在这样几种攻击方式:1、命令注入(Command Injection)2、eval注入(Eval Injection)3、客户端脚本攻击(Script Insertion)4、跨网站脚本攻击(Cross Site Scripting, XSS)5、SQL注入攻击(SQL injection)6、跨网站请求伪造攻击(Cross Site Request Forgerie
  • yii中给CGridView设置默认的排序根据时间倒序的方法 dcj3sjt126com GridView
    public function searchWithRelated() {         $criteria = new CDbCriteria;         $criteria->together = true; //without th
  • Java集合对象和数组对象的转换 dyy_gusi java集合
        在开发中，我们经常需要将集合对象（List，Set）转换为数组对象，或者将数组对象转换为集合对象。Java提供了相互转换的工具，但是我们使用的时候需要注意，不能乱用滥用。 1、数组对象转换为集合对象     最暴力的方式是new一个集合对象，然后遍历数组，依次将数组中的元素放入到新的集合中，但是这样做显然过
  • nginx同一主机部署多个应用 geeksun nginx
    近日有一需求，需要在一台主机上用nginx部署2个php应用，分别是wordpress和wiki，探索了半天，终于部署好了，下面把过程记录下来。 1.   在nginx下创建vhosts目录，用以放置vhost文件。 mkdir vhosts   2.   修改nginx.conf的配置， 在http节点增加下面内容设置，用来包含vhosts里的配置文件 #
  • ubuntu添加admin权限的用户账号 hongtoushizi ubuntuuseradd
    ubuntu创建账号的方式通常用到两种：useradd 和adduser . 本人尝试了useradd方法，步骤如下： 1:useradd    使用useradd时，如果后面不加任何参数的话，如：sudo useradd sysadm 创建出来的用户将是默认的三无用户：无home directory ,无密码,无系统shell。 顾应该如下操作：  
  • 第五章 常用Lua开发库2-JSON库、编码转换、字符串处理 jinnianshilongnian nginxlua
      JSON库   在进行数据传输时JSON格式目前应用广泛，因此从Lua对象与JSON字符串之间相互转换是一个非常常见的功能；目前Lua也有几个JSON库，本人用过cjson、dkjson。其中cjson的语法严格（比如unicode \u0020\u7eaf），要求符合规范否则会解析失败（如\u002），而dkjson相对宽松，当然也可以通过修改cjson的源码来完成
  • Spring定时器配置的两种实现方式OpenSymphony Quartz和java Timer详解 yaerfeng1989 timerquartz定时器
    原创整理不易，转载请注明出处：Spring定时器配置的两种实现方式OpenSymphony Quartz和java Timer详解 代码下载地址：http://www.zuidaima.com/share/1772648445103104.htm 有两种流行Spring定时器配置：Java的Timer类和OpenSymphony的Quartz。 1.Java Timer定时 首先继承jav
  • Linux下df与du两个命令的差别？ pda158 linux
    　一、df显示文件系统的使用情况，与du比較，就是更全盘化。 　　最经常使用的就是 df -T，显示文件系统的使用情况并显示文件系统的类型。 　　举比例如以下： 　　[root@localhost ~]# df -T 　　Filesystem                   Type &n
  • [转]SQLite的工具类 ---- 通过反射把Cursor封装到VO对象 ctfzh VOandroidsqlite反射Cursor
    在写DAO层时，觉得从Cursor里一个一个的取出字段值再装到VO(值对象)里太麻烦了，就写了一个工具类，用到了反射，可以把查询记录的值装到对应的VO里，也可以生成该VO的List。   使用时需要注意： 考虑到Android的性能问题，VO没有使用Setter和Getter，而是直接用public的属性。 表中的字段名需要和VO的属性名一样，要是不一样就得在查询的SQL中
  • 该学习笔记用到的Employee表 vipbooks oraclesql工作
        这是我在学习Oracle是用到的Employee表，在该笔记中用到的就是这张表，大家可以用它来学习和练习。 drop table Employee; -- 员工信息表 create table Employee( -- 员工编号 EmpNo number(3) primary key, -- 姓
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他