彼岸时光
彼岸时光

学习DIV+CSS网页布局之两列布局

DIV+CSS 网页布局第二篇：两列布局

1、宽度自适应两列布局

　　两列布局可以使用浮动来完成，左列设置左浮动，右列设置右浮动，这样就省的再设置外边距了。

　　当元素使用了浮动之后，会对周围的元素造成影响，那么就需要清除浮动，通常使用两种方法。可以给受到影响的元素设置 clear:both，即清除元素两侧的浮动，也可以设置具体清除哪一侧的浮动：clear:left 或 clear:right，但必须清楚的知道到底是哪一侧需要清除浮动的影响。也可以给浮动的父容器设置宽度，或者为 100%，同时设置 overflow:hidden，溢出隐藏也可以达到清除浮动的效果。

　　同理，两列宽度自适应，只需要将宽度按照百分比来设置，这样当浏览器窗口调整时，内容会根据窗口的大小，按照百分比来自动调节内容的大小。

XML/HTML Code 复制内容到剪贴板
  1. >  
  2. <html>  
  3. <head>  
  4.     <meta charset="UTF-8">  
  5.     <title>宽度自适应两列布局title>  
  6. <style>  
  7. *{margin:0;padding:0;}   
  8. #herder{   
  9.     height:50px;   
  10.     background:blue;   
  11. }   
  12. .main-left{   
  13.     width:30%;   
  14.     height:800px;   
  15.     background:red;   
  16.     float:left;   
  17. }   
  18. .main-right{   
  19.     width:70%;   
  20.     height:800px;   
  21.     background:pink;   
  22.     float:right;   
  23. }   
  24. #footer{   
  25.     clear:both;   
  26.     height:50px;   
  27.     background:gray;   
  28. }   
  29. style>  
  30. head>  
  31. <body>  
  32. <div id="herder">页头div>  
  33. <div class="main-left">左列div>  
  34. <div class="main-right">右列div>  
  35. <div id="footer">页脚div>  
  36. body>  
  37. html>  

2、固定宽度两列布局

　　宽度自适应两列布局在网站中一般很少使用，最常使用的是固定宽度的两列布局。

　　要实现固定宽度的两列布局，也很简单，只需要把左右两列包裹起来，也就是给他们增加一个父容器，然后固定父容器的宽度，父容器的宽度固定了，那么这两列就可以设置具体的像素宽度了，这样就实现了固定宽度的两列布局。

XML/HTML Code 复制内容到剪贴板
  1. >  
  2. <html>  
  3. <head>  
  4.     <meta charset="UTF-8">  
  5.     <title>固定宽度两列布局title>  
  6. <style>  
  7. *{margin:0;padding:0;}   
  8. #herder{   
  9.     height:50px;   
  10.     background:blue;   
  11. }   
  12. #main{   
  13.     width:960px;   
  14.     margin:0 auto;   
  15.     overflow:hidden;   
  16. }   
  17. #main .main-left{   
  18.     width:288px;   
  19.     height:800px;   
  20.     background:red;   
  21.     float:left;   
  22. }   
  23. #main .main-right{   
  24.     width:672px;   
  25.     height:800px;   
  26.     background:pink;   
  27.     float:right;   
  28. }   
  29. #footer{   
  30.     width:960px;   
  31.     height:50px;   
  32.     background:gray;   
  33.     margin:0 auto;   
  34. }   
  35. style>  
  36. head>  
  37. <body>  
  38. <div id="herder">页头div>  
  39. <div id="main">  
  40.     <div class="main-left">左列div>  
  41.     <div class="main-right">右列div>  
  42. div>  
  43. <div id="footer">页脚div>  
  44. body>  
  45. html>  

3、两列居中自适应布局

　　同理，只需要给定父容器的宽度，然后让父容器水平居中。

XML/HTML Code 复制内容到剪贴板
  1. >  
  2. <html>  
  3. <head>  
  4.     <meta charset="UTF-8">  
  5.     <title>两列居中自适应布局title>  
  6. <style>  
  7. *{margin:0;padding:0;}   
  8. #herder{   
  9.     height:50px;   
  10.     background:blue;   
  11. }   
  12. #main{   
  13.     width:80%;   
  14.     margin:0 auto;   
  15.     overflow:hidden;   
  16. }   
  17. #main .main-left{   
  18.     width:20%;   
  19.     height:800px;   
  20.     background:red;   
  21.     float:left;   
  22. }   
  23. #main .main-right{   
  24.     width:80%;   
  25.     height:800px;   
  26.     background:pink;   
  27.     float:right;   
  28. }   
  29. #footer{   
  30.     width:80%;   
  31.     height:50px;   
  32.     background:gray;   
  33.     margin:0 auto;   
  34. }   
  35. style>  
  36. head>  
  37. <body>  
  38. <div id="herder">页头div>  
  39. <div id="main">  
  40.     <div class="main-left">左列div>  
  41.     <div class="main-right">右列div>  
  42. div>  
  43. <div id="footer">页脚div>  
  44. body>  
  45. html>  

