WoodK
WoodK

圣杯布局和双飞翼布局的作用和区别

圣杯布局和双飞翼布局解决的问题是一样的，就是两边顶宽，中间自适应的三栏布局，中间栏要在放在文档流前面以优先渲染。

圣杯布局和双飞翼布局解决问题的方案在前一半是相同的，也就是三栏全部float浮动，但左右两栏加上负margin让其跟中间栏div并排，以形成三栏布局。

不同在于解决”中间栏div内容不被遮挡“问题的思路不一样：
圣杯布局，为了中间div内容不被遮挡，将中间div设置了左右padding-left和padding-right后，将左右两个div用相对布局position: relative并分别配合right和left属性，以便左右两栏div移动后不遮挡中间div。

双飞翼布局，为了中间div内容不被遮挡，直接在中间div内部创建子div用于放置内容，在该子div里用margin-left和margin-right为左右两栏div留出位置。
多了1个div，少用大致4个css属性（圣杯布局中间divpadding-left和padding-right这2个属性，加上左右两个div用相对布局position: relative及对应的right和left共4个属性，一共6个；而双飞翼布局子div里用margin-left和margin-right共2个属性，6-2=4），个人感觉比圣杯布局思路更直接和简洁一点。

简单说起来就是”双飞翼布局比圣杯布局多创建了一个div，但不用相对布局了“，而不是你题目中说的”去掉relative"就是双飞翼布局“。
 
最终界面是一样的：

圣杯布局和双飞翼布局的作用和区别_第1张图片

 

对比图：

圣杯布局和双飞翼布局的作用和区别_第2张图片

 

 

下面直接上代码：

圣杯布局：

<body>
<div id="hd">header</div>
<div id="bd">
  <div id="middle">middle</div>
  <div id="left">left</div>
  <div id="right">right</div>
</div>
<div id="footer">footer</div>
</body>



<style>
#hd{
    height:50px;
    background: #666;
    text-align: center;
}
#bd{
    /*左右栏通过添加负的margin放到正确的位置了，此段代码是为了摆正中间栏的位置*/
    padding:0 200px 0 180px;
    height:100px;
}
#middle{
    float:left;
    width:100%;/*左栏上去到第一行*/
    height:100px;
    background:blue;
}
#left{
    float:left;
    width:180px;
    height:100px;
    margin-left:-100%;
    background:#0c9;
    /*中间栏的位置摆正之后，左栏的位置也相应右移，通过相对定位的left恢复到正确位置*/
    position:relative;
    left:-180px;
}
#right{
    float:left;
    width:200px;
    height:100px;
    margin-left:-200px;
    background:#0c9;
    /*中间栏的位置摆正之后，右栏的位置也相应左移，通过相对定位的right恢复到正确位置*/
    position:relative;
    right:-200px;
}
#footer{
    height:50px;
    background: #666;
    text-align: center;
}
</style>

 

双飞翼布局：

<body>
<div id="hd">header</div> 
  <div id="middle">
    <div id="inside">middle</div>
  </div>
  <div id="left">left</div>
  <div id="right">right</div>
  <div id="footer">footer</div>
</body>

<style>
#hd{
    height:50px;
    background: #666;
    text-align: center;
}
#middle{
    float:left;
    width:100%;/*左栏上去到第一行*/     
    height:100px;
    background:blue;
}
#left{
    float:left;
    width:180px;
    height:100px;
    margin-left:-100%;
    background:#0c9;
}
#right{
    float:left;
    width:200px;
    height:100px;
    margin-left:-200px;
    background:#0c9;
}

/*给内部div添加margin，把内容放到中间栏，其实整个背景还是100%*/ 
#inside{
    margin:0 200px 0 180px;
    height:100px;
}
#footer{  
   clear:both; /*记得清楚浮动*/  
   height:50px;     
   background: #666;    
   text-align: center; 
} 
</style>

 

