谢家的晓敏
谢家的晓敏

display:flex和三列布局

flex 弹性盒子
在父元素上设置display：flex
弹性改变父元素中的子元素
默认情况下：有一条水平的主轴，所有子元素按照主轴方向排列，在主轴方向没有宽度，在侧轴方向宽度填满。主轴方向元素变多时，自动挤压

父元素属性

flex-direction表示主轴方向：

1.row表示主轴水平方向排列，从左到右，侧轴垂直从上到下
row-reverse表示主轴水平，从右到左排列
2.column表示主轴垂直方向排列，从上到下
column-reverse表示主轴垂直方向排列，从下到上

justify-content表示主轴方向元素排列方式

flex-start:从开始位置排列
flex-end：从主轴结束位置排列
center：所有元素居中排列
space-between ：所有空白填充在子元素之间，左右两个元素顶格
space-around：空白坏绕
space-evenly:表示均分所有的空白元素

aline-items表示侧轴的排列方式

flex-start:从开始位置排列
flex-end：从侧轴结束位置排列
center：所有元素居中排列

flex-wrap表示是否开启换行

no-wrap表示不允许换行
wrap表示可以换行（侧轴不会挤压元素，超出去就溢出）

aline-content表示侧轴的排列方式（整体侧轴）

前提：开启换行，有多行元素时
flex-start:从开始位置排列
flex-end：从侧轴结束位置排列
center：所有元素居中排列
space-between ：所有空白填充在子元素之间，左右两个元素顶格
space-around：空白坏绕
space-evenly:表示均分所有的空白元素

弹性子集上的属性

aline-self表示自己单独一个元素的侧轴排列方式

start 表示自己单独在侧轴的起始位置
end 表示自己单独在侧轴的结束位置
center 表示自己单独居中

flex:设置弹性宽度

比如：设置几个flex的和为20，其中一个flex为5，则该元素占5/20的宽度
挤压宽度的时候优先挤压弹性宽度元素，当弹性宽度不能挤压的时候，挤压定宽元素

order设置优先级

三列布局

左右固定，中间自适应


<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Documenttitle>
    <style>
        *{
      
            margin:0px;
            padding:0px;
            }
        html,body{
      
            width:100%;
            height:100%;
            overflow:hidden;
            }
        body{
      display:flex;}
        div.left{
      
        background:skyblue;
        width:200px;
        height:200px;
        }
        div.center{
      
        background:orange;
        height:200px;
        flex:5;
        }
        div.right{
      
        background:pink;
        height:200px;
        flex:5;
        }
    style>
head>
<body>
    <div class="left">div>
    <div class="center">div>
    <div class="right">div>
    
body>
html>

