liuyan19891230
liuyan19891230

CSS3D变换/立方体旋转效果

3D变换基于几个比较重要的属性，perspective,translateZ,preserve-3d;
transform-style(preserve-3d)建立3D空间
perspective视镜
perspective-origin视镜基点
x:left/center/right/length/%
y:top/center/bottom/length/%
transform新增函数
rotateX():如果值为正值，元素围绕X轴顺时针旋转；反之，如果值为负值，元素围绕X轴逆时针旋转。
rotateY():如果值为正值，元素围绕Y轴顺时针旋转；反之，如果值为负值，元素围绕Y轴逆时针旋转。
rotateZ():rotateZ()函数指定元素围绕Z轴旋转，如果仅从视觉角度上看，rotateZ()函数让元素顺时针或逆时针旋转，并且效果和rotate()效果等同，
translateZ();让元素在Z轴进行位移，当其值越大时，元素离观看者越近，视觉上元素放大，反之元素缩小。
scaleZ(),scaleZ()在单独使用时，没有任何效果，需要配合其它的变形函数一起使用才会有效果。
transform-orign:旋转的基准点
x:left/center/right/length/%
y:top/center/bottom/length//%
z:length

**3D位移：**CSS3中的3D位移主要包括translateZ()和translate3d()两个功能函数；
**3D旋转：**CSS3中的3D旋转主要包括rotateX()、rotateY()、rotateZ()和rotate3d()四个功能函数；
**3D缩放：**CSS3中的3D缩放主要包括scaleZ()和scale3d()两个功能函数；
**3D矩阵：**CSS3中3D变形中和2D变形一样也有一个3D矩阵功能函数matrix3d()

格式：
舞台(perspective)
容器(3D, preserve-3d)
内容

3D实现立方体盒子：
第一步：先布局好div的位置。

