云开、见月明
云开、见月明

web前端——旋转3D魔方

前端css实现3D魔方，先看一下效果图：

盒子布局

将3D魔方的6个面包裹在一个父盒子中

<div class="content">
  <div class="parent">
    <div class="div1">上div>
    <div class="div2">下div>
    <div class="div3">左div>
    <div class="div4">右div>
    <div class="div5">前div>
    <div class="div6">后div>
  div>
div>

添加3D效果

  1. 给父盒子添加相对定位和3D属性
.parent {
/* 相对定位 */
	position: relative;
	width: 400px;
	height: 400px;
	margin: 200px auto;
	/* 3D属性 */
	transform-style: preserve-3d;
	/* 旋转动画 */
	animation-name: rotate;
	animation-duration: 10s;
	animation-iteration-count: infinite;
}
  1. 给子盒子添加绝对定位，并移动、旋转子盒子
.parent>div {
	position: absolute;
	width: 400px;
	height: 400px;
	border: 1px solid pink;
	font-size: 40px;
	line-height: 400px;
	text-align: center;
}

.div1 {
	top: -50%;
	color: yellow;
	transform: rotateX(90deg);
}

.div2 {
	top: 50%;
	color: white;
	transform: rotateX(90deg);
}

.div3 {
	left: -50%;
	color: red;
	transform: rotateY(90deg);
}

.div4 {
	left: 50%;
	color: orange;
	transform: rotateY(90deg);
}

.div5 {
	transform: translateZ(200px);
	color: blue;
}

.div6 {
	transform: translateZ(-200px);
	color: green;
}

效果：
web前端——旋转3D魔方_第1张图片

  1. 给父盒子添加动画效果
.parent {
	/* 相对定位 */
	position: relative;
	width: 400px;
	height: 400px;
	margin: 200px auto;
	/* 3D属性 */
	transform-style: preserve-3d;
	/* 旋转动画 */
	animation-name: rotate;
	animation-duration: 10s;
	animation-iteration-count: infinite;
}

@keyframes rotate {
	0% {
		transform: rotateX(0) rotateY(0)
	}

	100% {
		transform: rotateX(360deg) rotateY(360deg)
	}
}

整体代码


<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>旋转盒子title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        body {
            background-color: black;
        }

        .parent {
            position: relative;
            width: 400px;
            height: 400px;
            background-color: violet;
            margin: auto;
            margin-top: 250px;
            transform-style: preserve-3d;
            animation-name: xuanzhuan;
            animation-duration: 10s;
            animation-iteration-count: infinite;
        }

        .parent>div {
            position: absolute;
            width: 400px;
            height: 400px;
            border: 1px solid pink;
            /* background-image: repeating-linear-gradient(pink 0,pink 1px, transparent 2px,transparent 47px),
            repeating-linear-gradient(to right ,pink 0,pink 1px, transparent 2px,transparent 47px); */
        }

        .div1 {
            color: violet;
            right: 200px;
            transform: rotateY(90deg);
        }

        .div2 {
            color: yellow;
            top: -200px;
            transform: rotateX(90deg);
        }

        .div3 {
            color: wheat;
            right: -200px;
            transform: rotateY(90deg);
        }

        .div4 {
            color: springgreen;
            bottom: -200px;
            transform: rotateX(90deg);
        }

        .div5 {
            color: steelblue;
            transform: translateZ(-200px);
        }

        .div6 {
            color: slategray;
            transform: translateZ(200px);
        }

        @keyframes xuanzhuan {
            0%{
                transform: rotateX(0) rotateY(0);
            }

            100%{
                transform: rotateX(360deg) rotateY(360deg);
            }
        }
    style>
head>
<body>
    <div class="parent">
        <div class="div1">div>
        <div class="div2">div>
        <div class="div3">div>
        <div class="div4">div>
        <div class="div5">div>
        <div class="div6">div>
    div>