4、固定宽度横向两列布局

　　和单列布局相同，可以把所有块包含在一个容器中，这样做方便设置，但增加了无意义的代码，固定宽度就是给定父容器的宽度，然后中间主体使用浮动。

XML/HTML Code 复制内容到剪贴板
  1. >  
  2. <html>  
  3. <head>  
  4.     <meta charset="UTF-8">  
  5.     <title>横向两列布局title>  
  6. <style>  
  7. *{margin:0;padding:0;}   
  8. #warp{   
  9.     width:960px;   
  10.     margin:0 auto;   
  11.     margin-top:10px;   
  12. }   
  13. #herder{   
  14.     height:50px;   
  15.     background:blue;   
  16. }   
  17. #nav{   
  18.     height:30px;   
  19.     background:orange;   
  20.     margin:10px 0;   
  21. }   
  22. #main{   
  23.     width:100%;   
  24.     margin-bottom:10px;   
  25.     overflow:hidden;   
  26. }   
  27. #main .main-left{   
  28.     width:640px;   
  29.     height:200px;   
  30.     background:yellow;   
  31.     float:left;   
  32. }   
  33. #main .main-right{   
  34.     width:300px;   
  35.     height:200px;   
  36.     background:pink;   
  37.     float:right;   
  38. }   
  39. #content{   
  40.     width:100%;   
  41.     overflow:hidden;   
  42. }   
  43. #content .content-left{   
  44.     width:640px;   
  45.     height:800px;   
  46.     background:lightgreen;   
  47.     float:left;   
  48. }   
  49. #content .content-right-sup{   
  50.     width:300px;   
  51.     height:500px;   
  52.     background:lightblue;   
  53.     float:right;   
  54. }   
  55. #content .content-right-sub{   
  56.     width:300px;   
  57.     height:240px;   
  58.     background:purple;   
  59.     margin-top:20px;   
  60.     float:right;   
  61. }   
  62. #footer{   
  63.     height:50px;   
  64.     background:gray;   
  65.     margin-top:10px;   
  66. }   
  67. style>  
  68. head>  
  69. <body>  
  70. <div id="warp">  
  71.     <div id="herder">页头div>  
  72.     <div id="nav">导航div>  
  73.     <div id="main">  
  74.         <div class="main-left">左-上div>  
  75.         <div class="main-right">右-上div>  
  76.     div>  
  77.     <div id="content">  
  78.         <div class="content-left">左-下div>  
  79.         <div class="content-right-sup">右-上div>  
  80.         <div class="content-right-sub">右-下div>  
  81.     div>  
  82.     <div id="footer">页脚div>  
  83. div>  
  84. body>  
  85. html>  

以上就是本文的全部内容，希望对大家的学习有所帮助。

原文：http://www.cnblogs.com/Mtime/p/5272414.html