你可能感兴趣的:(圣杯布局和双飞翼布局的作用和区别)

  • 2025年G3 锅炉水处理题目及答案解析 100分题库橙子 经验分享职场和发展
    G3锅炉水处理题目及答案解析：单选题1、《特种设备作业人员证》遗失或者损毁的，持证人员应当及时报告发证部门，并在（）予以公告，查证属实的，由发证部门补发证2。A.发证当地媒体B.寻物启示C.本单位D.从业当地媒体答案：A解析：《特种设备作业人员证》遗失或损毁，应在发证当地媒体公告，以便发证部门核实补发。2、中华人民共和国国务院令（第549号）《国务院关于修改〈特种设备安全监察条例〉的决定》自（）起
  • 2025年CNG 汽车加气站操作工题目分享 100分题库橙子 职场和发展经验分享
    CNG汽车加气站操作工题目分享：单选题1、CNG加气站中，加气机的加气软管应（）进行检查。A.每天B.每周C.每月D.每季度答案：A解析：加气软管是加气操作中频繁使用的部件，每天检查能及时发现磨损、老化等问题，保障加气安全。2、储气罐的安全阀应（）进行校验。A.每年B.每半年C.每季度D.每月答案：A解析：储气罐安全阀按规定应每年校验，以确保其能在规定压力下正常开启，保障设备安全。3、加气站气密试
  • 二建考试的复习规划应该是怎样的？ 100分题库橙子 笔记职场和发展
    二级建造师考试一般包括综合考试和专业考试，综合考试包括《建设工程法规及相关知识》《建设工程施工管理》，专业考试为《专业工程管理与实务》，共6个专业。复习规划可以按照以下几个阶段进行：基础学习阶段（2-3个月）熟悉教材：快速浏览一遍教材，了解教材的整体框架和大致内容，明确各章节的重点和难点。对于法规科目，要熟悉各种法律法规的基本内容；施工管理科目，掌握项目管理的各个环节和流程；专业实务科目，了解工程
  • 2025年工业锅炉司炉证备考题及答案解析 100分题库橙子 笔记经验分享
    工业锅炉司炉证考试的题库题目及答案解析：1、TSGG0001-2012《锅炉安全技术监察规程》规定，在热水系统的（）及（）应当装设集气装置。答案：回水干管；热水锅炉的顶部。解析：热水系统中回水干管及锅炉顶部容易积聚气体，需装设集气装置来排除气体，保证系统正常运行。2、下列哪些措施可有效防止有机热载体的劣化（）。答案：避免超温运行、定期检测与补充、防止氧化、控制酸值等。解析：超温会加速热载体劣化，定
  • 数据结构：单链表的实现 strive-debug 数据结构
    个人主页：strive-debug上一篇，循序表链表的概念与实现概念链表是一种物理存储结构上非连续、非顺序的存储结构。数据元素的逻辑顺序是通过链表中的指针链接次序实现的。单链表的好处是不会浪费空间。比喻可以将单链表想象成一节节火车车厢。每个车厢相当于一个节点，通过锁链（指针）连接起来。单链表只能单向遍历，不能往回遍历。在编写代码时需要考虑头结点是否为空。结构体定义结合前面学到的结构体知识，我们可以
  • 被甲方虐了100次才懂：数据可视化的3个「反直觉」设计原则 千鼎数字孪生-可视化 信息可视化
    被甲方虐了100次才懂：数据可视化的3个「反直觉」设计原则1.减少视觉复杂度以增强可读性在数据可视化中，减少视觉复杂度是提升可读性的关键。尽管丰富的视觉元素如阴影、渐变和复杂的图标可能看起来更加吸引人，但它们往往会使用户感到困惑，增加认知负担。因此，设计师应尽量采用简洁的设计风格，例如扁平化设计（FlatDesign），去除不必要的装饰元素，专注于核心信息的展示。为了实现这一目标，设计师可以利用网
  • 华为 eNSP 链路聚合：从面试问题到实战解析 不羁。。 每日呼吸服务器运维面试华为
    我的个人主页我的专栏：网络通信安全系列、WEB渗透测试系列、内网攻防安全系列、网安红蓝对抗系列希望对网安感兴趣的小伙伴有所帮助！！！点赞收藏关注引言在网络技术领域，链路聚合是提升网络性能和可靠性的关键技术之一。华为eNSP作为网络工程师学习和实践的强大工具，为我们深入理解链路聚合提供了理想的环境。本文将围绕面试中常见的关于华为eNSP链路聚合、手工负载分担模式与LACP扩展配置的问题，进行系统的分
  • 【一维数组】约瑟夫问题 aijg 算法数据结构
    题目描述N个人围成一圈，从第一个开始报数，第M个将被杀掉，再由下一个人开始重新报数，直到最后剩下一个人。例如N=6，M=5，被杀掉的人的序号为5，4，6，2，3。最后剩下1号。输入两个正整数N和M。输出剩下的最后一个人的编号。样例输入复制65样例输出复制1提示N,M均小于10000题目描述N个人围成一圈，从第一个开始报数，第M个将被杀掉，再由下一个人开始重新报数，直到最后剩下一个人。例如N=6，M
  • Linux操作系统配置本地yum源和定时任务 后青春期的诗go 服务器操作系统实战资料linux运维服务器
    操作系统环境：CentOS7.2本地yum源配置1.挂载镜像mount/dev/cdrom/mnt/cdrom2.备份原yum配置mv/etc/yum.repos.d/etc/yum.repos.d.bak3.创建本地yum源配置文件mkdir/etc/yum.repos.dvi/etc/yum.repos.d/CentOS-local.repo添加内容：#本源的名字（不能和其他重复）[base-
  • 局域网技术 落——枫 网络
    1.RSTP的状态：discarding丢弃:如果不转发用户流量也不学习MAC地址learning学习:如果不转发用户流量但学习MAC地址forwarding转发:既转发用户流量也学习MAC地址2.alternate端口作为根端口的备份端口（非根交换机）backup端口作为指定端口的备份（根交换机）3.生成树网桥计算数据：确定根桥：优先级+MAC地址。优先级0-65535，默认32768确定根端口
  • 第十四届蓝桥杯大赛软件赛国赛C/C++ 大学 B 组（部分题解） JIAN LAI 蓝桥杯蓝桥杯c语言c++
    文章目录1子2023思路:代码：2双子数思路：代码：3班级活动思路：代码：4合并数列思路：代码：5数三角思路：代码：7AB路线思路：代码：8抓娃娃思路：代码：1子2023思路:比较基础的线性dp代码：#includeusingnamespacestd;#defineIOSios::sync_with_stdio(0),cin.tie(0),cout.tie(0)#defineendl'\n'#de
  • milvus单节点安装教程 AlphaFree_ milvus
    安装步骤两步，下载.sh文件，启动。文件下载不下来，可直接用附件的sh文件wgethttps://raw.githubusercontent.com/milvus-io/milvus/master/scripts/standalone_embed.shbashstandalone_embed.shstart官网链接RunMilvusinDocker(Linux)|MilvusDocumentati
  • PyQt6实例_批量下载pdf工具_主线程停止线程池 程序猿与金融与科技 PyQt6实例PyQt6
    目录前置：代码：视频：前置：1本系列将以“PyQt6实例_批量下载pdf工具”开头，放在【PyQt6实例】专栏2本系列涉及到的PyQt6知识点：线程池：QThreadPool,QRunnable；信号与槽：pyqtSignal,pyqtSlot；界面：QTextEdit,QLabel,QLineText,QPushButton,QMainWindow,QWidget;布局：QHBoxLayout,
  • AI赋能，防御无界：群联云防护如何颠覆传统DDoS防御格局？ 群联云防护小杜 安全问题汇总人工智能ddostcp/ip网络协议安全网络
    一、AI驱动的动态防御体系智能流量调度群联云防护通过AI算法实时分析流量特征，动态分配清洗节点。当检测到攻击时，系统能在秒级内将流量切换至备用节点，避免单点过载。相较传统高防IP依赖静态规则，群联的调度策略可减少50%的误封率，同时提升30%的清洗效率。技术示例：#模拟智能调度算法（基于节点负载和攻击类型）defselect_node(attack_type,nodes):ifattack_typ
  • 2025年CNG 汽车加气站操作工考试练习题库 100分题库橙子 职场和发展经验分享
    CNG汽车加气站操作工考试练习题库：1、燃气管道降压作业时可将压力控制在（）范围内。A.300Pa～800PaB.500Pa～1000PaC.800Pa～1200PaD.1000Pa～1500Pa答案：A2、CNG的降压过程是一个（）过程。A.散热B.吸热C.无温度变化D.其他答案：B3、CNG加气标准站中的脱硫系统，是来气中含（）量超过车用天然气质量规定值时才需设置。A.一氧化碳B.二氧化碳C.
  • 计算机网络技术在智能家居中的应用深度剖析 xiayan827 网络
    摘要智能家居作为物联网重要应用领域，近年来发展迅速。计算机网络技术是实现智能家居设备互联互通、数据交互与智能控制的核心支撑。本文深入探讨计算机网络技术在智能家居中的多方面应用，分析其面临的问题并提出解决策略，旨在促进智能家居产业的健康发展，为提升家居生活智能化水平提供理论依据。关键词计算机网络技术；智能家居；物联网；应用分析一、引言随着人们生活水平的提高和科技的不断进步，智能家居逐渐走进大众视野。
  • 物联网时代计算机网络技术的新变革与应对分析 xiayan827 网络
    摘要物联网的兴起使万物互联成为现实，计算机网络技术作为其重要支撑，正经历深刻变革。本文剖析物联网时代计算机网络技术在架构、传输、安全等方面的新变革，探讨面临的挑战并提出应对策略，为计算机网络技术适应物联网发展提供思路。关键词物联网；计算机网络技术；变革；应对策略一、引言物联网将物理世界与数字世界深度融合，使各类设备具备感知、通信与智能处理能力。计算机网络技术作为连接物联网设备、传输数据的纽带，在物
  • 医药行业后端系统安全性实施落地方案 我有医保我先冲 AI网络经验分享职场和发展数据库
    医药行业后端系统安全性实施落地方案一、方案概述本方案针对医药行业ERP、WMS、TMS、OMS、MDM、STC、WCS、MFC等核心系统，从架构设计、技术实现、管理策略三个维度构建全方位的安全防护体系。方案遵循HIPAA、GDPR、ISO27001等合规要求，结合零信任架构理念，实现数据全生命周期保护。二、安全架构设计2.1分层防御架构WAF/IPS身份验证服务网格加密存储边界防护层API网关微服
  • 【Linux】Linux系统增加交换空间swap步骤 你住过的屋檐 Linux技术专栏linux运维服务器
    前言  在Linux系统中，交换空间（SwapSpace）是一种虚拟内存机制，用于扩展系统的物理内存（RAM）。当物理内存不足时，操作系统会将部分不常用的内存数据移动到磁盘上的交换空间，从而释放物理内存供其他进程使用。一、检查交换空间情况键入以下指令swapon--show或者free-h如下Swap显示我的服务器没有可用的交换空间：二、创建交换文件  选择一个目录来创建交换文件，通常选择/swa
  • 【Java】全网最详细的SpringBoot集成HikariCP连接池配置 你住过的屋檐 Java技术专栏javaspringboot开发语言
    前言  从SpringBoot2.0版本开始，使用HikariCP做为默认的数据库连接池，HikariCP在性能上表现优异，被公认为是最快的JDBC连接池之一，它还具有良好的稳定性和广泛的兼容性，能够与大多数主流的JDBC框架和数据库引擎无缝集成。因此，无论是从性能还是从易用性的角度来看，HikariCP都是目前springboot项目的首选，如果大家在搭建框架需要HikariCP可以直接看本篇文
  • 【Java】Springboot通过ObjectMapper配置json序列化详解 你住过的屋檐 Java技术专栏javaspringbootjson
    前言  SpringBoot默认集成了Jackson，ObjectMapper是Jackson库中的一个核心类，它是用于将Java对象转换为JSON字符串，以及将JSON字符串转换回Java对象的主要工具。主要用于将数据格式化为指定格式，方便显示。一、ObjectMapper主要提供了以下方法1、configure(SerializationFeaturef,booleanstate);//用于配
  • Pytorch:经典卷积神经网络LeNet实现 Tian_city pytorch深度学习卷积神经网络
    1：前言入门pytoch也有一段时间了，但是似乎基本上都是阅读别人的demo或者相关论文的源码，对框架的布局有了一定的认识，但是对于很多细节的问题仍然不是特别清楚，因此想通过一个小实践来过一遍流程，一是寻找遗漏的细节，二是通过对小项目的文件分割来建立一个相对可扩展的框架，而不是通过一个流水线下来，这样能够对每一个对象和类起到的作用有一个更加直观的把握。2：原理本次博客主要实现最早的卷积神经网络Le
  • java biginteger 构造函数_BigInteger构造函数解析 missapen javabiginteger构造函数
    1、BigInteger(byte[]val)这个构造函数用于转换一个字节数组包含BigInteger的二进制补码，以二进制表示成一个BigInteger。(用字节数组中值的ASCII码构造BigInteger)2、BigInteger(intsignum,byte[]magnitude)此构造函数用于将BigInteger的符号大小表示法转换成一个BigInteger值。(和第一种一样，增加了符
  • 2016北京石油展完美落幕 劲达IBM智能电池组亮相展会 tigerforce IBM智能电池组ibm数据中心智能电池智能电池组
    本届cippe展会开幕当日即迎来了上百个参观团，展会现场海外观众比例大幅提升。伊朗石油部长，伊拉克石油部长，也门石油部长，沙特阿美，阿联酋ADNOC，马来西亚国家石油公司，科威特国家石油公司，委内瑞拉国家石油公司，均派代表约60余人出席展会现场讨论石油行业的未来发展。国内参观团主要由采购部、技术研发部、装备部、工程部等成员构成，参观团带来的采购清单引人瞩目。此外，国家能源局、广西能源局、云南能源局
  • Day78_Flink(四）Flink状态操作 dogedong #flink大数据bigdata
    课程大纲课程内容学习效果掌握目标ProcessFunctionProcessFunction掌握状态编程状态编程掌握容错机制容错机制掌握一、ProcessFunction我们之前学习的转换算子是无法访问事件的时间戳信息和水位线信息的。而这在一些应用场景下，极为重要。例如MapFunction这样的map转换算子就无法访问时间戳或者当前事件的事件时间。基于此，DataStreamAPI提供了一系列的
  • BigDecimal与BigInteger的一些常用方法 小夥 java大数java大数
    BigInteger字段摘要staticBigIntegerONEBigInteger的常量1。staticBigIntegerTENBigInteger的常量10。staticBigIntegerZEROBigInteger的常量0。构造方法摘要BigInteger(byte[]val)将包含BigInteger的二进制补码表示形式的byte数组转换为BigInteger。BigInteger(
  • 基于Redis geo地理位置的实时交通监控平台实现方案 xiyubaby.17 缓存redis
    实时交通监控平台完整实现方案一、系统架构图+-------------------++-------------------++-----------------+|客户端||数据采集层||数据存储层||(App/车载设备)|-->|-API网关|-->|-RedisGEO||-上报交通事件||-数据验证||-RedisStream||-查询拥堵点||-协议转换||-RedisHash|+----
  • PyTorch 2.6.0没有对应的torch-sparse版本，不要下载pytorch最新版本，否则用不了图神经网络torch_geometric 小桥流水---人工智能 Python程序代码python安装库pytorch神经网络人工智能
    报错了Lookinginlinks:https://data.pyg.org/whl/torch-2.6.0+cpu.htmlRequirementalreadysatisfied:torch-scatterinc:\users\qiaolikui\.conda\envs\gdn\lib\site-packages(2.1.2+pt25cpu)ERROR:Couldnotfindaversiont
  • Android图片选择器使用详解 不会写代码的猴子 Androidandroid
    一、概述在Android开发中，图片选择器是一个常见的功能需求，它为用户提供了从设备本地存储中选择图片的能力。这个功能在很多应用中都有广泛的应用，如社交分享、图片编辑、上传头像等。本文将详细探讨Android图片选择器的使用方法，从基本设置到高级配置，帮助开发者更好地实现这一功能。二、基本使用方法首先，要实现图片选择器功能，我们需要在应用的AndroidManifest.xml文件中添加读取外部存
  • Xmind 2025 中文思维导图软件 1alisa xmind
    Xmind2025中文思维导图软件文章目录Xmind2025中文思维导图软件一、介绍二、效果三、下载一、介绍Xmind，是一款出色的思维导图和头脑风暴软件，拥有美观的智能配色方案，便于你轻松理清思路捕捉创意。丰富的导图模板及多种创意整合工具，可助力导图迸发更多活力。还拥有强大演说模式，及提供Markdown、SVG、PNG、PDF、Office等多种导出格式，方便使用思维导图做宣讲与材料分享二、效
  • github中多个平台共存 jackyrong github
    在个人电脑上，如何分别链接比如oschina,github等库呢，一般教程之列的，默认 ssh链接一个托管的而已，下面讲解如何放两个文件 1） 设置用户名和邮件地址 $ git config --global user.name "xx" $ git config --global user.email "test@gmail.com"
  • ip地址与整数的相互转换(javascript) alxw4616 JavaScript
    //IP转成整型 function ip2int(ip){ var num = 0; ip = ip.split("."); num = Number(ip[0]) * 256 * 256 * 256 + Number(ip[1]) * 256 * 256 + Number(ip[2]) * 256 + Number(ip[3]); n
  • 读书笔记-jquey+数据库+css chengxuyuancsdn htmljqueryoracle
    1、grouping ,group by rollup, GROUP BY GROUPING SETS区别 2、$("#totalTable tbody>tr td:nth-child(" + i + ")").css({"width":tdWidth, "margin":"0px", &q
  • javaSE javaEE javaME == API下载 Array_06 java
    oracle下载各种API文档： http://www.oracle.com/technetwork/java/embedded/javame/embed-me/documentation/javame-embedded-apis-2181154.html JavaSE文档： http://docs.oracle.com/javase/8/docs/api/ JavaEE文档： ht
  • shiro入门学习 cugfy javaWeb框架
    声明本文只适合初学者，本人也是刚接触而已，经过一段时间的研究小有收获，特来分享下希望和大家互相交流学习。 首先配置我们的web.xml代码如下，固定格式，记死就成 <filter>         <filter-name>shiroFilter</filter-name> &nbs
  • Array添加删除方法 357029540 js
         刚才做项目前台删除数组的固定下标值时，删除得不是很完整，所以在网上查了下，发现一个不错的方法，也提供给需要的同学。 //给数组添加删除             Array.prototype.del = function(n){
  • navigation bar 更改颜色 张亚雄 IO
    今天郁闷了一下午，就因为objective-c默认语言是英文，我写的中文全是一些乱七八糟的样子，到不是乱码，但是，前两个自字是粗体，后两个字正常体，这可郁闷死我了，问了问大牛，人家告诉我说更改一下字体就好啦，比如改成黑体，哇塞，茅塞顿开。       翻书看，发现，书上有介绍怎么更改表格中文字字体的，代码如下    
  • unicode转换成中文 adminjun unicode编码转换
      在Java程序中总会出现\u6b22\u8fce\u63d0\u4ea4\u5fae\u535a\u641c\u7d22\u4f7f\u7528\u53cd\u9988\uff0c\u8bf7\u76f4\u63a5这个的字符，这是unicode编码，使用时有时候不会自动转换成中文就需要自己转换了使用下面的方法转换一下即可。 /** * unicode 转换成 中文
  • 一站式 Java Web 框架 firefly aijuans Java Web
    Firefly是一个高性能一站式Web框架。 涵盖了web开发的主要技术栈。 包含Template engine、IOC、MVC framework、HTTP Server、Common tools、Log、Json parser等模块。 firefly-2.0_07修复了模版压缩对javascript单行注释的影响，并新增了自定义错误页面功能。 更新日志： 增加自定义系统错误页面功能
  • 设计模式——单例模式 ayaoxinchao 设计模式
    定义          Java中单例模式定义：“一个类有且仅有一个实例，并且自行实例化向整个系统提供。”   分析          从定义中可以看出单例的要点有三个：一是某个类只能有一个实例；二是必须自行创建这个实例；三是必须自行向系统提供这个实例。   &nb
  • Javascript 多浏览器兼容性问题及解决方案 BigBird2012 JavaScript
    不论是网站应用还是学习js,大家很注重ie与firefox等浏览器的兼容性问题，毕竟这两中浏览器是占了绝大多数。 一、document.formName.item(”itemName”) 问题 问题说明：IE下，可以使用 document.formName.item(”itemName”) 或 document.formName.elements ["elementName&quo
  • JUnit-4.11使用报java.lang.NoClassDefFoundError: org/hamcrest/SelfDescribing错误 bijian1013 junit4.11单元测试
            下载了最新的JUnit版本，是4.11，结果尝试使用发现总是报java.lang.NoClassDefFoundError: org/hamcrest/SelfDescribing这样的错误，上网查了一下，一般的解决方案是，换一个低一点的版本就好了。还有人说，是缺少hamcrest的包。去官网看了一下，如下发现：    
  • [Zookeeper学习笔记之二]Zookeeper部署脚本 bit1129 zookeeper
    Zookeeper伪分布式安装脚本(此脚本在一台机器上创建Zookeeper三个进程，即创建具有三个节点的Zookeeper集群。这个脚本和zookeeper的tar包放在同一个目录下，脚本中指定的名字是zookeeper的3.4.6版本，需要根据实际情况修改)：   #!/bin/bash #!!!Change the name!!! #The zookeepe
  • 【Spark八十】Spark RDD API二 bit1129 spark
    coGroup package spark.examples.rddapi import org.apache.spark.{SparkConf, SparkContext} import org.apache.spark.SparkContext._ object CoGroupTest_05 { def main(args: Array[String]) { v
  • Linux中编译apache服务器modules文件夹缺少模块(.so)的问题 ronin47 modules
    在modules目录中只有httpd.exp，那些so文件呢？ 我尝试在fedora core 3中安装apache 2. 当我解压了apache 2.0.54后使用configure工具并且加入了 --enable-so 或者 --enable-modules=so (两个我都试过了) 去make并且make install了。我希望在/apache2/modules/目录里有各种模块，
  • Java基础-克隆 BrokenDreams java基础
            Java中怎么拷贝一个对象呢？可以通过调用这个对象类型的构造器构造一个新对象，然后将要拷贝对象的属性设置到新对象里面。Java中也有另一种不通过构造器来拷贝对象的方式，这种方式称为 克隆。         Java提供了java.lang.
  • 读《研磨设计模式》-代码笔记-适配器模式-Adapter bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ package design.pattern; /* * 适配器模式解决的主要问题是，现有的方法接口与客户要求的方法接口不一致 * 可以这样想，我们要写这样一个类（Adapter）: * 1.这个类要符合客户的要求 ---> 那显然要
  • HDR图像PS教程集锦&心得 cherishLC PS
    HDR是指高动态范围的图像，主要原理为提高图像的局部对比度。 软件有photomatix和nik hdr efex。 一、教程 叶明在知乎上的回答： http://www.zhihu.com/question/27418267/answer/37317792 大意是修完后直方图最好是等值直方图，方法是HDR软件调一遍，再结合不透明度和蒙版细调。 二、心得 1、去除阴影部分的
  • maven-3.3.3 mvn archetype 列表 crabdave ArcheType
    maven-3.3.3 mvn archetype 列表 可以参考最新的：http://repo1.maven.org/maven2/archetype-catalog.xml   [INFO] Scanning for projects... [INFO]                
  • linux shell 中文件编码查看及转换方法 daizj shell中文乱码vim文件编码
    一、查看文件编码。     在打开文件的时候输入:set fileencoding     即可显示文件编码格式。 二、文件编码转换     1、在Vim中直接进行转换文件编码,比如将一个文件转换成utf-8格式       &
  • MySQL--binlog日志恢复数据 dcj3sjt126com binlog
    恢复数据的重要命令如下 mysql> flush logs; 默认的日志是mysql-bin.000001，现在刷新了重新开启一个就多了一个mysql-bin.000002                  
  • 数据库中数据表数据迁移方法 dcj3sjt126com sql
    刚开始想想好像挺麻烦的，后来找到一种方法了，就SQL中的 INSERT 语句，不过内容是现从另外的表中查出来的，其实就是 MySQL中INSERT INTO SELECT的使用   下面看看如何使用   语法：MySQL中INSERT INTO SELECT的使用 1. 语法介绍       有三张表a、b、c，现在需要从表b
  • Java反转字符串 dyy_gusi java反转字符串
           前几天看见一篇文章，说使用Java能用几种方式反转一个字符串。首先要明白什么叫反转字符串，就是将一个字符串到过来啦，比如"倒过来念的是小狗"反转过来就是”狗小是的念来过倒“。接下来就把自己能想到的所有方式记录下来了。 1、第一个念头就是直接使用String类的反转方法，对不起，这样是不行的，因为Stri
  • UI设计中我们为什么需要设计动效 gcq511120594 UIlinux
    随着国际大品牌苹果和谷歌的引领，最近越来越多的国内公司开始关注动效设计了，越来越多的团队已经意识到动效在产品用户体验中的重要性了，更多的UI设计师们也开始投身动效设计领域。 但是说到底，我们到底为什么需要动效设计？或者说我们到底需要什么样的动效？做动效设计也有段时间了，于是尝试用一些案例，从产品本身出发来说说我所思考的动效设计。 一、加强体验舒适度 嗯，就是让用户更加爽更加爽的用
  • JBOSS服务部署端口冲突问题 HogwartsRow java应用服务器jbossserverEJB3
    服务端口冲突问题的解决方法，一般修改如下三个文件中的部分端口就可以了。   1、jboss5/server/default/conf/bindingservice.beans/META-INF/bindings-jboss-beans.xml   2、./server/default/deploy/jbossweb.sar/server.xml   3、.
  • 第三章 Redis/SSDB+Twemproxy安装与使用 jinnianshilongnian ssdbreidstwemproxy
    目前对于互联网公司不使用Redis的很少，Redis不仅仅可以作为key-value缓存，而且提供了丰富的数据结果如set、list、map等，可以实现很多复杂的功能；但是Redis本身主要用作内存缓存，不适合做持久化存储，因此目前有如SSDB、ARDB等，还有如京东的JIMDB，它们都支持Redis协议，可以支持Redis客户端直接访问；而这些持久化存储大多数使用了如LevelDB、RocksD
  • ZooKeeper原理及使用 liyonghui160com
               ZooKeeper是Hadoop Ecosystem中非常重要的组件，它的主要功能是为分布式系统提供一致性协调(Coordination)服务，与之对应的Google的类似服务叫Chubby。今天这篇文章分为三个部分来介绍ZooKeeper，第一部分介绍ZooKeeper的基本原理，第二部分介绍ZooKeeper
  • 程序员解决问题的60个策略 pda158 框架工作单元测试
    根本的指导方针 1. 首先写代码的时候最好不要有缺陷。最好的修复方法就是让 bug 胎死腹中。 良好的单元测试 强制数据库约束 使用输入验证框架 避免未实现的“else”条件 在应用到主程序之前知道如何在孤立的情况下使用   日志 2. print 语句。往往额外输出个一两行将有助于隔离问题。 3. 切换至详细的日志记录。详细的日
  • Create the Google Play Account sillycat Google
    Create the Google Play Account Having a Google account, pay 25$, then you get your google developer account. References: http://developer.android.com/distribute/googleplay/start.html https://p
  • JSP三大指令 vikingwei jsp
    JSP三大指令   一个jsp页面中，可以有0~N个指令的定义！ 1. page --> 最复杂：<%@page language="java" info="xxx"...%>   * pageEncoding和contentType：     > pageEncoding：它
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他