body>
html>

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

  • HTML5前端页面设计,HTML5网页前端设计 设计师马丁 HTML5前端页面设计
    HTML5网页前端设计编辑锁定讨论上传视频《HTML5网页前端设计》是2017年6月清华大学出版社出版的图书，作者是周文洁。书名HTML5网页前端设计作者周文洁ISBN9787302463597定价59.50元出版社清华大学出版社出版时间2017年6月HTML5网页前端设计内容简介编辑本书是一本从零开始学习的Web前端开发教材，无须额外的基础。全书以项目驱动为宗旨，详细介绍了HTML5、CSS3与
  • web前端开发工程师工作的岗位职责（合集） 极客11 面试与求职前端状态模式
    web前端开发工程师工作的岗位职责1职责：1、根据设计图进行前端页面开发并设计编写业务交互脚本2、优化前端页面，保证良好的用户体验以及不同浏览器的兼容性3、web前沿技术研究和新技术调研，将主流的特效应用到业务场景中4、配合后台开发人员实现网站界面和功能，为产品后期运营提供升级、维护等技术支持。5、工作积极主动，善于沟通，协调项目与项目之间的工作安排与配合，确保开发工作顺利进行。6、具备较强的学习
  • HTML5拼图游戏开发经验分享 木木黄木木 html5前端html
    HTML5拼图游戏开发经验分享这里写目录标题HTML5拼图游戏开发经验分享前言项目架构1.文件结构2.核心功能模块技术要点解析1.响应式布局2.图片处理3.拖拽交互4.动画效果性能优化开发心得项目亮点总结源码分享写在最后前言在Web前端开发领域，通过实战项目来提升编程技能是最有效的学习方式之一。今天我要分享一个HTML5拼图游戏的开发经验，这个项目涵盖了现代前端开发的多个重要概念，包括响应式设计、
  • 适合前端入门的Go语言开发框架fiber weixin_45969116 前端go前端开发语言go语言
    适合web前端开发者入门的go框架(fiber)FIBER：高效、极速、极简的WEB框架Fiber是一个借鉴Express的Web框架，建立在Go语言写的最快的FasthttpHTTP引擎的基础上。皆在简化零内存分配和提高性能，以便快速开发。不想阅读下面的内容直接进入主题fiber官网fiber的特点强大的路由静态文件服务性能出众内存占用低与ExpressAPI高度相似中间件和Next支持快速的服
  • web前端面试之——原型与原型链 tsuyoii 前端面试javascript面试javascript前端
    原型与原型链（一）原型理解与记忆核心：F.prototype===f.__proto__===原型对象（原型）f.constructor===F.prototype.constructor===F===f.__proto__.constructor解释：每个函数F（也是对象，js中一切皆对象）在初始化时都拥有一个prototype属性，该属性指向原型对象（即原型）F=newFunction();F
  • 14道web前端工程师面试题及答案解析 蚂蚁小搬运工 web前端
    1.什么是HTML5？它有哪些新特性？答案：HTML5是HTML的第五个版本，引入了很多新的语法和特性，如语义化标签、多媒体支持、Canvas、地理定位、离线存储等。2.什么是WebGL？它有什么作用？答案：WebGL是一种用于在浏览器中渲染3D图形的API。它可以在浏览器中展示流畅和高质量的3D游戏和应用程序。3.什么是Canvas？它有什么作用？答案：Canvas是一种HTML5标签，用于在浏
  • Web前端发展史 王珍岩 笔记
    1、静态页面阶段那是1990年的12月25日，恰是西方的圣诞节，TimBerners-Lee在他的NeXT电脑上部署了第一套“主机-网站-浏览器”构成的Web系统，这标志BS架构的网站应用软件的开端，也是前端工程的开端。1993年4月Mosaic浏览器作为第一款正式的浏览器发布。1994年11月，鼎鼎大名的Navigator浏览器发布发布了，到年底W3C在Berners-Lee的主持下成立，标志着
  • web前端期末大作业：婚纱网页主题网站设计——唯一旅拍婚纱公司网站HTML+CSS+JavaScript IT-司马青衫 前端课程设计html
    ‍静态网站的编写主要是用HTMLDⅣV+CSSJS等来完成页面的排版设计‍，一般的网页作业需要融入以下知识点：div布局、浮动定位、高级css、表格、表单及验证、js轮播图、音频视频Fash的应用、uli、下拉导航栏、鼠标划过效果等知识点，学生网页作业源码，制作水平和原创度都适合学习或交作业用，记得点赞。精彩专栏推荐【作者主页——获取更多优质源码】【web前端期末大作业——毕设项目精品实战案例(1
  • web前端高级JavaScript - 闭包的应用及循环事件绑定的N中解决办法 一笑程序猴 WEB前端高级教程闭包应用循环事件绑定自定义索引
    闭包在循环事件绑定中的应用场景描述：在页面上有3个button按钮，当点击每个按钮时输出当前按钮的索引值，要求用循环来绑定每个按钮的事件，看下面的代码。button1button2button3varbuttons=document.querySelectorAll('button');for(vari=0;i
  • unity全栈开发是什么意思_为什么你要去尝试全栈开发？ 上海龙哥 unity全栈开发是什么意思
    程序员看到"全栈"这个概念，大概会有两种反应1.卧槽，这个好，碉堡了2.你懂毛，全栈就是样样稀松以上两种反应其实都有失偏颇。因为即使只学一门技术，水平很菜的人也多的是，而全栈工程师当中样样都做，而样样都做得不错的也不少。更别说这个世界还存在另外一种爆栈型的程序员，做什么，什么都精。从我的个人实践出发，全栈学徒至少要掌握以下几种技能：Web前端开发，至少掌握一种前端框架；Server后端开发，至少掌
  • 329.大学生HTML期末大作业 —【纪念鲁迅文化主题网页】 Web前端网页制作 html+css 一只小小的眠羊 大学生期末大作业文化前端html课程设计javascripthtml5cssjquery
    目录一、更多推荐二、网页简介三、网页文件四、网页效果五、代码展示1.html2.CSS六、总结1.简洁实用2.使用方便3.整体性好4.形象突出5.交互式强一、更多推荐欢迎来到我的CSDN主页！您的支持是我创作的动力！Web前端网页制作、网页完整代码、大学生期末大作业案例模板完整代码、技术交流等，有兴趣的联系我交流学习!更多优质博客文章、网页模板点击以下链接查阅：仙女网页设计-CSDN博客5000+
  • 新手教程，小白学web前端开发—HTML5+css3 皆非本人 前端html5css3
    小白教程，一起来跟我学简单的网页制作吧！本书教材：web前端开发案例教程—HTML5+css3简介：2005年以后，互联网进入了web2.0的时代，各种类似的桌面软件的web应用大量涌现，网站的前端，由此发生了翻天覆地的变化。网站不再只承载单一的文字和图片，各种丰富的媒体让网页的内容更加生动，网页的各种交互形式为用户带来了更好的体验，都基于前端的技术实现，好了废话不多说，让我们简单的体验一下如何制
  • 【Web前端开发】---web简介 爱学习的小何同学！ 前端
    1、前端开发能干什么能干：网页、小程序（例如：微信小程序、抖音小程序），数据可视化前端工程师不仅可以开发上面所说的东西，而且也可以开发：服务器、客户端。2、计算机基础计算机由硬件与软件构成。所谓的硬件就是能看得见、摸得着的一些零部件。比如：CPU、内存、硬盘、键盘、鼠标、音箱、显示器。所谓的软件就是看得见、摸不着的东西。软件由系统软件和应用软件构成。系统软件：Windows、Linux、Max、H
  • 前端开发手册大全 而 已 webjavascriptcsshtmljquerycss3
    web前端开发手册大全(学习参考)html中文中文参考手册：https://www.html.cn/shouce/html/1.htmlJavaScript中文参考手册：https://www.html.cn/shouce/js/11.htmlCSS3.0参考手册：https://www.html.cn/doc/css3/CSS教程手册（新）：https://www.html.cn/book/cs
  • web前端常见面试题 JackieDYH 程序猿面试题前端javascriptvue面试题
    html文件开头DOCTYPE作用DOCTYPE（文档类型）是HTML文档的开头，它指定了HTML文档使用的HTML版本及文档类型，告诉浏览器以哪种规范来解析HTML文档。它的作用有以下几个方面：声明HTML版本：DOCTYPE声明可以让浏览器知道使用哪个HTML版本来解析当前文档，从而根据规范来处理文档中的元素和属性。帮助浏览器正确解析文档：DOCTYPE声明可以确保浏览器以标准模式渲染页面，而
  • HTML5期末大作业：基于 html css js仿腾讯课堂首页 web学生网页设计 web前端cssdreamweaverhtmlhtml5期末作业
    精彩专栏推荐文末获取联系✍️作者简介:一个热爱把逻辑思维转变为代码的技术博主作者主页:【主页——获取更多优质源码】web前端期末大作业：【毕设项目精品实战案例(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】超炫酷的Echarts大屏可视化源码：【Echarts大屏展示大数据平台可视化(150套)】HTML+CSS+JS实例代码：【️HTML+CSS+JS实例代码
  • web前端开发面试题 书亦何欢* 基本前端
    1.一些开放性题目1.自我介绍：除了基本个人信息以外，面试官更想听的是你与众不同的地方和你的优势。2.项目介绍3.如何看待前端开发？4.平时是如何学习前端开发的？5.未来三到五年的规划是怎样的？position的值，relative和absolute分别是相对于谁进行定位的？§absolute:生成绝对定位的元素，相对于最近一级的定位不是static的父元素来进行定位。§fixed（老IE不支持）
  • 从ECMAScript到JavaScript：前端编程的基石 大雨淅淅 前端开发ecmascriptjavascript前端
    目录一、什么是ECMAScript二、发展历程回顾三、核心特性解析3.1基础类型与数据结构3.2函数的进阶用法3.3对象的操作与扩展3.4类与面向对象编程3.5异步编程四、实际应用场景4.1Web前端开发4.2Node.js后端开发4.3移动应用开发五、未来展望一、什么是ECMAScriptECMAScript是一种由Ecma国际（前身为欧洲计算机制造商协会）通过ECMA-262标准化的脚本程序设
  • [oAuth2授权]Web前端+Node&Coze API Web后端程序+Coze授权服务器工作流程架构流程图详解 GISer_Jinger 项目人工智能node.js前端javascript架构
    嗯，用户之前已经了解了如何使用React和Node.js结合CozeAPI实现OAuth2授权，现在他们具体想实现的是在Web应用中，当用户点击一个按钮（比如“和Bot对话”）时，触发授权流程，重定向到Coze的授权服务器获取code。用户还提供了一个具体的cURL请求示例，展示了如何通过302重定向获取授权页面的URL，然后从响应头中的location字段得到跳转链接，引导用户完成授权。首先，我
  • AI写代码工具赋能前端开发：提升开发者解决问题能力 bd_ming 人工智能前端
    近年来，人工智能（AI）技术在各个领域都取得了显著进展，前端开发领域也不例外。AI的快速发展为前端开发者带来了前所未有的机遇，同时也带来了新的挑战。开发者需要不断学习新的技术和工具，以适应快速变化的开发环境。而AI写代码工具的出现，为开发者提升解决问题的能力提供了强有力的支持。本文将探讨AI前端开发工具如何帮助开发者更高效地解决问题，并以ScriptEcho为例进行说明。……传统的Web前端开发工
  • web前端--html 5---qq注册 粉0321 web前端前端html
    qq注册.theme{width:300px;height:600px;margin:0pxauto;}.theme1select{padding:5px10px;border:none;border-color:#B8B8B8;box-sizing:border-box;font-size:14px;color:#B8B8B8;}.a1{color:#4b7cde;}.form-group1in
  • 2024年Web前端最新vue动态路由缓存【前进刷新、后退缓存】，2024历年华为跳动前端面试真题解析 2401_84418948 程序员前端面试学习
    总结大厂面试问深度，小厂面试问广度，如果有同学想进大厂深造一定要有一个方向精通的惊艳到面试官，还要平时遇到问题后思考一下问题的本质，找方法解决是一个方面，看到问题本质是另一个方面。还有大家一定要有目标，我在很久之前就想着以后一定要去大厂，然后默默努力，每天看一些大佬们的文章，总是觉得只有再学深入一点才有机会，所以才有恒心一直学下去。开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最
  • web前端常用标签（html） 智商不在服务器 html前端
    1.定义1.1标签语法规范：标签名标签之间可以嵌套1.2属性定制元素的行为的。属性是不通用的，每一个标签存在自身的属性。当属性名=属性值时，可以只写属性值2.HTML常用标签2.1排版标签排版标签主要和css搭配使用，显示网页结构的标签，是网页布局最常用的标签。排版标签标签名作用属性标题标签为了使网页更具有语义化，我们经常会在页面中用到标题标签，HTML提供了6个等级的标题，即h1-h6包含所有全
  • 电商前端工程师：国内WEB前端开发经验之路 ariss123 jqueryuiweb前端前端框架
    一直想写这篇“十日谈”，聊聊我对Web前端开发的体会，顺便解答下周围不少人的困惑和迷惘。我不打算聊太多技术，我想，通过技术的历练，得到的反思应当更重要。我一直认为自己是“初级”前端开发工程师，一方面我入道尚浅，只有短短几年，另一方面我自知对技术的钻研并不深入，可能是由于环境的原因，当然最重要的是，我幸运的参与到互联网崛起的浪潮之巅。时势造就了一批技能薄弱但备受追捧的“弄潮者”，这在很大程度上影响我
  • 大学生HTML期末大作业——HTML+CSS+JavaScript学校网站（成都大学） 无·糖 Web前端期末大作业html课程设计css大学生前端javascript大学生大作业
    HTML+CSS+JS【学校网站】网页设计期末课程大作业web前端开发技术web课程设计网页规划与设计文章目录一、网站题目二、网站描述三、网站介绍四、网站效果五、️网站代码六、️‍如何学习进步七、‍☠️更多干货文章目录一、网站题目学校网站（成都大学）6页含JQ二、网站描述总结了一些学生网页制作的经验：一般的网页需要融入以下知识点：div+css布局、浮动、定位、高级css、表格、表单及验证、js轮
  • 【无标题】 是懒羊羊吖～ 笔记
    一.WED前端应用软件：c/s架构b/s架构web前端：html5css3javascripthtml5：超文本标记语言----超链接，文字，标签标签语法规范：结束-----双标签标签体------可以嵌套inputimg---------单标签属性：定制元素的行为，属性是不通用的，每一个标签存在自身的属性，当属性名等于属性值时,只需要写属性名，不需要写属性值。二.HTML1.样式//文档声明：告
  • 【OpenTiny调研征集】共创技术未来，分享您的声音！ 前端vue.js开源
    欢迎参与2025年OpenTiny开源社区用户调研征集调研背景随着OpenTiny开源项目的不断发展，我们一直致力于为开发者提供高质量的Web前端开发解决方案。为了更好地满足用户需求，提升项目的实用性和易用性，我们决定发起一项用户调研活动，诚挚邀请您参与。调研目的了解用户需求：收集您在使用OpenTiny开源项目过程中的需求、问题和建议，以便我们更好地改进和优化。提升用户体验：通过您的反馈，我们将
  • cesium（vue）一些面试问题（包含Three.js） GIS瞧葩菜 vue.jsjavascriptcesium
    1.在不同的应用场景和技术栈中，模型加载方法和格式有所不同，下面主要从Web前端三维场景（使用Three.js和cesium）使用Three.js加载模型常见模型格式及加载方法GLTF/GLB格式格式特点：GLTF（GraphicsLibraryTransmissionFormat）是一种开放的、基于JSON的三维模型传输格式，GLB是其二进制版本。它们具有文件小、加载快、支持动画、材质和骨骼等优
  • electron学习笔记 weixin_46452138 electron学习javascript
    electron个人学习笔记一、electron简单了解Electron是一个跨平台的、基于Web前端技术的桌面GUI应用程序开发框架。可以使用HTML、CSS来绘制界面和控制布局，使用JavaScript来控制用户行为和业务逻辑，使用Node.js来通信、处理音频视频等，几乎所有的Web前端技术和框架（jQuery、Vue、React、Angular等）都可以应用到桌面GUI开发中。二、开发前基
  • HTML CSS整理笔记（建议收藏） 程序员的生活1 jsweb前端html+csscssjavascripthtmlcss3
    点击链接后退页面：回到上一个网页——修改placeholder提示的样式：打造全网web前端全栈资料库（总目录）看完学的更快，掌握的更加牢固，你值得拥有（持续更新）1.除IE外通用写法类名或标签名::placeholder{color:red;}2.加兼容前缀写法css超出一行显示省略号：给定宽度(width:100px)、超出隐藏（overflow:hidden）、强制在同一行显示（white-
  • html 周华华 html
    js 1，数组的排列 var arr=[1,4,234,43,52,]; for(var x=0;x<arr.length;x++){    for(var y=x-1;y<arr.length;y++){      if(arr[x]<arr[y]){     &
  • 【Struts2 四】Struts2拦截器 bit1129 struts2拦截器
    Struts2框架是基于拦截器实现的，可以对某个Action进行拦截，然后某些逻辑处理，拦截器相当于AOP里面的环绕通知，即在Action方法的执行之前和之后根据需要添加相应的逻辑。事实上，即使struts.xml没有任何关于拦截器的配置，Struts2也会为我们添加一组默认的拦截器，最常见的是，请求参数自动绑定到Action对应的字段上。   Struts2中自定义拦截器的步骤是：
  • make:cc 命令未找到解决方法 daizj linux命令未知make cc
    安装rz sz程序时，报下面错误：   [root@slave2 src]# make posix cc   -O -DPOSIX -DMD=2 rz.c -o rz make: cc：命令未找到 make: *** [posix] 错误 127   系统：centos 6.6 环境：虚拟机   错误原因：系统未安装gcc，这个是由于在安
  • Oracle之Job应用 周凡杨 oracle job
    最近写服务，服务上线后，需要写一个定时执行的SQL脚本，清理并更新数据库表里的数据，应用到了Oracle 的 Job的相关知识。在此总结一下。   一：查看相关job信息    1、相关视图  dba_jobs  all_jobs  user_jobs  dba_jobs_running 包含正在运行
  • 多线程机制 朱辉辉33 多线程
    转至http://blog.csdn.net/lj70024/archive/2010/04/06/5455790.aspx 程序、进程和线程： 程序是一段静态的代码，它是应用程序执行的蓝本。进程是程序的一次动态执行过程，它对应了从代码加载、执行至执行完毕的一个完整过程，这个过程也是进程本身从产生、发展至消亡的过程。线程是比进程更小的单位，一个进程执行过程中可以产生多个线程，每个线程有自身的
  • web报表工具FineReport使用中遇到的常见报错及解决办法（一） 老A不折腾 web报表finereportjava报表报表工具
    FineReport使用中遇到的常见报错及解决办法（一） 这里写点抛砖引玉，希望大家能把自己整理的问题及解决方法晾出来，Mark一下，利人利己。   出现问题先搜一下文档上有没有，再看看度娘有没有，再看看论坛有没有。有报错要看日志。下面简单罗列下常见的问题，大多文档上都有提到的。   1、address pool is full： 含义：地址池满，连接数超过并发数上
  • mysql rpm安装后没有my.cnf 林鹤霄 没有my.cnf
    Linux下用rpm包安装的MySQL是不会安装/etc/my.cnf文件的， 至于为什么没有这个文件而MySQL却也能正常启动和作用，在这儿有两个说法， 第一种说法，my.cnf只是MySQL启动时的一个参数文件，可以没有它，这时MySQL会用内置的默认参数启动， 第二种说法，MySQL在启动时自动使用/usr/share/mysql目录下的my-medium.cnf文件，这种说法仅限于r
  • Kindle Fire HDX root并安装谷歌服务框架之后仍无法登陆谷歌账号的问题 aigo root
    原文：http://kindlefireforkid.com/how-to-setup-a-google-account-on-amazon-fire-tablet/   Step 4: Run ADB command from your PC   On the PC, you need install Amazon Fire ADB driver and instal
  • javascript 中var提升的典型实例 alxw4616 JavaScript
    // 刚刚在书上看到的一个小问题,很有意思.大家一起思考下吧 myname = 'global'; var fn = function () { console.log(myname); // undefined var myname = 'local'; console.log(myname); // local }; fn() // 上述代码实际上等同于以下代码 m
  • 定时器和获取时间的使用 百合不是茶 时间的转换定时器
    定时器:定时创建任务在游戏设计的时候用的比较多   Timer();定时器 TImerTask();Timer的子类  由 Timer 安排为一次执行或重复执行的任务。       定时器类Timer在java.util包中。使用时，先实例化，然后使用实例的schedule(TimerTask task, long delay)方法，设定
  • JDK1.5 Queue bijian1013 javathreadjava多线程Queue
    JDK1.5 Queue LinkedList： LinkedList不是同步的。如果多个线程同时访问列表，而其中至少一个线程从结构上修改了该列表，则它必须 保持外部同步。（结构修改指添加或删除一个或多个元素的任何操作；仅设置元素的值不是结构修改。）这一般通过对自然封装该列表的对象进行同步操作来完成。如果不存在这样的对象，则应该使用 Collections.synchronizedList 方
  • http认证原理和https bijian1013 httphttps
    一.基础介绍         在URL前加https://前缀表明是用SSL加密的。 你的电脑与服务器之间收发的信息传输将更加安全。         Web服务器启用SSL需要获得一个服务器证书并将该证书与要使用SSL的服务器绑定。 http和https使用的是完全不同的连接方式，用的端口也不一样,前者是80，后
  • 【Java范型五】范型继承 bit1129 java
    定义如下一个抽象的范型类，其中定义了两个范型参数，T1，T2   package com.tom.lang.generics; public abstract class SuperGenerics<T1, T2> { private T1 t1; private T2 t2; public abstract void doIt(T
  • 【Nginx六】nginx.conf常用指令(Directive) bit1129 Directive
    1. worker_processes    8; 表示Nginx将启动8个工作者进程，通过ps -ef|grep nginx,会发现有8个Nginx Worker Process在运行   nobody 53879 118449 0 Apr22 ? 00:26:15 nginx: worker process
  • lua 遍历Header头部 ronin47 lua header 遍历　
    local headers = ngx.req.get_headers()   ngx.say("headers begin", "<br/>")   ngx.say("Host : ", he
  • java-32.通过交换a,b中的元素，使[序列a元素的和]与[序列b元素的和]之间的差最小(两数组的差最小)。 bylijinnan java
    import java.util.Arrays; public class MinSumASumB { /** * Q32.有两个序列a,b，大小都为n,序列元素的值任意整数，无序. * * 要求：通过交换a,b中的元素，使[序列a元素的和]与[序列b元素的和]之间的差最小。 * 例如: * int[] a = {100,99,98,1,2,3
  • redis 开窍的石头 redis
    在redis的redis.conf配置文件中找到# requirepass foobared 把它替换成requirepass 12356789 后边的12356789就是你的密码 打开redis客户端输入config get requirepass 返回 redis 127.0.0.1:6379> config get requirepass 1) "require
  • [JAVA图像与图形]现有的GPU架构支持JAVA语言吗？ comsci java语言
          无论是opengl还是cuda，都是建立在C语言体系架构基础上的，在未来，图像图形处理业务快速发展，相关领域市场不断扩大的情况下，我们JAVA语言系统怎么从这么庞大，且还在不断扩大的市场上分到一块蛋糕，是值得每个JAVAER认真思考和行动的事情       
  • 安装ubuntu14.04登录后花屏了怎么办 cuiyadll ubuntu
    这个情况，一般属于显卡驱动问题。 可以先尝试安装显卡的官方闭源驱动。 按键盘三个键：CTRL + ALT  +  F1 进入终端，输入用户名和密码登录终端： 安装amd的显卡驱动 sudo  apt-get  install  fglrx 安装nvidia显卡驱动 sudo  ap
  • SSL 与 数字证书 的基本概念和工作原理 darrenzhu 加密ssl证书密钥签名
    SSL 与 数字证书 的基本概念和工作原理 http://www.linuxde.net/2012/03/8301.html SSL握手协议的目的是或最终结果是让客户端和服务器拥有一个共同的密钥，握手协议本身是基于非对称加密机制的，之后就使用共同的密钥基于对称加密机制进行信息交换。 http://www.ibm.com/developerworks/cn/webspher
  • Ubuntu设置ip的步骤 dcj3sjt126com ubuntu
    在单位的一台机器完全装了Ubuntu Server，但回家只能在XP上VM一个，装的时候网卡是DHCP的，用ifconfig查了一下ip是192.168.92.128,可以ping通。 转载不是错： Ubuntu命令行修改网络配置方法 /etc/network/interfaces打开后里面可设置DHCP或手动设置静态ip。前面auto eth0，让网卡开机自动挂载. 1. 以D
  • php包管理工具推荐 dcj3sjt126com PHPComposer
    http://www.phpcomposer.com/   Composer是 PHP 用来管理依赖（dependency）关系的工具。你可以在自己的项目中声明所依赖的外部工具库（libraries），Composer 会帮你安装这些依赖的库文件。 中文文档  入门指南  下载  安装包列表 Composer 中国镜像
  • Gson使用四（TypeAdapter） eksliang jsongsonGson自定义转换器gsonTypeAdapter
    转载请出自出处：http://eksliang.iteye.com/blog/2175595 一.概述        Gson的TypeAapter可以理解成自定义序列化和返序列化 二、应用场景举例        例如我们通常去注册时（那些外国网站），会让我们输入firstName，lastName,但是转到我们都
  • JQM控件之Navbar和Tabs gundumw100 htmlxmlcss
    在JQM中使用导航栏Navbar是简单的。 只需要将data-role="navbar"赋给div即可： <div data-role="navbar"> <ul> <li><a href="#" class="ui-btn-active&qu
  • 利用归并排序算法对大文件进行排序 iwindyforest java归并排序大文件分治法Merge sort
      归并排序算法介绍，请参照Wikipeida zh.wikipedia.org/wiki/%E5%BD%92%E5%B9%B6%E6%8E%92%E5%BA%8F 基本思想： 大文件分割成行数相等的两个子文件，递归（归并排序）两个子文件，直到递归到分割成的子文件低于限制行数 低于限制行数的子文件直接排序 两个排序好的子文件归并到父文件 直到最后所有排序好的父文件归并到输入
  • iOS UIWebView URL拦截 啸笑天 UIWebView
    本文译者：candeladiao，原文：URL filtering for UIWebView on the iPhone说明：译者在做app开发时，因为页面的javascript文件比较大导致加载速度很慢，所以想把javascript文件打包在app里，当UIWebView需要加载该脚本时就从app本地读取，但UIWebView并不支持加载本地资源。最后从下文中找到了解决方法，第一次翻译，难免有
  • 索引的碎片整理SQL语句 macroli sql
    SET NOCOUNT ON DECLARE @tablename VARCHAR (128) DECLARE @execstr VARCHAR (255) DECLARE @objectid INT DECLARE @indexid INT DECLARE @frag DECIMAL DECLARE @maxfrag DECIMAL --设置最大允许的碎片数量,超过则对索引进行碎片
  • Angularjs同步操作http请求with $promise qiaolevip 每天进步一点点学习永无止境AngularJS纵观千象
    // Define a factory app.factory('profilePromise', ['$q', 'AccountService', function($q, AccountService) { var deferred = $q.defer(); AccountService.getProfile().then(function(res) {
  • hibernate联合查询问题 sxj19881213 sqlHibernateHQL联合查询
    最近在用hibernate做项目，遇到了联合查询的问题，以及联合查询中的N+1问题。 针对无外键关联的联合查询，我做了HQL和SQL的实验，希望能帮助到大家。（我使用的版本是hibernate3.3.2）   1 几个常识：  （1）hql中的几种join查询，只有在外键关联、并且作了相应配置时才能使用。  （2）hql的默认查询策略，在进行联合查询时，会产
  • struts2.xml wuai struts
    <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN" "http://struts.apache
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他