你可能感兴趣的:(学习DIV+CSS网页布局之两列布局)

  • 大数据和智能数据应用架构系列教程之：大数据与人工智能 AI天才研究院 AI实战大数据AI人工智能Python实战大数据人工智能语言模型JavaPython架构设计
    作者：禅与计算机程序设计艺术1.背景介绍概述“大数据”是指海量、高维、多样化的数据集合。随着人类对数据处理和管理的需求越来越复杂，越来越依赖机器学习、人工智能等新兴技术。在过去的一段时间里，越来越多的人开始关注到“大数据”这一颗龙头。如今，“大数据”已经成为一个新的名词，它既包含了大量的数据，也带来了巨大的价值。因此，研究、开发、应用“大数据”技术也逐渐成为各行各业的专业人才需求。在这个快速发展的
  • 使用onnxruntime-web 运行yolov8-nano推理 CHEN_RUI_2200 机器学习YOLO
    ONNX（OpenNeuralNetworkExchange）模型具有以下两个特点促成了我们可以使用onnxruntime-web直接在web端上运行推理模型，为了让这个推理更直观，我选择了试验下yolov8识别预览图片：1.跨平台兼容性ONNX是一种开放的格式，可以在不同的深度学习框架之间共享模型，如PyTorch、TensorFlow、MXNet和Caffe2。这使得用户可以在一个框架中训练模
  • Javaweb入门-Maven项目学习（Day2） 半截詩 JavaWebmaven学习java
    （一）Maven坐标maven中的坐标是资源的唯一标识，可以通过坐标唯一定义资源位置*使用坐标来定义项目或引入项目中需要的依赖*Maven坐标主要组成*groupld:定义当前Maven项目隶属组织名称（通常是域名的反写，eg:com.Ap）*artifactld:定义当前Maven项目的名称*version:定义当前项目版本号。（二）依赖传递传递依赖需要在pom.xml中指明版本，架包名称和gr
  • EtherCAT主站IGH-- 54 -- IGH之控制电机旋转周期同步位置模式（CSP模式） 常驻客栈 EtherCAT主站-IGHEtherCATEtherCAT主站IGH常驻客栈CSP模式周期同步位置模式igh
    EtherCAT主站IGH--54--IGH之控制电机旋转周期同步位置模式（CSP模式）0Ubuntu18.04系统IGH博客、视频欣赏链接1修改电机的ID一代码实现二编译运行该文档修改记录：总结环境：系统：xenomai3.1主站：IGH电机：松下A6B。该博客功能视频欣赏EtherCAT主站-IGH--54--ubuntu18控制电机旋转（CSP模式）环境：系统：ubuntu18.04，xen
  • LeetCode | 最小路径和的两种解决办法 Mryan2005 #LeetCode#蓝桥那些事leetcode数据结构c++算法开发语言
    第一种：动态规划思路在过去，有这样一个词，那就是遇难则反，从起点推导出最小路径和是困难的，那我们就从终点去推导。解题过程我们都知道一个方块，只能向右或向下。在初始化dp之后，我们会有这样一条关系式：dp[i][j]={grid[m−1][n−1]ifi==m−1andj==n−1min(dp[i+1][j]+grid[i][j],dp[i][j+1]+grid[i][j])ifi+1>&grid)
  • 【C语言算法刷题】第9题 花生_TL00007 C语言算法刷题算法c语言数据结构
    题目描述给定一个非空字符串S，其被N个‘-’分隔成N+1的子串，给定正整数K，要求除第一个子串外，其余的子串每K个字符组成新的子串，并用‘-’分隔。对于新组成的每一个子串，如果它含有的小写字母比大写字母多，则将这个子串的所有大写字母转换为小写字母；反之，如果它含有的大写字母比小写字母多，则将这个子串的所有小写字母转换为大写字母；大小写字母的数量相等时，不做转换。输入输出描述输入两行：第一行为参数K
  • 【C语言算法刷题】第10题 花生_TL00007 C语言算法刷题c语言算法开发语言
    题目描述主管期望你来实现英文输入法单词联想功能。需求如下：依据用户输入的单词前缀，从已输入的英文语句中联想出用户想输入的单词，按字典序输出联想到的单词序列，如果联想不到，请输出用户输入的单词前缀。注意：英文单词联想时，区分大小写缩略形式如”don’t”，判定为两个单词，”don”和”t”输出的单词序列，不能有重复单词，且只能是英文单词，不能有标点符号输入描述输入为两行。首行输入一段由英文单词wor
  • 【python学习】loguru日志库用法大全！附代码示例 NLP仙人 pythonpython学习开发语言
    Loguru是一个用于Python的简单且强大的日志库。它的目标是使日志记录变得简单和优雅，同时提供许多有用的功能。Loguru的主要特点包括：简单易用：不需要复杂的配置，开箱即用。丰富的功能：支持异步日志、日志文件轮转、日志格式化、过滤器等。优雅的语法：通过logger对象的直接方法调用记录日志。下面通过代码演示Loguru的几个最核心的功能：安装Loguru可以通过pip安装Loguru：pi
  • React原理之Fiber详解 jydchudq React.jsreact.js前端前端框架
    前置文章：React原理之React整体架构解读React原理之整体渲染流程-----读懂这一篇需要对React整体架构和渲染流程有大致的概念-----在React原理之React整体架构解读中，简单介绍了Fiber架构，也了解了Fiber节点的概念。Fiber节点是Fiber架构的核心概念之一，它是一种虚拟DOM的实现方式。Fiber本质上是一个对象，使用了链表结构。双重缓冲是一种渲染优化技术，
  • JavaScript|LeetCode|动态规划|62.不同路径 J_learner LeetCodeleetcode算法动态规划
    法1：动态规划方法类同JavaScript|LeetCode|动态规划|64.最小路径和法2想法：使用一个一维数组dp，来保存到达当前行的每个网格的不同路径数到达第一行或第一列的每个网格的不同路径数目均为1到达其他网格的不同路径数目：当前网格上面的一个网格、当前网格左面的一个网格，到达这两者的不同路径数之和/***@param{number}m*@param{number}n*@return{nu
  • Vue项目中使用高德地图 糖糖老师436 前端程序员vue.js前端javascript
    ue项目中使用高德地图在一些简单的大屏类展示应用/网页中，经常会用到地图相关的展示场景，除了一些特殊的三维场景需要用Gis/BIM或者WebGL，一些简单的业务就可以直接使用高德地图或者百度地图来完成。本文主要讲述在Vue项目中高德地图JavaScriptAPI的引用方式以及一些简单的API的使用。演示项目使用vuecli4.0脚手架搭建项目。1.引用在高德地图发布2.0版本之前，通常只能以两种通
  • FSMN-VAD与Silero-VAD Wasser. python语音识别
    引用说明：FSMN-VAD引用魔塔社区项目：https://modelscope.cn/models/iic/speech_fsmn_vad_zh-cn-16k-common-pytorch/summary感谢阿里大佬的开源与介绍。这篇文章主要介绍两种的ASR中的VAD开源模型，第一种就是FSMN-VAD，这个是达摩院语音团队提出的高效语音端点检测模型，用于检测输入音频中有效语音的起止时间点信息。
  • 手撕Diffusion系列 - 第八期(end) - Diffusion推理 小菜鸟博士 手撕Diffusion深度学习人工智能算法面试学习
    手撕Diffusion系列-第八期(end)-Diffusion推理目录手撕Diffusion系列-第八期(end)-Diffusion推理DDPM原理图DDPM反向去噪DIffusion推理代码Part1引入相关库函数Part2定义去噪函数Part3测试参考DDPM原理图DDPM包括两个过程：前向过程（forwardprocess）和反向过程（reverseprocess），其中前向过程又称为扩
  • Maui学习笔记-身份认证和授权案例 Mr.L70517 Maui学习笔记学习笔记iosc#http
    在深入研究身份验证和授权时，可能会遇到很多术语。我们来简单介绍一下。Authentication，简单来讲时认证、验证身份检查用户名和密码，更高级方法设计到指纹、扫描、人脸识别或2FA认证。Authorization，授权，一旦通过身份认证，系统就可以决定当前用户是否有访问某些信息或执行一些操作的授权。OpenAuthorization(OAuth)，开放授权，它允许第三方用户访问你的程序，而无需
  • TypeScript 学习 -类型 - 8 草明 TypeScripttypescript学习javascript
    交叉类型与联合类型交叉类型interfaceDogInterface{run():void;}interfaceCatInterface{jump():void;}letpet:DogInterface&CatInterface={run(){},jump(){},};联合类型只能访问公共的方法约束不可以漏处理某个类型typeShape=Square|Rectangle|Circle;//约束不可
  • TypeScript 学习 -类型 - 9 草明 TypeScripttypescript学习javascript
    声明合并成员变量合并：成员变量会合并，但类型必须一致。成员函数合并：如果函数签名不同，合并后的函数会是签名的联合类型。接口声明顺序：在同一个接口内按顺序合并；不同接口时，后声明的会覆盖前声明的。函数字面量优先级：如果有函数字面量，它们会优先合并。interfacePerson{name:string;}interfacePerson{age:number;}interfacePerson{age:
  • 链表的基础知识 erchazhan 链表网络数据结构
    在大一学习链表的过程中，感觉有许多没有学过的知识，这篇文章，算是我的第一篇学习笔记，可以在后续学习中回顾，有不对的情况可以提出，谢谢大家的建议。#pragmaonce#include#include//#include"SList.h"typedefintSLDateType;//voidSListPrint(SListNode*phead);定义结构体typedefstructNode{SLDa
  • STM32完全学习——0V5640的JPEG模式采集 小A159 学习
    一、写在前面我参考的是买开发板的时候，普中送的资料里面的源码，他那个是用标准库写的，我将他的代码移植到了HAL库，有一些不一样的地方。由于标准库和HAL库的差别造成的。二、编程思路首先初始化OV5640模块，使用的是SCCB总线，和I2C很像，具体的就不说了，再就是将OV5640设置成JPEG输出模式，然后就是调整OV5640输出的图像的大小。下来就是开启DMA传输。然后每捕获一帧图像，DCMI会
  • 深入浅出解析Stable Diffusion中U-Net网络 2301_78234743 java
    题解|#数组中出现次数超过一半的数字#importjava.util.*;publicclassSolution{/***代码中的类名、方法名、参数名已经指定，请勿修改，24秋招腾讯QQ浏览器提前批一面一面（35分钟）先做个自我介绍你应该学过操作系统和计算机网络进程和线程UDP和TCP的区别UDP和TCP如何实现拥塞控制什么情况下用UDP，什么情况下用TCP题解|#牛牛学说话之-浮点数##incl
  • 【Python】探索自然语言处理的利器：THULAC 中文词法分析库详解 技术无疆 Python人工智能自然语言处理人工智能python数据挖掘机器学习深度学习神经网络
    THULAC（THULexicalAnalyzerforChinese）是清华大学开发的一款中文词法分析工具，集成了分词和词性标注两大功能。THULAC拥有强大的分词能力和高效的词性标注，适用于多种中文文本处理场景。该工具能够在保证高准确率的同时保持较快的处理速度，非常适合大规模中文数据处理。⭕️宇宙起点THULAC的特点安装与配置1.使用pip安装2.使用GitHub源码安装♨️使用方法1.分词
  • 渗透测试之 通俗易懂让你搞明白如何做渗透测试【渗透测试之流程(步骤)】 什么是白帽子？ 什么是黑帽子？什么又是黑客 这篇文章让你搞明白 浩浩测试一下 web渗透测试方式方法网络安全python自动化
    目录写在前面的内容：从黑客到黑客的步骤什么是黑客:黑客之步骤:首先：从上面总结性图片我们可以看出黑客得攻击步骤无非就是总结下来分为4个步骤!明确目标信息收集漏洞探测漏洞验证高危漏洞利用总结一下子:写在前面的内容：其实很多小伙伴，都听过黑客这个词汇也对黑客这个职业或者说这个工种很好奇，那么黑客到底是干什么的，是如何进行黑客的一个工作流程的了？这篇文章，我将以大白话+专业术语的方式让大家明白，什么是黑
  • RDD 算子全面解析：从基础到进阶与面试要点 天冬忘忧 Sparkspark大数据
    Spark的介绍与搭建：从理论到实践_spark环境搭建-CSDN博客Spark的Standalone集群环境安装与测试-CSDN博客PySpark本地开发环境搭建与实践-CSDN博客Spark程序开发与提交：本地与集群模式全解析-CSDN博客SparkonYARN：Spark集群模式之Yarn模式的原理、搭建与实践-CSDN博客Spark中RDD的诞生：原理、操作与分区规则-CSDN博客Spar
  • 嵌入式知识点总结 Linux驱动 (四)-中断-软硬中断-上下半部-中断响应 7yewh 【嵌入式知识点总结】linuxmcustm32物联网嵌入式硬件驱动开发硬件工程
    针对于嵌入式软件杂乱的知识点总结起来，提供给读者学习复习对下述内容的强化。目录1.硬中断，软中断是什么？有什么区别？2.中断为什么要区分上半部和下半部？3.中断下半部一般如何实现？4.linux中断的响应执行流程？中断的申请何时执行（何时执行中断处理函数）？1.硬中断，软中断是什么？有什么区别？硬中断：由硬件设备触发，响应时间要求非常快，通常用于紧急事件的处理。软中断：由软件（操作系统）触发，通常
  • 异或哈希. 我爱游戏啊啊啊啊啊啊 算法哈希算法算法数据结构
    异或哈希的底层原理是两个相同的东西哈希值一定相等Description:小B是一个辛勤的农民，他家里种了一棵很大的苹果树。这棵苹果树可以看作一张n个点n-1条边的无向连通图，小B觉得这颗苹果树很脆弱，因为只要剪断任意一条边，苹果树就不连通了，于是他给苹果树新加了m条边。现在这颗苹果树就不像是一棵树了，成了一张n个点n+m-1条边的无向连通图，小Q是小B的好朋友，他觉得这棵树依然很脆弱，他告诉小B，
  • 深入理解 Python 中的 `@classmethod` 和 `@staticmethod` 装饰器 蜗牛沐雨 Pythonpython开发语言
    在Python的面向对象编程中，装饰器为我们提供了灵活的函数和方法定义方式。其中，@classmethod和@staticmethod是两个常用的装饰器，它们的主要作用是改变方法的调用方式，使方法能够在类的层面上使用，而不是依赖具体的实例。什么是@classmethod？@classmethod是Python的内置装饰器，用于将一个方法标记为类方法。类方法的第一个参数通常命名为cls，代表类本身。
  • 360大数据面试题及参考答案 大模型大数据攻城狮 大数据数据治理jvm内存CAS数据开发指标开发数据分析
    数据清理有哪些方法？数据清理是指发现并纠正数据文件中可识别的错误，包括检查数据一致性，处理无效值和缺失值等。常见的数据清理方法有以下几种：去重处理：数据中可能存在重复的记录，这不仅会占用存储空间，还可能影响分析结果。通过对比每条记录的关键属性，若所有关键属性值都相同，则判定为重复记录，可保留其中一条，删除其余重复项。例如在客户信息表中，若有两条记录客户姓名、联系方式、地址等关键信息都一样，就可进行
  • C++基础实战项目：美发店管理系统 卓莲晓Life
    C++基础实战项目：美发店管理系统【下载地址】C基础实战项目美发店管理系统欢迎来到C++基础实战项目——美发店管理系统。本项目专为C++编程初学者设计，旨在通过一个实际的案例加深对C++语言核心概念的理解和应用能力。通过这个项目，你将学习到如何在控制台环境下开发一个简易的管理系统，涵盖客户管理、服务预约、账单处理等基本功能项目地址:https://gitcode.com/open-source-t
  • Python编程从入门到实践(第2版)个人学习笔记 Xx_Studying Python基础python开发语言
    这是本人学习Python编程从入门到实践(第2版)个人学习笔记，书本如下目录一、变量和简单数据类型1.1字符串和数1.1.1字符串部分方法的使用1.1.2f字符串的用法1.1.3删除空白1.1.4数中的下划线1.1.5同时给多个变量赋值二、列表简介2.1列表(list)2.1.1概念引入2.1.2访问列表元素2.1.3查找某元素的下标（index方法）2.2修改、添加和删除元素2.2.1修改列表元
  • 广度优先搜索(BFS)算法解决迷宫最短路径问题 CDSNT 宽度优先算法c++
    问题描述：①迷宫由n行m列的单元格组成（n，m都小于等于50）②每个单元格要么是空地，要么是障碍物现请你找到一条从起点到终点的最短路径，输出最短路径及其长度，若不存在，则输出“NoAnswer.”。输入迷宫大小（n行m列）：5411011111110110111110输入起点的坐标：00输入终点的坐标：32输出：最短路径长度为7最短路径：(0,0)(1,0)(2,0)(3,0)(4,0)(4,1)
  • 【全解析 PTA】浙大版《Python 程序设计》题目集-第三章_len(‘3 11 2018‘(1) 2401_84010901 程序员pythonwindows开发语言
    b[:]##单独一个冒号,代表从头取到尾,步长默认为1b[::]##单独两个冒号一样代表从头取到尾,步长默认为1b[::-1]##注意,两个冒号后面是步长,步长为1,故应从右往左取8.列表lst=[12,-5,-22,-10,-26,35,0,49,3,-21],lst[::-1]的结果是[-21,3,49,0,35,-26,-10,-22,-5,12]。T9.列表lst=[12,-5,-22,-
  • 插入表主键冲突做更新 a-john
    有以下场景： 用户下了一个订单，订单内的内容较多，且来自多表，首次下单的时候，内容可能会不全（部分内容不是必须，出现有些表根本就没有没有该订单的值）。在以后更改订单时，有些内容会更改，有些内容会新增。 问题： 如果在sql语句中执行update操作，在没有数据的表中会出错。如果在逻辑代码中先做查询，查询结果有做更新，没有做插入，这样会将代码复杂化。 解决： mysql中提供了一个sql语
  • Android xml资源文件中@、@android:type、@*、？、@+含义和区别 Cb123456 @+@?@*
    一.@代表引用资源 1.引用自定义资源。格式：@[package:]type/name android：text="@string/hello"   2.引用系统资源。格式：@android:type/name     android:textColor="@android:color/opaque_red"
  • 数据结构的基本介绍 天子之骄 数据结构散列表树、图线性结构价格标签
    数据结构的基本介绍 数据结构就是数据的组织形式，用一种提前设计好的框架去存取数据，以便更方便，高效的对数据进行增删查改。正确选择合适的数据结构，对软件程序的高效执行的影响作用不亚于算法的设计。此外，在计算机系统中数据结构的作用也是非同小可。例如常常在编程语言中听到的栈，堆等，就是经典的数据结构。   经典的数据结构大致如下：   一：线性数据结构 (1)：列表 a
  • 通过二维码开放平台的API快速生成二维码 一炮送你回车库 api
     现在很多网站都有通过扫二维码用手机连接的功能，联图网(http://www.liantu.com/pingtai/)的二维码开放平台开放了一个生成二维码图片的Api,挺方便使用的。闲着无聊，写了个前台快速生成二维码的方法。        html代码如下:(二维码将生成在这div下) ? 1  &nbs
  • ImageIO读取一张图片改变大小 3213213333332132 javaIOimageBufferedImage
    package com.demo; import java.awt.image.BufferedImage; import java.io.File; import java.io.IOException; import javax.imageio.ImageIO; /** * @Description 读取一张图片改变大小 * @author FuJianyon
  • myeclipse集成svn（一针见血） 7454103 eclipseSVNMyEclipse
                                     &n
  • 装箱与拆箱----autoboxing和unboxing darkranger J2SE
    4.2　自动装箱和拆箱 基本数据(Primitive)类型的自动装箱(autoboxing)、拆箱(unboxing)是自J2SE 5.0开始提供的功能。虽然为您打包基本数据类型提供了方便，但提供方便的同时表示隐藏了细节，建议在能够区分基本数据类型与对象的差别时再使用。 4.2.1　autoboxing和unboxing 在Java中，所有要处理的东西几乎都是对象(Object)
  • ajax传统的方式制作ajax aijuans Ajax
    //这是前台的代码 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+
  • 只用jre的eclipse是怎么编译java源文件的？ avords javaeclipsejdktomcat
    eclipse只需要jre就可以运行开发java程序了，也能自动 编译java源代码，但是jre不是java的运行环境么，难道jre中也带有编译工具？ 还是eclipse自己实现的？谁能给解释一下呢问题补充：假设系统中没有安装jdk or jre，只在eclipse的目录中有一个jre，那么eclipse会采用该jre，问题是eclipse照样可以编译java源文件，为什么呢？ &nb
  • 前端模块化 bee1314 模块化
    背景： 前端JavaScript模块化，其实已经不是什么新鲜事了。但是很多的项目还没有真正的使用起来，还处于刀耕火种的野蛮生长阶段。   JavaScript一直缺乏有效的包管理机制，造成了大量的全局变量，大量的方法冲突。我们多么渴望有天能像Java（import），Python (import)，Ruby(require)那样写代码。在没有包管理机制的年代，我们是怎么避免所
  • 处理百万级以上的数据处理 bijian1013 oraclesql数据库大数据查询
    一.处理百万级以上的数据提高查询速度的方法：        1.应尽量避免在 where 子句中使用!=或<>操作符，否则将引擎放弃使用索引而进行全表扫描。         2.对查询进行优化，应尽量避免全表扫描，首先应考虑在 where 及 o
  • mac 卸载 java 1.7 或更高版本 征客丶 javaOS
    卸载 java 1.7 或更高 sudo rm -rf /Library/Internet\ Plug-Ins/JavaAppletPlugin.plugin 成功执行此命令后，还可以执行 java 与 javac 命令 sudo rm -rf /Library/PreferencePanes/JavaControlPanel.prefPane 成功执行此命令后，还可以执行 java
  • 【Spark六十一】Spark Streaming结合Flume、Kafka进行日志分析 bit1129 Stream
    第一步，Flume和Kakfa对接，Flume抓取日志，写到Kafka中 第二部，Spark Streaming读取Kafka中的数据，进行实时分析   本文首先使用Kakfa自带的消息处理（脚本）来获取消息，走通Flume和Kafka的对接 1. Flume配置 1. 下载Flume和Kafka集成的插件，下载地址：https://github.com/beyondj2ee/f
  • Erlang vs TNSDL bookjovi erlang
          TNSDL是Nokia内部用于开发电信交换软件的私有语言，是在SDL语言的基础上加以修改而成，TNSDL需翻译成C语言得以编译执行，TNSDL语言中实现了异步并行的特点，当然要完整实现异步并行还需要运行时动态库的支持，异步并行类似于Erlang的process（轻量级进程），TNSDL中则称之为hand，Erlang是基于vm(beam)开发，
  • 非常希望有一个预防疲劳的java软件, 预防过劳死和眼睛疲劳,大家一起努力搞一个 ljy325 企业应用
    　非常希望有一个预防疲劳的java软件，我看新闻和网站，国防科技大学的科学家累死了，太疲劳，老是加班，不休息，经常吃药，吃药根本就没用，根本原因是疲劳过度。我以前做java,那会公司垃圾，老想赶快学习到东西跳槽离开，搞得超负荷，不明理。深圳做软件开发经常累死人，总有不明理的人，有个软件提醒限制很好，可以挽救很多人的生命。 相关新闻： （1）IT行业成五大疾病重灾区：过劳死平均37.9岁
  • 读《研磨设计模式》-代码笔记-原型模式 bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ /** * Effective Java 建议使用copy constructor or copy factory来代替clone()方法： * 1.public Product copy(Product p){} * 2.publi
  • 配置管理---svn工具之权限配置 chenyu19891124 SVN
    今天花了大半天的功夫，终于弄懂svn权限配置。下面是今天收获的战绩。 安装完svn后就是在svn中建立版本库，比如我本地的是版本库路径是C:\Repositories\pepos。pepos是我的版本库。在pepos的目录结构 pepos    component    webapps 在conf里面的auth里赋予的权限配置为 [groups]
  • 浅谈程序员的数学修养 comsci 设计模式编程算法面试招聘
                                     浅谈程序员的数学修养
  • 批量执行 bulk collect与forall用法 daizj oraclesqlbulk collectforall
    BULK COLLECT 子句会批量检索结果，即一次性将结果集绑定到一个集合变量中，并从SQL引擎发送到PL/SQL引擎。通常可以在SELECT INTO、 FETCH INTO以及RETURNING INTO子句中使用BULK COLLECT。本文将逐一描述BULK COLLECT在这几种情形下的用法。     有关FORALL语句的用法请参考：批量SQL之 F
  • Linux下使用rsync最快速删除海量文件的方法 dongwei_6688 OS
    1、先安装rsync：yum install rsync 2、建立一个空的文件夹：mkdir /tmp/test 3、用rsync删除目标目录：rsync --delete-before -a -H -v --progress --stats /tmp/test/ log/这样我们要删除的log目录就会被清空了，删除的速度会非常快。rsync实际上用的是替换原理，处理数十万个文件也是秒删。
  • Yii CModel中rules验证规格 dcj3sjt126com rulesyiivalidate
    Yii cValidator主要用法分析：  yii验证rulesit 分类： Yii yii的rules验证 cValidator主要属性 attributes ,builtInValidators,enableClientValidation,message,on,safe,skipOnError  
  • 基于vagrant的redis主从实验 dcj3sjt126com vagrant
    平台: Mac 工具: Vagrant 系统: Centos6.5 实验目的: Redis主从   实现思路 制作一个基于sentos6.5, 已经安装好reids的box, 添加一个脚本配置从机, 然后作为后面主机从机的基础box   制作sentos6.5+redis的box   mkdir vagrant_redis cd vagrant_
  • Memcached(二)、Centos安装Memcached服务器 frank1234 centosmemcached
    一、安装gcc rpm和yum安装memcached服务器连接没有找到，所以我使用的是make的方式安装，由于make依赖于gcc，所以要先安装gcc 开始安装，命令如下，[color=red][b]顺序一定不能出错[/b][/color]： 建议可以先切换到root用户，不然可能会遇到权限问题：su root 输入密码...... rpm -ivh kernel-head
  • Remove Duplicates from Sorted List hcx2013 remove
    Given a sorted linked list, delete all duplicates such that each element appear only once. For example,Given 1->1->2, return 1->2.Given 1->1->2->3->3, return&
  • Spring4新特性——JSR310日期时间API的支持 jinnianshilongnian spring4
    Spring4新特性——泛型限定式依赖注入 Spring4新特性——核心容器的其他改进 Spring4新特性——Web开发的增强 Spring4新特性——集成Bean Validation 1.1(JSR-349)到SpringMVC  Spring4新特性——Groovy Bean定义DSL Spring4新特性——更好的Java泛型操作API  Spring4新
  • 浅谈enum与单例设计模式 247687009 java单例
    在JDK1.5之前的单例实现方式有两种(懒汉式和饿汉式并无设计上的区别故看做一种)，两者同是私有构 造器，导出静态成员变量，以便调用者访问。 第一种 package singleton; public class Singleton { //导出全局成员 public final static Singleton INSTANCE = new S
  • 使用switch条件语句需要注意的几点 openwrt cbreakswitch
    1. 当满足条件的case中没有break，程序将依次执行其后的每种条件（包括default）直到遇到break跳出 int main() { int n = 1; switch(n) { case 1: printf("--1--\n"); default: printf("defa
  • 配置Spring Mybatis JUnit测试环境的应用上下文 schnell18 springmybatisJUnit
    Spring-test模块中的应用上下文和web及spring boot的有很大差异。主要试下来差异有： 单元测试的app context不支持从外部properties文件注入属性 @Value注解不能解析带通配符的路径字符串 解决第一个问题可以配置一个PropertyPlaceholderConfigurer的bean。 第二个问题的具体实例是：    
  • Java 定时任务总结一 tuoni javaspringtimerquartztimertask
     Java定时任务总结  一.从技术上分类大概分为以下三种方式：  1.Java自带的java.util.Timer类，这个类允许你调度一个java.util.TimerTask任务;   说明：    java.util.Timer定时器，实际上是个线程，定时执行TimerTask类 &
  • 一种防止用户生成内容站点出现商业广告以及非法有害等垃圾信息的方法 yangshangchuan rank相似度计算文本相似度词袋模型余弦相似度
    本文描述了一种在ITEYE博客频道上面出现的新型的商业广告形式及其应对方法，对于其他的用户生成内容站点类型也具有同样的适用性。   最近在ITEYE博客频道上面出现了一种新型的商业广告形式，方法如下：     1、注册多个账号（一般10个以上）。     2、从多个账号中选择一个账号，发表1-2篇博文
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他