第二步：对每个平面旋转。旋转之前的准备工作：
给舞台加上视镜,perspective(设为800px到1200px之间)
给容器加上3D效果;transform-style:preserve-3d;
上面和下面绕着X轴旋转。左面和右面绕着Y轴旋转，前面在Z轴上移动。旋转时，要设置旋转的基准点，上面以下边为旋转基准，旋转90deg,下面以上边为旋转基点，旋转90deg,左面以右边为旋转基点，旋转90deg,右边以左边作为旋转基点，旋转90deg.然后将前面沿着Z轴方向平移。
如果将视镜加给容器，在容器旋转时，就可以看到异常，如果不给容器加上transform-style:preserve-3d;那么旋转时，就只看到平面在旋转

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style> .stage{perspective: 800px;} .container{width: 150px;height:150px;margin: 200px auto; position: relative; transform-style: preserve-3d;height:200px;transition:5s;transform-origin: center center 75px;} .container .side{position: absolute;width: 150px;height: 150px;border:2px solid #0033FF;text-align: center;line-height: 150px;} .left{left:-152px;transform: rotateY(90deg);transform-origin: right;} .right{left:152px;transform: rotateY(-90deg);transform-origin: left;} .top{top:-152px;transform: rotateX(-90deg);transform-origin: bottom;} .bottom{top:152px;transform: rotateX(90deg);transform-origin: top;} .front{transform: translateZ(152px);z-index:2;} .back{z-index:1;} .container:hover{transform: rotateY(360deg)} </style>
</head>
<body>
    <div class="stage">
        <div class="container">
            <div class="side front">前</div>
            <div class="side back">后</div>
            <div class="side left">左</div>
            <div class="side right">右</div>
            <div class="side top">上</div>
            <div class="side bottom">下</div>
        </div>
    </div>
</body>
</html>

CSS3D变换/立方体旋转效果_第1张图片

第三步：实现3D立方体的旋转
给容器设置旋转中心,我设置的是盒子的正中心进行旋转。这样一个3D立方体的旋转效果就完成了。
为了更好的展示，我们可以将每个面换成是一张图片。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style> .stage{perspective: 800px;} .container{width: 150px;height:150px;margin: 200px auto; position: relative; height:200px;transition:5s;transform-origin: center center 75px;transform-style: preserve-3d;backface-visibility: hidden;} .container .side{position: absolute;width: 150px;height: 150px;border:2px solid #0033FF;text-align: center;line-height: 150px;} .left{left:-152px;transform: rotateY(90deg);transform-origin: right;background: url(../images/photo5.jpg);background-size:100% 100%;} .right{left:152px;transform: rotateY(-90deg);transform-origin: left;background: url(../images/photo4.jpg);background-size:100% 100%;} .top{top:-152px;transform: rotateX(-90deg);transform-origin: bottom;background: url(../images/photo3.jpg);background-size:100% 100%;} .bottom{top:152px;transform: rotateX(90deg);transform-origin: top;background: url(../images/photo2.jpg);background-size:100% 100%;} .front{transform: translateZ(152px);z-index:2;background: url(../images/photo1.jpg);background-size:100% 100%;} .back{z-index:1;background: url(../images/photo.jpg);background-size:100% 100%;} .container:hover{transform: rotateY(360deg)} </style>
</head>
<body>
<div class="stage">
    <div class="container">
        <div class="side front"></div>
        <div class="side back"></div>
        <div class="side left"></div>
        <div class="side right"></div>
        <div class="side top"></div>
        <div class="side bottom"></div>
    </div>
</div>
</body>
</html>

但是这个在旋转时，有一个问题，不该看到的平面也会被看到：
CSS3D变换/立方体旋转效果_第2张图片

相反，如果通过另一种方式来实现，则不会有这个问题。不修改容器的旋转中心，通过将后面，上下左右面沿着Z轴向后平移宽度的一般，然后再将前面向前移动宽度的一般，那么旋转中心就是盒子的中心。
如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style> .stage{perspective: 800px;} .container{width: 150px;height:150px;margin: 200px auto; position: relative; transform-style: preserve-3d;height:200px;transition:5s;} .container .side{position: absolute;width: 150px;height: 150px;border:2px solid #0033FF;text-align: center;line-height: 150px;} .left{left:-152px;transform: translateZ(-75px) rotateY(90deg);transform-origin: right;background: url(../images/photo5.jpg);background-size:100% 100%;} .right{left:152px;transform: translateZ(-75px) rotateY(-90deg);transform-origin: left;background: url(../images/photo4.jpg);background-size:100% 100%;} .top{top:-152px;transform: translateZ(-75px) rotateX(-90deg);transform-origin: bottom;background: url(../images/photo3.jpg);background-size:100% 100%;} .bottom{top:152px;transform:translateZ(-75px) rotateX(90deg);transform-origin: top;background: url(../images/photo2.jpg);background-size:100% 100%;} .back{transform:translateZ(-75px);z-index:1; background: url(../images/photo2.jpg);background-size:100% 100%;} .front{z-index:2;transform:translateZ(75px);background: url(../images/photo.jpg);background-size:100% 100%;} .container:hover{transform: translateZ(-75px) rotateY(360deg);} </style>
</head>
<body>
<div class="stage">
    <div class="container">
        <div class="side front"></div>
        <div class="side back"></div>
        <div class="side left"></div>
        <div class="side right"></div>
        <div class="side top"></div>
        <div class="side bottom"></div>
    </div>
</div>
</body>
</html>

在旋转过程中，一切正常：

CSS3D变换/立方体旋转效果_第3张图片

你可能感兴趣的:(css3,transform,视点,3D变换,立方体旋转)

  • 运城寻访重逢石头纪实【严建设老照片395 集】 我简直能把你想透， 当我走进运城的时候。 我已急得热汗直流， 访问了十九个老头， 把晋南的小城转了三周。 虽然是悠久的思旧， 我仍然是牛样的执... 严建设
    运城寻访重逢石头纪实【严建设老照片395集】我简直能把你想透，当我走进运城的时候。我已急得热汗直流，访问了十九个老头，把晋南的小城转了三周。虽然是悠久的思旧，我仍然是牛样的执拗。说什么变换的世情，泛起了过去的逝流，你就是真正的故友。踏破铁鞋的淡愁，已化为不废功夫的范畴，是就像远在天涯近在咫尺，就像是梦乡的邂逅，我紧紧地攥着你的手。你已长成了高高的个头，俊逸的容颜却很清瘦，你那样顽皮的童音，已变到老
  • 关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript 二挡起步 web前端期末大作业javascripthtmlcss旅游风景
    ⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip
  • HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动 二挡起步 web前端期末大作业web设计网页规划与设计htmlcssjavascriptdreamweaver前端
    Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线
  • 关于Mysql 中 Row size too large (＞ 8126) 错误的解决和理解 秋刀prince mysqlmysql数据库
    提示：啰嗦一嘴，数据库的任何操作和验证前，一定要记得先备份！！！不会有错；文章目录问题发现一、问题导致的可能原因1、页大小2、行格式2.1compact格式2.2Redundant格式2.3Dynamic格式2.4Compressed格式3、BLOB和TEXT列二、解决办法1、修改页大小（不推荐）2、修改行格式3、修改数据类型为BLOB和TEXT列4、其他优化方式（可以参考使用）4.1合理设置数据
  • BART&BERT Ambition_LAO 深度学习
    BART和BERT都是基于Transformer架构的预训练语言模型。模型架构：BERT(BidirectionalEncoderRepresentationsfromTransformers)主要是一个编码器（Encoder）模型，它使用了Transformer的编码器部分来处理输入的文本，并生成文本的表示。BERT特别擅长理解语言的上下文，因为它在预训练阶段使用了掩码语言模型（MLM）任务，即
  • 《 C++ 修炼全景指南：十 》自平衡的艺术：深入了解 AVL 树的核心原理与实现 Lenyiin C++修炼全景指南技术指南c++数据结构stl
    摘要本文深入探讨了AVL树（自平衡二叉搜索树）的概念、特点以及实现细节。我们首先介绍了AVL树的基本原理，并详细分析了其四种旋转操作，包括左旋、右旋、左右双旋和右左双旋，阐述了它们在保持树平衡中的重要作用。接着，本文从头到尾详细描述了AVL树的插入、删除和查找操作，配合完整的代码实现和详尽的注释，使读者能够全面理解这些操作的执行过程。此外，我们还提供了AVL树的遍历方法，包括中序、前序和后序遍历，
  • AI大模型的架构演进与最新发展 季风泯灭的季节 AI大模型应用技术二人工智能架构
    随着深度学习的发展，AI大模型（LargeLanguageModels,LLMs）在自然语言处理、计算机视觉等领域取得了革命性的进展。本文将详细探讨AI大模型的架构演进，包括从Transformer的提出到GPT、BERT、T5等模型的历史演变，并探讨这些模型的技术细节及其在现代人工智能中的核心作用。一、基础模型介绍：Transformer的核心原理Transformer架构的背景在Transfo
  • 【加密算法基础——对称加密和非对称加密】 XWWW668899 网络安全服务器笔记
    对称加密与非对称加密对称加密和非对称加密是两种基本的加密方法，各自有不同的特点和用途。以下是详细比较：1.对称加密特点密钥:使用相同的密钥进行加密和解密。发送方和接收方必须共享这个密钥。速度:通常速度较快，适合处理大量数据。实现:算法相对简单，计算效率高。常见算法AES(高级加密标准)DES(数据加密标准)3DES(三重数据加密标准)RC4(流密码)应用场景文件加密磁盘加密传输大量数据时的加密2.
  • 8 冰鈊夢
    transition动画transform.box{width:200px;height:200px;background-color:gold;margin:50pxauto0;transition:all1sease;}.box:hover{transform:translate(50px,50px);}.box2{width:200px;height:200px;background-col
  • scanf占位符的一些用法 阿玉的屋檐 c语言初学者算法数据结构c语言青少年编程学习
    1.限制输入数据的长度intmain(){inta=123456;scanf("%3d",&a);printf("%d",a);return0;}如果输入的值大于3位则最多读取输入的只读取前3位数据。2.匹配特定字符charss[6];scanf("%[abcd]",ss);%[abcd]表示只读取字符abcd，遇到其它的字符就读取结束，如果abcd字符在字符串的中间部分那么就不能正常读取字符。如
  • ffmpeg批量将tif文件转成jpeg格式 winfredzhang 图像工具ffmpegtifjpeg转换
    1、cmd2、切换到安装ffmpeg的路径。3、输入命令：ffmpeg-start_number001-i"D:\ocr\%03d.tif"-start_number001-pix_fmtyuv420p-qscale:v1"D:\ocr\%03d.jpg"结果。
  • python画图|同时输出二维和三维图 西猫雷婶 python开发语言
    前面已经学习了如何输出二维图和三维图，部分文章详见下述链接：python画图|极坐标下的3Dsurface-CSDN博客python画图|垂线标记系列_如何用pyplot画垂直x轴的线-CSDN博客有时候也需要同时输出二位和三维图，因此有必要学习一下。【1】官网教程首先我们打开官网教程，链接如下。https://matplotlib.org/stable/gallery/mplot3d/mixed
  • 现在做什么副业比较赚钱？现在副业干什么挣钱？ 手机聊天员赚钱平台
    什么副业适合晚上下班？现在很多人白天正常工作，晚上做副业，不仅可以打发无聊的时间，还可以提高收入！有些人的副业收入可能比主营业务收入高！给大家推荐一个陪聊赚米项目叭，正规陪聊项目，网易云旗下大平台，无任何费用，下方有微信二维码，可扫码了解，也可点击链接，联系我们了解：https://www.jianshu.com/p/a8b7493d9f71我长期从事人力资源工作，也认识很多下班后从事副业的人。有
  • 2019-03-19 Fiona_8bba
    春暖花开。上周二鼓励三年级孩子5点下了国际象棋课独自回家。开始是非常害怕，在校门口打了一个电话给爸爸，进门后又打给爸爸说到家了。经过鼓励，周四五点下了3D打印社团，又独立回家了。到周五，问他，你愿意去托管再上隔壁跆拳道还是自己回家，再去跆拳道？他说我愿意自己回家。周末正式和托管说不去了，把孩子的托管课时转入书法。昨天周一第一次3点放学就回家。嘱咐如下：第一步，进门就洗手。第二，按按钮烧水，烫奶。吃
  • 轻量级模型解读——轻量transformer系列 lishanlu136 #图像分类轻量级模型transformer图像分类
    先占坑，持续更新。。。文章目录1、DeiT2、ConViT3、Mobile-Former4、MobileViTTransformer是2017谷歌提出的一篇论文，最早应用于NLP领域的机器翻译工作，Transformer解读，但随着2020年DETR和ViT的出现(DETR解读，ViT解读)，其在视觉领域的应用也如雨后春笋般渐渐出现，其特有的全局注意力机制给图像识别领域带来了重要参考。但是tran
  • 个人学习笔记7-6：动手学深度学习pytorch版-李沐 浪子L 深度学习深度学习笔记计算机视觉python人工智能神经网络pytorch
    #人工智能##深度学习##语义分割##计算机视觉##神经网络#计算机视觉13.11全卷积网络全卷积网络（fullyconvolutionalnetwork，FCN）采用卷积神经网络实现了从图像像素到像素类别的变换。引入l转置卷积（transposedconvolution）实现的，输出的类别预测与输入图像在像素级别上具有一一对应关系：通道维的输出即该位置对应像素的类别预测。13.11.1构造模型下
  • 开发游戏的学习规划 杰克逊的日记 游戏学习
    第一阶段：●C#语言快速系统地学习一遍（基础的语法、面向对象、基础的数据结构、基础的设计模式）●Unity的2D和3D部分及UI、动画、物理系统●阶段性测验：需要去用前面所学的这些基础知识来完成一个简单的2d或者3d的案例，将通过一个自制的《Flappybird》游戏案例讲解游戏开发的思想及方法，并将《Flappybird》这个游戏进一步改造成一个横版射击类游戏《Crazybird》以巩固并且升华
  • 早晨新作现代诗两首：《记忆中背着竹筐送来礼物的外婆》《暗黑童话》！ 千岛油菜子
    图片发自App《记忆中背着竹筐送来礼物的外婆》小心翼翼的路途宛如山间的流水质朴无华而又华丽可爱的在岸边生长出彩色风车旋转着我的小时候而我在您的竹筐里我是一只睡着的记忆百年后却依旧满怀回忆——千岛油菜子写于2019.4.29早晨六点半多一点《暗黑童话》早晨的那只小鸟死了它说它去过远方也去过深海它还说当深海的海星和远方的星空重叠在一起的时候它将再次出生——千岛油菜子写于2019.4.29早晨六点半多
  • opencv学习：图像旋转的两种方法，旋转后的图片进行模板匹配代码实现 夜清寒风 学习opencv机器学习人工智能计算机视觉
    图像旋转在图像处理中，rotate和rot90是两种常见的图像旋转方法，它们在功能和使用上有一些区别。下面我将分别介绍这两种方法，并解释它们的主要区别rot90方法rot90方法是NumPy提供的一种数组旋转函数，它主要用于对二维数组（如图像）进行90度的旋转。这个方法比较简单，只支持90度的倍数旋转，不支持任意角度旋转。使用NumPy进行旋转使用NumPy的rot90函数对模板图像进行旋转操作。
  • 探索创新科技： Lite-Mono - 简约高效的小型化Mono框架 杭律沛Meris
    探索创新科技：Lite-Mono-简约高效的小型化Mono框架Lite-Mono[CVPR2023]Lite-Mono:ALightweightCNNandTransformerArchitectureforSelf-SupervisedMonocularDepthEstimation项目地址:https://gitcode.com/gh_mirrors/li/Lite-Mono如果你在寻找一个轻
  • Python OpenCV图像处理：从基础到高级的全方位指南 极客代码 玩转Python开发语言pythonopencv图像处理计算机视觉
    目录第一部分：PythonOpenCV图像处理基础1.1OpenCV简介1.2PythonOpenCV安装1.3实战案例：图像显示与保存1.4注意事项第二部分：PythonOpenCV图像处理高级技巧2.1图像变换2.2图像增强2.3图像复原第三部分：PythonOpenCV图像处理实战项目3.1图像滤波3.2图像分割3.3图像特征提取第四部分：PythonOpenCV图像处理注意事项与优化策略4
  • 【机器人建模和控制】读书笔记 Piccab0o 机器人
    机器人建模和控制——马克·斯庞A.x10=x1∙x0x^0_1=x_1\bulletx_0x10=x1∙x0，其实就是：1）x1x_1x1轴向量在O0O_0O0系下的坐标2）在x0x_0x0轴上的投影3）坐标变换矩阵的R10R_1^0R10的第一个元素B.点p在o1x1y1z1o_1x_1y_1z_1o1x1y1z1系下的坐标p1p^1p1可以表示为：p=ux1+vy1+wz1p=ux_1+vy_
  • Matlab在工业机器人中的运用,基于MATLAB的工业机器人建模与仿真.docx weixin_34518801
    摘要：机器人运动系统作为机器人系统中最重要的组成部分之一，其重要性不言而喻，因为它影响着机器人的主要性能，因此为了提高机器人的质量，对机器人进行运动学分析和仿真是不可或缺的。本次毕业设计主要对KUKA机器人的三维仿真进行了一系列的分析，主要是以下几个内容：(1)研究了机器人运动学仿真的背景意义及发展趋势。(2)通过对齐次坐标变换理论的研究,说明了KUKA机器人结构及参数,并且建立了相应的D-H参数
  • cmd泛滥_与您的后泛滥同事见面：人工智能机器人 weixin_26644585 人工智能leetcode
    cmd泛滥Readytoswapyouroldcube-mateforadisembodiedAI?IPsoftCEOChetanDube,creatorofAIco-workerAMELIA,giveshistakeonthepost-COVIDofficelandscape.准备将您的旧立方体伙伴换成无形的AI？AIsoft同事AMELIA的创始人IPsoft首席执行官ChetanDube阐述
  • 详解C语言中的循环语句 埋头编程~ C语言c语言开发语言
    文章目录1.前言2.while循环2.1if和whlie的对比2.2while语句的工作机制2.3while循环的实践3.for循环3.1for循环语法3.2for循环的工作机制3.3for循环实践4dowhile循环4.1dowhlie循环语法4.2dowhile循环的工作机理4.3dowhile循环实践5.break和continue语句5.1break举例5.2continue举例6.got
  • OrangePi5 RK3588本地部署基于Cesium的WebGL应用 vinlandtech webgl
    基于OranglePi5平台，本地部署WebGIS应用步骤：1、下载oranglepi5ubuntu22.04镜像，按用户手册进行烧写。链接：https://pan.baidu.com/s/1g-TO3DeIl1M1JfAPHbCyxg提取码：vlzt2、下载安装WebGL工具包。该软件包针对RK3588WebGL应用进行一定优化。链接：https://pan.baidu.com/s/1jP__h
  • 我什么都爱，爱上墨蓝色天空，跑步13公里 爱美食爱马甲线
    我什么都爱，爱上墨蓝色天空，跑步13公里一个地方，连续去三次晨跑什么感受？我很少一个地方连续去三次。喜欢不断变换场地跑步，那些多年固守一个地方跑步的人我真的特别佩服，我是做不到的。跑步终究太枯燥了，倘若没有一点变化，我简直坚持不下去。我之所以愿意一连三天去江滩，因为江滩值得留恋。前天我路跑22公里，第8公里进入江滩跑步，在那里跑了10公里打道回府；昨天我练习拉一下心率快速跑，我只跑了5公里；今晨，
  • 解决BERT模型bert-base-chinese报错（无法自动联网下载） 搬砖修狗 bert人工智能深度学习python
    一、下载问题hugging-face是访问BERT模型的最初网站，但是目前hugging-face在中国多地不可达，在代码中涉及到该网站的模型都会报错，本文我们就以bert-base-chinese报错为例，提供一个下载到本地的方法来解决问题。二、网站google-bert(BERTcommunity)Thisorganizationismaintainedbythetransformerstea
  • 2.8.5Django --8.2 单表操作 寒暄_HX
    Django目录：https://www.jianshu.com/p/dc36f62b3dc5Yuan先生-Django模型层（1）Django与SQLAlchemy的ORM操作本质上是一样的，但是语法略有不同，如果是用Django进行开发最好使用原生的ORM或者直接使用原生SQL。创建表app06创建模型在app06中的models.py文件内，新建一个模板。one_exa.app06.mode
  • Win11安装mysql5.7.24  嘘  MYSQLmysql
    Win11安装mysql5.7.24资源文件mysql安装过程资源文件mysql5.7.24免安装压缩包下载链接：https://download.csdn.net/download/weixin_44174685/89738053DirectX（用来修复缺失dll）下载链接：https://download.csdn.net/download/weixin_44174685/89737971my
  • 安装数据库首次应用 Array_06 javaoraclesql
    可是为什么再一次失败之后就变成直接跳过那个要求 enter full pathname of java.exe的界面 这个java.exe是你的Oracle 11g安装目录中例如：【F:\app\chen\product\11.2.0\dbhome_1\jdk\jre\bin】下的java.exe 。不是你的电脑安装的java jdk下的java.exe！ 注意第一次，使用SQL D
  • Weblogic Server Console密码修改和遗忘解决方法 bijian1013 Welogic
            在工作中一同事将Weblogic的console的密码忘记了，通过网上查询资料解决，实践整理了一下。 一.修改Console密码         打开weblogic控制台，安全领域 --> myrealm -->&n
  • IllegalStateException: Cannot forward a response that is already committed Cwind javaServlets
    对于初学者来说，一个常见的误解是：当调用 forward() 或者 sendRedirect() 时控制流将会自动跳出原函数。标题所示错误通常是基于此误解而引起的。 示例代码： protected void doPost() { if (someCondition) { sendRedirect(); } forward(); // Thi
  • 基于流的装饰设计模式 木zi_鸣 设计模式
    当想要对已有类的对象进行功能增强时，可以定义一个类，将已有对象传入，基于已有的功能，并提供加强功能。 自定义的类成为装饰类 模仿BufferedReader，对Reader进行包装，体现装饰设计模式 装饰类通常会通过构造方法接受被装饰的对象，并基于被装饰的对象功能，提供更强的功能。 装饰模式比继承灵活，避免继承臃肿，降低了类与类之间的关系 装饰类因为增强已有对象，具备的功能该
  • Linux中的uniq命令 被触发 linux
    Linux命令uniq的作用是过滤重复部分显示文件内容，这个命令读取输入文件，并比较相邻的行。在正常情 况下，第二个及以后更多个重复行将被删去，行比较是根据所用字符集的排序序列进行的。该命令加工后的结果写到输出文件中。输入文件和输出文件必须不同。如 果输入文件用“- ”表示，则从标准输入读取。 AD： uniq [选项] 文件 说明：这个命令读取输入文件，并比较相邻的行。在正常情况下，第二个
  • 正则表达式Pattern 肆无忌惮_ Pattern
    正则表达式是符合一定规则的表达式，用来专门操作字符串，对字符创进行匹配，切割，替换，获取。   例如，我们需要对QQ号码格式进行检验 规则是长度6~12位  不能0开头  只能是数字，我们可以一位一位进行比较，利用parseLong进行判断，或者是用正则表达式来匹配[1-9][0-9]{4,14} 或者 [1-9]\d{4,14} &nbs
  • Oracle高级查询之OVER (PARTITION BY ..) 知了ing oraclesql
    一、rank()/dense_rank() over(partition by ...order by ...) 现在客户有这样一个需求，查询每个部门工资最高的雇员的信息，相信有一定oracle应用知识的同学都能写出下面的SQL语句： select e.ename, e.job, e.sal, e.deptno from scott.emp e, (se
  • Python调试 矮蛋蛋 pythonpdb
    原文地址： http://blog.csdn.net/xuyuefei1988/article/details/19399137 1、下面网上收罗的资料初学者应该够用了，但对比IBM的Python 代码调试技巧： IBM：包括 pdb 模块、利用 PyDev 和 Eclipse 集成进行调试、PyCharm 以及 Debug 日志进行调试： http://www.ibm.com/d
  • webservice传递自定义对象时函数为空，以及boolean不对应的问题 alleni123 webservice
    今天在客户端调用方法 NodeStatus status=iservice.getNodeStatus(). 结果NodeStatus的属性都是null。 进行debug之后，发现服务器端返回的确实是有值的对象。 后来发现原来是因为在客户端，NodeStatus的setter全部被我删除了。 本来是因为逻辑上不需要在客户端使用setter， 结果改了之后竟然不能获取带属性值的
  • java如何干掉指针，又如何巧妙的通过引用来操作指针————>说的就是java指针 百合不是茶
    C语言的强大在于可以直接操作指针的地址，通过改变指针的地址指向来达到更改地址的目的,又是由于c语言的指针过于强大，初学者很难掌握， java的出现解决了c，c++中指针的问题 java将指针封装在底层，开发人员是不能够去操作指针的地址，但是可以通过引用来间接的操作：   定义一个指针p来指向a的地址（&是地址符号）：        
  • Eclipse打不开，提示“An error has occurred.See the log file ***/.log” bijian1013 eclipse
    打开eclipse工作目录的\.metadata\.log文件，发现如下错误： !ENTRY org.eclipse.osgi 4 0 2012-09-10 09:28:57.139 !MESSAGE Application error !STACK 1 java.lang.NoClassDefFoundError: org/eclipse/core/resources/IContai
  • spring aop实例annotation方法实现 bijian1013 javaspringAOPannotation
            在spring aop实例中我们通过配置xml文件来实现AOP，这里学习使用annotation来实现，使用annotation其实就是指明具体的aspect,pointcut和advice。1.申明一个切面(用一个类来实现)在这个切面里,包括了advice和pointcut AdviceMethods.jav
  • [Velocity一]Velocity语法基础入门 bit1129 velocity
    用户和开发人员参考文档 http://velocity.apache.org/engine/releases/velocity-1.7/developer-guide.html   注释 1.行级注释## 2.多行注释#*  *#   变量定义 使用$开头的字符串是变量定义，例如$var1, $var2,   赋值 使用#set为变量赋值，例
  • 【Kafka十一】关于Kafka的副本管理 bit1129 kafka
    1. 关于request.required.acks   request.required.acks控制者Producer写请求的什么时候可以确认写成功，默认是0， 0表示即不进行确认即返回。 1表示Leader写成功即返回，此时还没有进行写数据同步到其它Follower Partition中 -1表示根据指定的最少Partition确认后才返回，这个在   Th
  • lua统计nginx内部变量数据 ronin47 lua nginx　 统计
    server { listen 80; server_name photo.domain.com; location /{set $str $uri; content_by_lua ' local url = ngx.var.uri local res = ngx.location.capture(
  • java-11.二叉树中节点的最大距离 bylijinnan java
    import java.util.ArrayList; import java.util.List; public class MaxLenInBinTree { /* a. 1 / \ 2 3 / \ / \ 4 5 6 7 max=4 pass "root"
  • Netty源码学习-ReadTimeoutHandler bylijinnan javanetty
    ReadTimeoutHandler的实现思路： 开启一个定时任务，如果在指定时间内没有接收到消息，则抛出ReadTimeoutException 这个异常的捕获，在开发中，交给跟在ReadTimeoutHandler后面的ChannelHandler，例如 private final ChannelHandler timeoutHandler = new ReadTim
  • jquery验证上传文件样式及大小(好用) cngolon 文件上传jquery验证
    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="jquery1.8/jquery-1.8.0.
  • 浏览器兼容【转】 cuishikuan css浏览器IE
    浏览器兼容问题一：不同浏览器的标签默认的外补丁和内补丁不同 问题症状：随便写几个标签，不加样式控制的情况下，各自的margin 和padding差异较大。 碰到频率:100% 解决方案：CSS里    *{margin:0;padding:0;} 备注：这个是最常见的也是最易解决的一个浏览器兼容性问题，几乎所有的CSS文件开头都会用通配符*来设
  • Shell特殊变量：Shell $0, $#, $*, $@, $?, $$和命令行参数 daizj shell$#$?特殊变量
    前面已经讲到，变量名只能包含数字、字母和下划线，因为某些包含其他字符的变量有特殊含义，这样的变量被称为特殊变量。例如，$ 表示当前Shell进程的ID，即pid，看下面的代码： $echo $$ 运行结果 29949   特殊变量列表 变量 含义 $0 当前脚本的文件名 $n 传递给脚本或函数的参数。n 是一个数字，表示第几个参数。例如，第一个
  • 程序设计KISS 原则-------KEEP IT SIMPLE, STUPID! dcj3sjt126com unix
    翻到一本书，讲到编程一般原则是kiss：Keep It Simple, Stupid.对这个原则深有体会，其实不仅编程如此，而且系统架构也是如此。 KEEP IT SIMPLE, STUPID! 编写只做一件事情，并且要做好的程序；编写可以在一起工作的程序，编写处理文本流的程序，因为这是通用的接口。这就是UNIX哲学.所有的哲学真 正的浓缩为一个铁一样的定律，高明的工程师的神圣的“KISS 原
  • android Activity间List传值 dcj3sjt126com Activity
    第一个Activity： import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;import android.app.Activity;import android.content.Intent;import android.os.Bundle;import a
  • tomcat 设置java虚拟机内存 eksliang tomcat 内存设置
    转载请出自出处：http://eksliang.iteye.com/blog/2117772 http://eksliang.iteye.com/ 常见的内存溢出有以下两种: java.lang.OutOfMemoryError: PermGen space java.lang.OutOfMemoryError: Java heap space   ------------
  • Android 数据库事务处理 gqdy365 android
    使用SQLiteDatabase的beginTransaction()方法可以开启一个事务，程序执行到endTransaction() 方法时会检查事务的标志是否为成功，如果程序执行到endTransaction()之前调用了setTransactionSuccessful() 方法设置事务的标志为成功则提交事务，如果没有调用setTransactionSuccessful() 方法则回滚事务。事
  • Java 打开浏览器 hw1287789687 打开网址open浏览器open browser打开url打开浏览器
    使用java 语言如何打开浏览器呢? 我们先研究下在cmd窗口中,如何打开网址 使用IE 打开 D:\software\bin>cmd /c start iexplore http://hw1287789687.iteye.com/blog/2153709 使用火狐打开 D:\software\bin>cmd /c start firefox http://hw1287789
  • ReplaceGoogleCDN：将 Google CDN 替换为国内的 Chrome 插件 justjavac chromeGooglegoogle apichrome插件
    Chrome Web Store 安装地址： https://chrome.google.com/webstore/detail/replace-google-cdn/kpampjmfiopfpkkepbllemkibefkiice 由于众所周知的原因，只需替换一个域名就可以继续使用Google提供的前端公共库了。 同样，通过script标记引用这些资源，让网站访问速度瞬间提速吧
  • 进程VS.线程 m635674608 线程
    资料来源： http://www.liaoxuefeng.com/wiki/001374738125095c955c1e6d8bb493182103fac9270762a000/001397567993007df355a3394da48f0bf14960f0c78753f000 1、Apache最早就是采用多进程模式 2、IIS服务器默认采用多线程模式 3、多进程优缺点 优点： 多进程模式最大
  • Linux下安装MemCached 字符串 memcached
    前提准备：1. MemCached目前最新版本为：1.4.22，可以从官网下载到。2. MemCached依赖libevent，因此在安装MemCached之前需要先安装libevent。2.1 运行下面命令，查看系统是否已安装libevent。[root@SecurityCheck ~]# rpm -qa|grep libevent libevent-headers-1.4.13-4.el6.n
  • java设计模式之--jdk动态代理（实现aop编程） Supanccy2013 javaDAO设计模式AOP
        与静态代理类对照的是动态代理类，动态代理类的字节码在程序运行时由Java反射机制动态生成，无需程序员手工编写它的源代码。动态代理类不仅简化了编程工作，而且提高了软件系统的可扩展性，因为Java 反射机制可以生成任意类型的动态代理类。java.lang.reflect 包中的Proxy类和InvocationHandler 接口提供了生成动态代理类的能力。 &
  • Spring 4.2新特性-对java8默认方法(default method)定义Bean的支持 wiselyman spring 4
    2.1 默认方法(default method) java8引入了一个default medthod; 用来扩展已有的接口,在对已有接口的使用不产生任何影响的情况下,添加扩展 使用default关键字 Spring 4.2支持加载在默认方法里声明的bean 2.2 将要被声明成bean的类 public class DemoService {
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他