你可能感兴趣的:(前端面试)

  • 前端面试题总结——JS篇 又又呢 前端javascript开发语言
    一、说说JavaScript中的数据类型？存储上有什么差别？1、数据类型基本类型number：数值类型十进制：letintNum=55八进制（零开头）：letnum1=070十六进制（0x开头）：lethexNum1=0xANaN：特殊数值，意为“不是数值”string：字符串类型boolean：布尔值，true或falseundefined：表示未定义null：空值symbol：是原始值，且符号
  • 前端面试题——5.AjAX的缺点？ 浅端 前端面试题前端面试题
    ①传统的web交互是：用户一个网页动作，就会发送一个http请求到服务器，服务器处理完该请求再返回一个完整的HTML页面，客户端再重新加载，这样极大地浪费了带宽。②AJAX的出现解决了这个问题，它只会向服务器请求用户所需要的数据，并在客户端采用JavaScript处理返回的数据，操作DOM更新页面。③AJXA优点：无刷新更新页面异步服务器通信前端后端负载均衡④AJAX缺点：干掉了Back和Hist
  • 2023高薪前端面试题（二、前端核心——Ajax）
    原生AjaxAjax简介Ajax全程为AsynchronousJavaScript+XML，就是异步的JS和XML通过AJAX可以在浏览器中向服务器发送异步请求，最大的优势是：无刷新获取数据，实现局部刷新Ajax是一种用于创建快速动态网页的技术AJAX不是新的编程语言，而是一种将现有的标准组合在一起使用的新方式Ajax的应用场景页面上拉加载更多数据列表数据无刷新分页表单项离开焦点数据验证搜索框提示
  • 前端面试题——手写实现 ajax 阿水爱踢中锋 ajaxjs前端
    凡是和后台有过数据交互的小伙伴肯定都接触过ajax.我们可以通过ajax来实现页面的无刷新请求数据，这样就能在保证良好用户体验的同时，将更多的内容展示给用户ajax在我们的开发工作中已经司空见惯，几乎所有我们频繁使用的库和框架都提供了经过完善封装后的ajax方法，如jQuery、zepto、angular等等，这使得我们的数据请求变得异常简洁明了但是这也带来了很明显的缺陷，就是我们知道如何去使用封
  • 《前端面试全家桶，从求职准备到面试演练 2024升级TS》课程笔记 半藏森林_ 前端面试笔记
    第2章【第一阶段】高效准备前端技术一面：第一阶段介绍——说说面试的那些事儿2-3先来体验几个面试题typeof能判断哪些类型？何时使用===何时使用==window.onload和DOMContentLoaded的区别？JS创建10个标签，点击的时候弹出对应的序号手写节流throttle、防抖debouncePromise解决了什么问题？思考：拿到一个面试题，你第一时间看到的是什么？如何看待网上搜
  • 2024 web 前端面试总结（春招） 2401_84413092 程序员前端面试职场和发展
    关于基础我一直认为基础都是最重要的，在掘金上面加了个前端的小册群，群里面大多数应该是工作了的人，前两天有人在群里问了下面这道题varvalue=1varfoo={value:2,bar:function(){returnthis.value}}console.log((foo.bar)())然后有的说自执行函数，还有人说为什么不是undefined，为什么不是1，其实就是个很简单的隐式绑定。怎么说
  • 前端面试Javascript手撕题目回顾
    在前端面试中，“手撕代码”环节是考察候选人编程能力和思维逻辑的重要部分。以下是一些常见的手撕代码题目及详细解答：1.实现数组扁平化（FlattenArray）将多维数组转换为一维数组。方法一：递归functionflatten(arr){constresult=[];arr.forEach(item=>{if(Array.isArray(item)){result.push(...flatten(
  • Vue前端面试常问问题详解 GISer_Jinger Vuevue.js前端面试
    在Vue面试中，面试官通常会考察候选人对Vue核心概念、原理和实践的理解。以下是一些常见的Vue面试问题及详细解答：1.Vue的响应式原理是什么？Vue的响应式系统基于**Object.defineProperty()**实现（Vue2.x），核心原理如下：当一个Vue实例创建时，Vue会遍历data选项中的所有属性，使用Object.defineProperty()将这些属性转换为getter/
  • 前端面试的话术集锦第 25 篇博文——CSS面试题上 互联网全栈开发实战 面试专栏-前端后端面试前端面试css跳槽职场和发展职场发展求职招聘
    这是记录前端面试的话术集锦第二十五篇博文——CSS面试题上，我会不断更新该博文。❗❗❗1.介绍一下标准的CSS的盒子模型？与低版本IE的盒子模型有什么不同的？标准盒子模型：宽度=内容的宽度(content)+border+padding+margin低版本IE盒子模型：宽度=内容宽度(content+border+padding)+margin2.box-sizing属性用来控制元素的盒子模型的解
  • 前端面试专栏-算法篇：20. 贪心算法与动态规划入门
    欢迎来到前端面试通关指南专栏！从js精讲到框架到实战，渐进系统化学习，坚持解锁新技能，祝你轻松拿下心仪offer。前端面试通关指南专栏主页前端面试专栏规划详情贪心算法与动态规划入门在计算机科学领域，算法是解决问题的核心工具。而贪心算法与动态规划作为两种重要的算法设计策略，广泛应用于优化问题中。本文将深入浅出地介绍这两种算法的基本概念、适用场景、实现方法，并通过经典案例帮助读者理解和掌握它们的核心思
  • Session：在多个请求之间跟踪用户状态
    前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》、《前端求职突破计划》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》文章目录一、Session的基本概念1.SessionID2.Session数据
  • CORS（跨域资源共享）：跨域请求的解决方案 阿珊和她的猫 javascript前端
    前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》、《前端求职突破计划》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》文章目录一、CORS的基本概念1.简单请求2.预检请求二、设置CORS使用Nod
  • 前端面试题集锦（5）
    目录1、Promsie.all()使用过吗,它是怎么使用的?2、forin和forof循环的区别?3、什么是事件流以及事件流的传播机制?4、token一般存放在哪里?为什么不存放在cookie内?5、数组方法forEach和map的区别?6、ES6中Set和Map的区别?7、0.1+0.2为什么不等于0.3,在项目中遇到要怎么处理?8、什么是模块化思想?9、说说怎么用js写无缝轮播图10、闭包的使
  • Javascript基础内容回顾—变量提升、事件循环和闭包等内容 GISer_Jinger javascript前端
    以下是前端面试中JavaScript基础易错问题的详解，结合常见考点和易混淆概念进行解析：⚠️一、变量作用域与提升varvslet/const◦变量提升：var声明的变量会提升到作用域顶部（值为undefined），而let/const存在暂时性死区（声明前访问报错）。◦循环陷阱：for(vari=0;iconsole.log(i));//输出3,3,3（共享同一作用域）}for(leti=0;i
  • 七牛云前端面试题及参考答案 （上） 大模型大数据攻城狮 前端vue组件reactjs前端面经防抖节流fiber
    目录基本数据类型有哪些？typeofnull的结果是什么？null和undefined的区别是什么？let关键字的特点有哪些？this指向的规则是什么？箭头函数中this指向哪里？如何实现JavaScript的深拷贝和浅拷贝？数组去重的常见方法（手写代码）数组扁平化（手写，不能使用flat(Infinity)）forEach和map方法的区别是什么？闭包的应用场景：实现链式加法add(1)(2)(
  • 前端面试题整理-场景设计题 C_greenbird 前端学习前端javascriptcss
    1.如何使用css画一个三角形借助border实现，在width和height都为0时，设置border，便会呈现三角形。想要哪个方向的三角形，设置其他三边为透明即可。同时，可以通过调整不同边的宽度，来调整三角形的高度和宽度。三角符号/*记忆口诀：盒子宽高均为零，三面边框皆透明。*/div:after{position:absolute;width:0;height:0;content:"";bo
  • 【手写前端面试题01】防抖和节流 全栈前端老曹 javascript前端javascript学习防抖节流
    《手写防抖和节流：从“打工人”到“时间管理大师”》一、本质理解（别被术语吓到）防抖（debounce）是什么？玩游戏看60秒广告只需要完整看一次就行了，退出去一次重新60秒，别一直退✅核心思想：在事件被触发后，等待一段时间，如果这段时间内没有再次触发，才执行。节流（throttle）又是什么？闪现CD：不管多急，都要等冷却好才能再次使用✅核心思想：多次触发→只按固定频率执行，在一定时间内只允许执行
  • uni-app subPackages 分包加载：优化应用性能的利器 阿珊和她的猫 uni-app状态模式
    前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》、《前端求职突破计划》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》文章目录subPackages配置注意事项优点使用场景在uni-app中，sub
  • FlatBuffers（概念、原理及优势、在TS中的使用） 前端杂货铺 TodoList100个小知识FlatBuffersJSON序列化反序列化
    个人简介个人主页：前端杂货铺‍♂️学习方向：主攻前端方向，正逐渐往全干发展个人状态：研发工程师，现效力于中国工业软件事业人生格言：积跬步至千里，积小流成江海推荐学习：前端面试宝典100个小功能Vue2Vue3Vue2/3项目实战Node.js实战Three.js个人推广：每篇文章最下方都有加入方式，旨在交流学习&资源分享，快加入进来吧文章目录介绍在Vue中使用FlatBuffersFlatBuff
  • 前端面试题 被诅咒的猫 前端面试题
    前端面试题：一个200*200的div在不同分辨率屏幕上下左右居中，用css实现div{position:absolute;width:200px;height:200px;top:50%;left:50%;margin-left:-100px;height:-100px;z-index:1000;}写一个左中右布局占满屏幕，其中左右两块是固定宽度200，中间自适应宽，要求先加载中间块，请写出结构
  • `customRef` 在实战中的使用：防抖、计算属性缓存和异步数据获取 阿珊和她的猫 缓存javascriptvue.jstypescript前端
    前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》、《前端求职突破计划》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》文章目录使用场景示例防抖计算属性的缓存异步数据获取总结在Vue3中，custom
  • 响应式数据的判断：Vue3中的方法 阿珊和她的猫 typescriptjavascript前端vue.js
    前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》、《前端求职突破计划》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》文章目录方法一：检查对象是否为Proxy方法二：使用`effect`函数方法三：
  • 前端面试专栏-主流框架：13.vue3组件通信与生命周期 爱分享的程序员 前端面试通关指南vue.js前端javascript
    欢迎来到前端面试通关指南专栏！从js精讲到框架到实战，渐进系统化学习，坚持解锁新技能，祝你轻松拿下心仪offer。前端面试通关指南专栏主页前端面试专栏规划详情Vue3组件通信与生命周期深度解析在Vue3的开发体系中，组件通信与生命周期机制是构建高效、可维护应用的关键。掌握这些核心知识，能帮助开发者更好地组织代码结构，实现组件间的协同工作。接下来，我们将深入剖析Vue3组件通信的多种方式以及组件生命
  • 前端面试专栏-主流框架：12. Vue3响应式原理与API 爱分享的程序员 前端面试通关指南前端javascriptvue.js
    欢迎来到前端面试通关指南专栏！从js精讲到框架到实战，渐进系统化学习，坚持解锁新技能，祝你轻松拿下心仪offer。前端面试通关指南专栏主页前端面试专栏规划详情Vue3响应式原理与API详解一、引言Vue3作为Vue.js框架的重要升级版本，带来了许多令人瞩目的新特性。其中，响应式系统的重构是Vue3最核心的改进之一。Vue3采用了Proxy对象替代了Vue2中的Object.definePrope
  • 创建 uni-app 项目与运行项目 阿珊和她的猫 uni-appvue.jsjavascript前端typescript
    前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》、《前端求职突破计划》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》文章目录安装HBuilderX创建uni-app项目运行uni-app项目使用命
  • 第一次前端面试记录 Daisuki_ 前端面试cssjavascriptvue.js
    第一次前端面试记录应聘职位：互联网前端开发工程师面试方式：电话应聘企业：某电子信息产业集团公司面试流程：简历投递英语面试就是在微信“闪面”小程序和机器人对话，录制你的对话，一共两个问题，每个问题都有三次机会可以重新录制。第一个是英文自我介绍，第二个是“你觉得自己能胜任这份工作的理由”。电话面试上传英语面试结果之后，大概等了三四天，在吃晚饭的时候接到了面试的电话要求，是技术面。HR询问我十分钟之内可
  • 百度前端面试记录 若寒hqq 每天都要督促自己前端面试百度
    刚去就感觉百度的人都特别好，对人好，照顾周到，虽然整体流程不如阿里那么高大上（比如叫号码牌，二维码扫描。。。），但氛围绝对吸引人。先找空闲的面试官，一面面试官ok我选了一个看起来不会为难人的，O(∩_∩)O哈哈哈~面试时间最长了，感觉对我实习公司的项目很感兴趣，然后就一直追着问，记住一定要让面试官抓住一点觉得很欣赏你的这种技术或者思路和做法。然后给我出了个冒泡排序，我在那写，他给我写评语，写完后他
  • 前端面试通关指南专栏规划目录 爱分享的程序员 前端面试通关指南前端node.jsjavascript
    一.专栏简介《前端面试通关指南》专栏系统整理前端核心知识体系，包含JavaScript深度解析、浏览器原理、React/Vue框架技术、算法数据结构等核心内容。专栏采用渐进式学习路径，覆盖原型链、事件循环、虚拟DOM、状态管理等高频考点，同时包含性能优化、工程化实践和前沿技术应用。目前已发布十余篇技术解析文章，后续将持续更新面试实战技巧，助力开发者系统掌握前端技能，轻松斩获心仪offer。前端面试
  • 前端面试十之vuex 闲蛋小超人笑嘻嘻 前端
    Vuex是一个专为Vue.js应用程序设计的状态管理模式和库，它集中管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。以下是关于Vuex的详细介绍：1.核心概念State（状态）它是Vuex中存储状态的地方，类似于普通Vue组件的data选项。所有组件的状态都存储在Vuex的state中，组件通过mapState或直接从Vuex中读取状态。conststore=newVu
  • 自定义 Hook：在 Vue3 中复用逻辑 阿珊和她的猫 javascriptvue.jstypescript前端
    前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》、《前端求职突破计划》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》文章目录创建自定义Hook示例：创建一个自定义Hook用于计数使用自定义Hook
  • jvm调优总结（从基本概念 到 深度优化） oloz javajvmjdk虚拟机应用服务器
    JVM参数详解：http://www.cnblogs.com/redcreen/archive/2011/05/04/2037057.html   Java虚拟机中，数据类型可以分为两类：基本类型和引用类型。基本类型的变量保存原始值，即：他代表的值就是数值本身；而引用类型的变量保存引用值。“引用值”代表了某个对象的引用，而不是对象本身，对象本身存放在这个引用值所表示的地址的位置。
  • 【Scala十六】Scala核心十：柯里化函数 bit1129 scala
    本篇文章重点说明什么是函数柯里化，这个语法现象的背后动机是什么，有什么样的应用场景，以及与部分应用函数(Partial Applied Function)之间的联系   1. 什么是柯里化函数 A way to write functions with multiple parameter lists. For instance def f(x: Int)(y: Int) is a
  • HashMap dalan_123 java
    HashMap在java中对很多人来说都是熟的；基于hash表的map接口的非同步实现。允许使用null和null键；同时不能保证元素的顺序；也就是从来都不保证其中的元素的顺序恒久不变。 1、数据结构     在java中，最基本的数据结构无外乎：数组 和 引用（指针），所有的数据结构都可以用这两个来构造，HashMap也不例外，归根到底HashMap就是一个链表散列的数据
  • Java Swing如何实时刷新JTextArea，以显示刚才加append的内容 周凡杨 java更新swingJTextArea
    在代码中执行完textArea.append("message")后，如果你想让这个更新立刻显示在界面上而不是等swing的主线程返回后刷新，我们一般会在该语句后调用textArea.invalidate()和textArea.repaint()。 问题是这个方法并不能有任何效果，textArea的内容没有任何变化，这或许是swing的一个bug，有一个笨拙的办法可以实现
  • servlet或struts的Action处理ajax请求 g21121 servlet
    其实处理ajax的请求非常简单，直接看代码就行了： //如果用的是struts //HttpServletResponse response = ServletActionContext.getResponse(); // 设置输出为文字流 response.setContentType("text/plain"); // 设置字符集 res
  • FineReport的公式编辑框的语法简介 老A不折腾 finereport公式总结
    FINEREPORT用到公式的地方非常多，单元格（以=开头的便被解析为公式），条件显示，数据字典，报表填报属性值定义，图表标题，轴定义，页眉页脚，甚至单元格的其他属性中的鼠标悬浮提示内容都可以写公式。 简单的说下自己感觉的公式要注意的几个地方：   1.if语句语法刚接触感觉比较奇怪，if(条件式子,值1,值2)，if可以嵌套，if(条件式子1，值1，if(条件式子2，值2，值3)
  • linux mysql 数据库乱码的解决办法 墙头上一根草 linuxmysql数据库乱码
    linux 上mysql数据库区分大小写的配置 lower_case_table_names=1 1-不区分大小写 0-区分大小写   修改/etc/my.cnf 具体的修改内容如下:   [client] default-character-set=utf8   [mysqld] datadir=/var/lib/mysql socket=/va
  • 我的spring学习笔记6-ApplicationContext实例化的参数兼容思想 aijuans Spring 3
    ApplicationContext能读取多个Bean定义文件，方法是： ApplicationContext appContext = new ClassPathXmlApplicationContext（ new String[]｛“bean-config1.xml”，“bean-config2.xml”，“bean-config3.xml”，“bean-config4.xml
  • mysql 基准测试之sysbench annan211 基准测试mysql基准测试MySQL测试sysbench
    1 执行如下命令，安装sysbench-0.5： tar xzvf sysbench-0.5.tar.gz  cd sysbench-0.5  chmod +x autogen.sh  ./autogen.sh  ./configure --with-mysql --with-mysql-includes=/usr/local/mysql
  • sql的复杂查询使用案列与技巧 百合不是茶 oraclesql函数数据分页合并查询
      本片博客使用的数据库表是oracle中的scott用户表;          -------------------  自然连接查询           查询 smith 的上司(两种方法) &
  • 深入学习Thread类 bijian1013 javathread多线程java多线程
    一．             线程的名字 下面来看一下Thread类的name属性，它的类型是String。它其实就是线程的名字。在Thread类中，有String getName()和void setName(String)两个方法用来设置和获取这个属性的值。 同时，Thr
  • JSON串转换成Map以及如何转换到对应的数据类型 bijian1013 javafastjsonnet.sf.json
            在实际开发中，难免会碰到JSON串转换成Map的情况，下面来看看这方面的实例。另外，由于fastjson只支持JDK1.5及以上版本，因此在JDK1.4的项目中可以采用net.sf.json来处理。 一.fastjson实例 JsonUtil.java package com.study; impor
  • 【RPC框架HttpInvoker一】HttpInvoker：Spring自带RPC框架 bit1129 spring
    HttpInvoker是Spring原生的RPC调用框架，HttpInvoker同Burlap和Hessian一样，提供了一致的服务Exporter以及客户端的服务代理工厂Bean，这篇文章主要是复制粘贴了Hessian与Spring集成一文，【RPC框架Hessian四】Hessian与Spring集成   在 【RPC框架Hessian二】Hessian 对象序列化和反序列化一文中
  • 【Mahout二】基于Mahout CBayes算法的20newsgroup的脚本分析 bit1129 Mahout
    #!/bin/bash # # Licensed to the Apache Software Foundation (ASF) under one or more # contributor license agreements. See the NOTICE file distributed with # this work for additional information re
  • nginx三种获取用户真实ip的方法 ronin47
    随着nginx的迅速崛起，越来越多公司将apache更换成nginx. 同时也越来越多人使用nginx作为负载均衡, 并且代理前面可能还加上了CDN加速，但是随之也遇到一个问题：nginx如何获取用户的真实IP地址,如果后端是apache,请跳转到<apache获取用户真实IP地址>，如果是后端真实服务器是nginx，那么继续往下看。 实例环境： 用户IP 120.22.11.11
  • java-判断二叉树是不是平衡 bylijinnan java
    参考了 http://zhedahht.blog.163.com/blog/static/25411174201142733927831/ 但是用java来实现有一个问题。 由于Java无法像C那样“传递参数的地址，函数返回时能得到参数的值”，唯有新建一个辅助类：AuxClass import ljn.help.*; public class BalancedBTree {
  • BeanUtils.copyProperties VS PropertyUtils.copyProperties 诸葛不亮 PropertyUtilsBeanUtils
     BeanUtils.copyProperties VS  PropertyUtils.copyProperties  作为两个bean属性copy的工具类，他们被广泛使用，同时也很容易误用，给人造成困然；比如：昨天发现同事在使用BeanUtils.copyProperties copy有integer类型属性的bean时，没有考虑到会将null转换为0，而后面的业
  • [金融与信息安全]最简单的数据结构最安全 comsci 数据结构
          现在最流行的数据库的数据存储文件都具有复杂的文件头格式，用操作系统的记事本软件是无法正常浏览的，这样的情况会有什么问题呢？        从信息安全的角度来看，如果我们数据库系统仅仅把这种格式的数据文件做异地备份，如果相同版本的所有数据库管理系统都同时被攻击，那么
  • vi区段删除 Cwind linuxvi区段删除
    区段删除是编辑和分析一些冗长的配置文件或日志文件时比较常用的操作。简记下vi区段删除要点备忘。   vi概述    引文中并未将末行模式单独列为一种模式。单不单列并不重要，能区分命令模式与末行模式即可。   vi区段删除步骤： 1. 在末行模式下使用:set nu显示行号 非必须，随光标移动vi右下角也会显示行号，能够正确找到并记录删除开始行
  • 清除tomcat缓存的方法总结 dashuaifu tomcat缓存
    用tomcat容器，大家可能会发现这样的问题，修改jsp文件后，但用IE打开 依然是以前的Jsp的页面。 出现这种现象的原因主要是tomcat缓存的原因。 解决办法如下: 在jsp文件头加上 <meta http-equiv="Expires" content="0"> <meta http-equiv="kiben&qu
  • 不要盲目的在项目中使用LESS CSS dcj3sjt126com Webless
    　如果你还不知道LESS CSS是什么东西，可以看一下这篇文章，是我一朋友写给新人看的《CSS——LESS》 　　不可否认，LESS CSS是个强大的工具，它弥补了css没有变量、无法运算等一些“先天缺陷”，但它似乎给我一种错觉，就是为了功能而实现功能。 　　比如它的引用功能 ? .rounded_corners{     
  • [入门]更上一层楼 dcj3sjt126com PHPyii2
    更上一层楼 通篇阅读完整个“入门”部分，你就完成了一个完整 Yii 应用的创建。在此过程中你学到了如何实现一些常用功能，例如通过 HTML 表单从用户那获取数据，从数据库中获取数据并以分页形式显示。你还学到了如何通过 Gii 去自动生成代码。使用 Gii 生成代码把 Web 开发中多数繁杂的过程转化为仅仅填写几个表单就行。 本章将介绍一些有助于更好使用 Yii 的资源：
  • Apache HttpClient使用详解 eksliang httpclienthttp协议
    Http协议的重要性相信不用我多说了，HttpClient相比传统JDK自带的URLConnection，增加了易用性和灵活性（具体区别，日后我们再讨论），它不仅是客户端发送Http请求变得容易，而且也方便了开发人员测试接口（基于Http协议的），即提高了开发的效率，也方便提高代码的健壮性。因此熟练掌握HttpClient是很重要的必修内容，掌握HttpClient后，相信对于Http协议的了解会
  • zxing二维码扫描功能 gundumw100 androidzxing
    经常要用到二维码扫描功能 现给出示例代码 import com.google.zxing.WriterException; import com.zxing.activity.CaptureActivity; import com.zxing.encoding.EncodingHandler; import android.app.Activity; import an
  • 纯HTML+CSS带说明的黄色导航菜单 ini htmlWebhtml5csshovertree
    HoverTree带说明的CSS菜单:纯HTML+CSS结构链接带说明的黄色导航   在线体验效果：http://hovertree.com/texiao/css/1.htm代码如下,保存到HTML文件可以看到效果：   <!DOCTYPE html > <html > <head> <title>HoverTree
  • fastjson初始化对性能的影响 kane_xie fastjson序列化
    之前在项目中序列化是用thrift，性能一般，而且需要用编译器生成新的类，在序列化和反序列化的时候感觉很繁琐，因此想转到json阵营。对比了jackson，gson等框架之后，决定用fastjson，为什么呢，因为看名字感觉很快。。。   网上的说法：   fastjson 是一个性能很好的 Java 语言实现的 JSON 解析器和生成器，来自阿里巴巴的工程师开发。
  • 基于Mybatis封装的增删改查实现通用自动化sql mengqingyu DAO
    1.基于map或javaBean的增删改查可实现不写dao接口和实现类以及xml，有效的提高开发速度。 2.支持自定义注解包括主键生成、列重复验证、列名、表名等 3.支持批量插入、批量更新、批量删除 <bean id="dynamicSqlSessionTemplate" class="com.mqy.mybatis.support.Dynamic
  • js控制input输入框的方法封装(数字，中文，字母，浮点数等) qifeifei javascript js
    在项目开发的时候，经常有一些输入框，控制输入的格式，而不是等输入好了再去检查格式，格式错了就报错，体验不好。 /** 数字，中文，字母,浮点数(+/-/.) 类型输入限制，只要在input标签上加上 jInput="number,chinese,alphabet,floating" 备注：floating属性只能单独用*/     funct
  • java 计时器应用 tangqi609567707 javatimer
    mport java.util.TimerTask;   import java.util.Calendar;   public class MyTask extends TimerTask {        private static final int
  • erlang输出调用栈信息 wudixiaotie erlang
    在erlang otp的开发中，如果调用第三方的应用，会有有些错误会不打印栈信息，因为有可能第三方应用会catch然后输出自己的错误信息，所以对排查bug有很大的阻碍，这样就要求我们自己打印调用的栈信息。用这个函数：erlang:process_display (self (), backtrace).需要注意这个函数只会输出到标准错误输出。 也可以用这个函数：erlang:get_s
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他