任由天高
任由天高

练习 2d、3d转换、图片切换

效果图：
练习 2d、3d转换、图片切换_第1张图片
代码：


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Documenttitle>
	<style type="text/css">
		*{
			padding: 0;
			margin: 0;
		}
		.bgbox{
			width: 100%;
			height: 700px;
		}
		.contain{
			width: 100%;
			height: 50%;
			position:absolute;
			top: 40%;
			padding-left: 6%;
			z-index: 9;
		}
		span{
			display: inline-block;
			position: relative;
			top: -40px;
			color: #fff;
			text-shadow: -1px -1px #000;
		}
		.one,.two,.three,.four,.five{
			width: 15%;
			height: 45%;
			border: 2px solid #fff;
			position: relative;
			top: 40%;
			float: left;
			text-align: center;
			border-radius: 5%;
			margin: 1%;
		}
		.case{
			width: 60%;
			height: 0;
			padding-bottom:60%;
			border: 4px solid #fff;
			border-radius: 50%;
			position: relative;
			top: -50px;
			display: inline-block;
			background-image: url(images/2.jpg);
		}
		ul{
			list-style: none;
		}
		.pics{
			width: 100%;
			height: 100%;
			position: relative;
		}
		.pics li{
			width: 100%;
			height: 100%;
			position: absolute;
			left: 0px;
			top: 0px;
			background-size: cover;
		}
		#pic1{
			background-image: url(images/1.jpg);
			z-index: 5;
		}
		#pic2{
			background-image: url(images/2.jpg);
			z-index: 4;
		}
		#pic3{
			background-image: url(images/3.jpg);
			z-index: 3;
		}
		#pic4{
			background-image: url(images/4.jpg);
			z-index: 2;
			perspective: 1000px;
		}
		#pic5{
			background-image: url(images/5.jpg);
			z-index: 1;
			perspective: 1000px;
		}
		.case a{
			display: inline-block;
			width: 100%;
			height: 0;
			padding-bottom:100%;
			border-radius: 50%;
			text-decoration: none;
		}
		#pic1:target{
			z-index: 5;
			animation: slideLeft 1s linear;
		}
		#pic2:target{
			z-index: 5;
			animation: slideTop 1s linear;
		}
		#pic3:target{
			z-index: 5;
			animation: scale 1s linear;
		}
		#pic4:target{
			z-index: 5;
			animation:skewTranslate 1s linear; 
		}
		#pic5:target{
			z-index: 5;
			animation:slide3d 4s linear;
		}
		@keyframes slideLeft{
			from{
				transform: translateX(-100%);
			}
			to{
				transform: translateX(0px);
			}
		}
		@keyframes slideTop{
			from{
				transform: translateY(-100%);
			}
			to{
				transform: translateY(0);
			}
		}
		@keyframes scale {
			from{
				transform: scale(0);
			}
			to{
				transform: scale(1);
			}
		}
		@keyframes skewTranslate{
			from{
				transform: rotateX(90deg);
			}
			to{
				transform: rotateX(0deg);
			}
		}
		@keyframes slide3d{
			from{
				transform: rotateY(0deg);
			}
			to{
				transform: rotateY(360deg);
			}
		}
	style>
head>
<body>
	<div class="bgbox">
		<ul class="pics">
			<li id="pic1">li>
			<li id="pic2">li>
			<li id="pic3">li>
			<li id="pic4">li>
			<li id="pic5">li>
		ul>
		<div class="contain">
			<div class="one">
				<div class="case"><a href="#pic1">a>div>
				<span>周一狂躁综合症span>
			div>
			<div class="two">
				<div class="case"><a href="#pic2">a>div>
				<span>周二雷霆似雨浇span>
			div>
			<div class="three">
				<div class="case"><a href="#pic3">a>div>
				<span>周三阴郁似乌云span>
			div>
			<div class="four">
				<div class="case"><a href="#pic4">a>div>
				<span>周四冬日盼春来span>
			div>
			<div class="five">
				<div class="case"><a href="#pic5">a>div>
				<span>周五守得艳阳天/span>
			div>
		div>
	div>
body>
html>

你可能感兴趣的:(H5+CSS3)

  • 纯H5+CSS3实现下雨特效 前端-小苗00 css3前端css
    下面这是效果图：HTML部分代码：为方便大家复制：                                                                                                                                                                               
  • 尚硅谷H5+CSS3基础课笔记一（HTML部分） JayyyyW html5css
    课程简介C/S架构——图形化界面，B/S架构——网页相较于图形化界面，网页具有优势：无需安装；无需更新；跨平台语言：HTML，CSS，JavaScript拜见祖师爷伯纳斯李1994年建立万维网联盟（W3C），为制订网页开发的标准。结构——HTML，表现——CSS，行为——JavaScriptHTMLHypertextMarkupLanguage超文本标记语言，超文本指的是超链接注释是无结束的标签有
  • 《Web前端技术H5+CSS3》笔记--第四章 初识CSS3[云图智联] 云图智联IT教育
    1.1CSS概述1.1.1什么是CSSHTML标签原本被设计为用于定义文档内容。通过使用h1、p、table这样的标签，HTML的初衷是表达“这是标题”、“这是段落”、“这是表格”之类的信息。同时文档布局由浏览器来完成，而不使用任何的格式化标签。由于两种主要的浏览器（Netscape和InternetExplorer）不断地将新的HTML标签和属性（比如字体标签和颜色属性）添加到HTML规范中，创
  • h5+css3基础面试题 我不是我不是 htmlcsscss3
    h5+css面试题一HTML5中新增了那些内容?广义上的html5指的是最新一代前端开发技术的总称,包括html5,css3,新增的webAPihtml,中新增了header,footer,main,nav等语义化标签,新增了video,audio媒体标签,新镇了canvas画布.新增了一些标签属性,例如input的placeholder.css中新增了:圆角,阴影,滤镜,vwvh单位,flex布
  • 前端H5+CSS3流光效果 foncen h5csshtmlcss3html5
    每次看到颜色渐变总是不由自主的想到流光,刚开始是考虑通过父子元素遮挡的想法实现,发现过于复杂,放弃选择博客之后豁然开朗.准备材料一张图片作为标题图标,没有其他了开始,创建stream.html文件处理小图标流光主题内容调整样式html{margin:0;padding
  • H5+CSS3 背景图毛玻璃效果实现方案 Azer.Chen css3csscss3htmlhtml5safari
    方案一、+filter:blur().background{width:100px;height:auto;filter:blur(20px);}优势：通过的方式引入背景图片或者图标，可以被搜索引擎抓取，可用于网站页面中较为重要的图片资源的引入。通过引入图片时，可以通过单独设置width或height的其中一个，并将另外外一个设置为auto，以实现图片在一个方向轴上的等比拉伸，可以避免图片的拉伸变
  • H5+Css3文本溢出添加省略号（包括插件） 骆骆爱学习 css3chrome前端
    一、单行溢出隐藏添加省略号p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}二、多行溢出隐藏省略号p{display:-webkit-box;-webkit-box-orient:vertical;/*设置省略号在容器第四行文本后*/-webkit-line-clamp:4;overflow:hidden;}局限性：使用web
  • H5+CSS3笔记 周与墨i
    关于授课（学习）许多人相信，他们的智力水平是生来是注定的，学业无成是因为先天不足。但实际情况是，当学习新东西时，大脑会发生改变，也就是说影响智力水平的因素在很大程度上是你本人掌握的。（自信）上课：主动参与学习可以有更好的效果。上课的跟着思路走-》琢磨-》提出问题。上课进行互动，可以开一些玩笑（调节气氛，没有恶意不影射谁），有\没有问题都要及时说出来。上课安排的课堂练习通常和当天的讲解内容及之前的知
  • 尚硅谷H5+CSS3基础课笔记二（CSS部分） JayyyyW css3前端css
    CSS3css（层叠样式表）处理网页的表现网页是一个多层的结构，用css可以分别为网页的每一个层设置样式，最终展示的是最上边一层。内联样式；内部样式表；外部样式表注释：/*...*/css基本语法：选择器+声明块选择器相关元素选择器：标签名{}id选择器：#id属性值{}类选择器：.class属性值{}通配选择器：*{}交集选择器：选择器1选择器2选择器n{}。这样一来就可以选择同时符合多个限定条
  • 面试题 yimi珊
    axios和ajax的区别axios是通过promise实现对ajax技术的一种封装axios可以运行nodejs里边，ajax只能在js中使用拦截请求和响应（Interceptors拦截器）axios可以并发请求h5+css3新特性有哪些h5的新特性：1.增加了语义化内容的元素，如header，footer，artical，section，nav2.增加了用于绘画的canvas元素以及svg元素
  • 使用Vue+Vue-router+el-menu实现菜单功能实战 经海路大白狗 Vue+vue.jsjavascript前端elementuispringboot
    前言上节回顾上一小节我们使用H5+CSS3实现了管理平台的架构布局，并且通过Vuex的使用，获取到前端数据本地化存储的username，绑定到右上角进行全局展示。还不了解上下文的同学可以回顾一下使用Vue+Vuex+CSS3完成管理端响应式架构模板实战。本节介绍本小节已经是专栏的第10篇博客了，我们将继续维护添加Vue-router的路由数据，这些路由都是后续实战业务的真实路由了，在添加部分路由的
  • 免费分享20套微信小程序源码 源码免费下载【强烈推荐】 淘源码d 精品源码推荐（免费）微信小程序小程序开发语言源码java
    淘源码：国内知名的源码免费下载平台微信小程序源码包括：商城系统、点餐外卖、垃圾分类、预约洗车、物业管理、校园跑腿、驾考学习、会议预约、图书管理、智能停车、在线答题等小程序源码。源码分享，文末获取源码！1、JAVA微信小程序商城源码带完整后台运行版00206架构为springmvc+mybatis+spring+maven+mysql后台前端使用boostrap-ace技术前台前端使用h5+css3
  • 我在乐字节学习前端的第三天-学习笔记：H5+CSS3面试题总结 codercore csshtmlchromecss3前端
    H5+css3面试题总结一、html5和html的区别：1.html5新增了语义化标签：footer、nav、section…2.html5完全支持css33.支持本地离线存储4.新增了canvas标签5.新增视频和音频标签HTML5离线存储localStorage长期存储数据，浏览器关闭后数据不丢失；sessionStorage数据在浏览器关闭后自动删除。如何区分HTML和HTML5？DOCTY
  • 我在乐字节学习前端的第三天-学习笔记：H5+CSS3面试题总结 codercore csshtmlchromecss3前端
    H5+css3面试题总结一、html5和html的区别：1.html5新增了语义化标签：footer、nav、section…2.html5完全支持css33.支持本地离线存储4.新增了canvas标签5.新增视频和音频标签HTML5离线存储localStorage长期存储数据，浏览器关闭后数据不丢失；sessionStorage数据在浏览器关闭后自动删除。如何区分HTML和HTML5？DOCTY
  • 我在乐字节学习前端的第三天-学习笔记：H5+CSS3面试题总结 爱编程的大百 前端面试csshtml5css3
    H5+css3面试题总结一、html5和html的区别：1.html5新增了语义化标签：footer、nav、section…2.html5完全支持css33.支持本地离线存储4.新增了canvas标签5.新增视频和音频标签HTML5离线存储localStorage长期存储数据，浏览器关闭后数据不丢失；sessionStorage数据在浏览器关闭后自动删除。如何区分HTML和HTML5？DOCTY
  • H5+CSS3之如何简单的实现自适应一排两列布局 残剑破空落飞雪 CSSflex
    用FLEX设置一排两列50%的设置方法：HTML代码CSS代码html,body,section{width:100%;height:100%;margin:0;padding:0;}ul,li{list-style:none;margin:0;padding:0;width:100%;}.box{display:flex;flex-direction:row;flex-wrap:wrap;jus
  • 【江哥带你从“零”玩转Html5 + 跨平台开发】学习笔记 晓娜点点 html5css
    最近一段时间都没有写博客，一是因为有新的项目要做，而是最近在学习有关H5移动开发相关方面的内容，以下是看了“【江哥带你从“零”玩转Html5+跨平台开发】”总结的学习笔记，目前只是更新到了H5+CSS3，相关视频网站地址：http://bbs.520it.com/forum.php?mod=viewthread&tid=2418HTML学习笔记字符集：header标签中添加解决乱码，指定当前网页字
  • 《Web前端技术H5+CSS3》笔记--第六章 盒子模型[云图智联] 云图智联 前端htmlcsshtml5css3js
    所有HTML元素可以看作盒子，在CSS中，"boxmodel"这一术语是用来设计和布局时使用。CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。1.1盒子模型在学习盒子模型之前，先来看一个生活中的例子。假如墙上排列着几幅画。对于每幅画来说，都有一个边框，在英文中称为border；每个画框中，画和边框
  • 《Web前端技术H5+CSS3》笔记--第三章 表单[云图智联] 云图智联 前端pythonjavacsshtmlhtml5
    1.1表单概述1.1.1表单在网页中的应用表单在网页中应用比较广泛，如申请电子邮件，用户需要首先填写注册信息，然后才能提交申请。又如希望登录邮箱收发电子邮件，也必须在登陆页面中输入用户名、密码才能进入邮箱，这就是典型的表单应用。通俗的讲，表单就是一个将用户信息组织起来的容器。将需要用户填写的内容放置在表单容器中，当用户单击“提交”按钮时，表单会将数据统一发送给服务器。表单的应用比较常见，典型的应用
  • 《Web前端技术H5+CSS3》笔记--第四章 初识CSS3[云图智联] 云图智联 前端htmlpythoncssjavajavascript
    1.1CSS概述1.1.1什么是CSSHTML标签原本被设计为用于定义文档内容。通过使用h1、p、table这样的标签，HTML的初衷是表达“这是标题”、“这是段落”、“这是表格”之类的信息。同时文档布局由浏览器来完成，而不使用任何的格式化标签。由于两种主要的浏览器（Netscape和InternetExplorer）不断地将新的HTML标签和属性（比如字体标签和颜色属性）添加到HTML规范中，创
  • 《Web前端技术H5+CSS3》第二章 HTML基础[云图智联] 云图智联 前端列表csshtmlhtml5javascript
    1.1列表1.1.1列表及其应用1.什么是列表简单来说，列表就是信息资源的一种展示形式。它可以使信息结构化和条理化，并以列表的样式显示出来。2.列表的分类及其应用无序列表，语法：第一项第二项第三项有序列表，语法：第一项第二项第三项定义列表，语法：标题第一项第二项标题二第一项第二项无序列表|无序列表由ul标签和li标签组成，使用ul标签作为无序列表的声明，使用li标签作为每个列表项的起始。无序列表中
  • 《Web前端技术H5+CSS3》笔记--第一章 HTML基础[云图智联] 云图智联 前端htmlpythoncssjava人工智能
    1.1HTML简介1.1.1HTML：HyperTextMarkupLanguage（超文本标记语言）在学习使用HTML之前，大家经常会问，什么是HTML？HTML是用来描述页面的一种语言，它是一种超文本标记语言，也就是说，HTML不是一种编程语言，仅是一种标记语言。HTML由一套标记标签组成，在制作网页时，HTML使用标记标签来描述网页。1.1.2发展史1.1.3HTML5的优势HTML5自正式
  • H5+CSS3基础（常用） 404狗敏 面试题H5面试题
    （一）说一下h5的新特性1-切记回答这个问题不要只说语义化标签，如果只说这个就废了,可以从自己的体验方面，去分析的说，不要死记硬背2-可以先说一下h5新增的语义化标签和jsAPI01-语义化标签有:header,footer,aside,nav等02-还有在音频和视频方面的改进->1.视频（video）2.音频(audio)03-jsAPI有如本地存储->1.localStorage和Sessio
  • 清风带你学-H5+CSS3（五）移动端滑动,手势，布局 清风丶Spirit_Breeze H5+CSS3
    M-web了解touch事件的使用独立完成jdM的轮播图掌握区域滚动插件使用了解手势事件的原理安装less运行环境nodeJStouch事件触摸事件事件说明touchstart当手指触碰屏幕时候触发该事件touchmove当手指在屏幕上滑动时候触发该事件touchend当手指离开屏幕时触发该事件touchcancel当系统停止跟踪（被迫终止）触摸时候会触发。触摸点集合触摸点集合说明targetTo
  • 清风带你学-H5+CSS3（六）使用less维护rem布局项目 清风丶Spirit_Breeze H5+CSS3
    M-web掌握less的安装和编译掌握less的基本语法掌握在项目中使用less掌握rem适配的原理掌握rem+媒体查询适配掌握rem+flexible适配课程内容less什么是less作为一门标记性语言，CSS的语法相对简单，对使用者的要求较低，但同时也带来一些问题：CSS需要书写大量看似没有逻辑的代码，不方便维护及扩展，不利于复用，尤其对于非前端开发工程师来讲，往往会因为缺少CSS编写经验而很
  • 考核感慨 陈星如_三月
    回家了，晚上有点失眠了想起昨天下午的考核，h5+css3的制作网页考核，考核效果不尽如人意，可以说是很差基础知识掌握的不好，只会自己网页模仿中写到的用到的一点点知识，关于该元素引申出的其他实现方式，其他表达方式，其他类型一概不知知识面狭窄，可以说几乎没有知识面，是一些细碎的东西，自己心里也没有形成知识框架问起问题来，不会的很多，了解过XXX吗?没了解过其他表达方式你还知道吗？其他的没用过，没了解到
  • H5+CSS3简单动画 知识点 汇总 aoe41606
    乱入几个：1.h5的一个语义化标签figure:用于规定独立的流内容（图像图表照片代码等）figcapition：与figure配套使用，用于标签定义figure元素标题2.媒体查询：通过不同的媒体类型和条件定义样式规则；媒体查询大部分媒体特性都接受min和max用于表示“大于等于”或“小于等于”：width:min-width;max-width媒体查询能够用在@media和import规则上，
  • ASP.NET动态网站课程设计——个人网页 aisebu7819
    时光荏苒，岁月如梭，又是学期期末时，没错，我又来补课程设计了，hhh。本文主要讲述如何在用H5+CSS3写的静态网站的基础上，结合ASP.NET动态网站开发，制作一个动态的个人网页。首先需要熟悉一下VirtualStdio这个编译环境。打开VS，建立一个站点，创建一个空白网站，记得选用C#语言。然后可以看到熟悉的H5的基本框架，略有不同的是有些标签中有一些新的属性，比如runat="server"
  • H5+CSS3之如何简单的实现自适应一排两列布局 张三无语 css
    先上效果图：再来代码：html,body,section{width:100%;height:100%;margin:0;padding:0;}ul,li{list-style:none;margin:0;padding:0;width:100%;}.box{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-b
  • Vue-h5+css3+vue实现图书管理案例 程序猿强哥 vue
    本案例采用idea进行开发先创建一个空项目h5+css3实现的静态页面效果h5+css3代码Document.grid{margin:auto;width:500px;text-align:center;}.gridtable{width:100%;border-collapse:collapse;}.gridth,td{padding:10;border:1pxdashedorange;heig
  • Linux的Initrd机制 被触发 linux
    Linux 的 initrd 技术是一个非常普遍使用的机制，linux2.6 内核的 initrd 的文件格式由原来的文件系统镜像文件转变成了 cpio 格式，变化不仅反映在文件格式上， linux 内核对这两种格式的 initrd 的处理有着截然的不同。本文首先介绍了什么是 initrd 技术，然后分别介绍了 Linux2.4 内核和 2.6 内核的 initrd 的处理流程。最后通过对 Lin
  • maven本地仓库路径修改 bitcarter maven
    默认maven本地仓库路径：C:\Users\Administrator\.m2 修改maven本地仓库路径方法：     1.打开E:\maven\apache-maven-2.2.1\conf\settings.xml     2.找到        
  • XSD和XML中的命名空间 darrenzhu xmlxsdschemanamespace命名空间
    http://www.360doc.com/content/12/0418/10/9437165_204585479.shtml http://blog.csdn.net/wanghuan203/article/details/9203621 http://blog.csdn.net/wanghuan203/article/details/9204337 http://www.cn
  • Java 求素数运算 周凡杨 java算法素数
    网络上对求素数之解数不胜数，我在此总结归纳一下，同时对一些编码，加以改进，效率有成倍热提高。 第一种：   原理: 6N(+-)1法         任何一个自然数，总可以表示成为如下的形式之一： 6N，6N+1，6N+2，6N+3，6N+4，6N+5 (N=0，1，2，…)   
  • java 单例模式 g21121 java
    想必单例模式大家都不会陌生，有如下两种方式来实现单例模式：   class Singleton { private static Singleton instance=new Singleton(); private Singleton(){} static Singleton getInstance() { return instance; }
  • Linux下Mysql源码安装 510888780 mysql
    1.假设已经有mysql-5.6.23-linux-glibc2.5-x86_64.tar.gz (1)创建mysql的安装目录及数据库存放目录       解压缩下载的源码包，目录结构，特殊指定的目录除外：           
  • 32位和64位操作系统 墙头上一根草 32位和64位操作系统
    32位和64位操作系统是指：CPU一次处理数据的能力是32位还是64位。现在市场上的CPU一般都是64位的，但是这些CPU并不是真正意义上的64 位CPU，里面依然保留了大部分32位的技术，只是进行了部分64位的改进。32位和64位的区别还涉及了内存的寻址方面，32位系统的最大寻址空间是2 的32次方= 4294967296（bit）= 4（GB）左右，而64位系统的最大寻址空间的寻址空间则达到了
  • 我的spring学习笔记10-轻量级_Spring框架 aijuans Spring 3
    一、问题提问：     → 请简单介绍一下什么是轻量级？     轻量级（Leightweight）是相对于一些重量级的容器来说的，比如Spring的核心是一个轻量级的容器，Spring的核心包在文件容量上只有不到1M大小，使用Spring核心包所需要的资源也是很少的，您甚至可以在小型设备中使用Spring。  
  • mongodb 环境搭建及简单CURD antlove WebInstallcurdNoSQLmongo
    一 搭建mongodb环境 1. 在mongo官网下载mongodb 2. 在本地创建目录 "D:\Program Files\mongodb-win32-i386-2.6.4\data\db" 3. 运行mongodb服务 [mongod.exe --dbpath "D:\Program Files\mongodb-win32-i386-2.6.4\data\
  • 数据字典和动态视图 百合不是茶 oracle数据字典动态视图系统和对象权限
    数据字典（data dictionary）是 Oracle 数据库的一个重要组成部分，这是一组用于记录数据库信息的只读（read-only）表。随着数据库的启动而启动,数据库关闭时数据字典也关闭   数据字典中包含   数据库中所有方案对象（schema object）的定义(包括表，视图，索引，簇，同义词，序列，过程，函数，包，触发器等等) 数据库为一
  • 多线程编程一般规则 bijian1013 javathread多线程java多线程
           如果两个工两个以上的线程都修改一个对象，那么把执行修改的方法定义为被同步的，如果对象更新影响到只读方法，那么只读方法也要定义成同步的。        不要滥用同步。如果在一个对象内的不同的方法访问的不是同一个数据，就不要将方法设置为synchronized的。
  • 将文件或目录拷贝到另一个Linux系统的命令scp bijian1013 linuxunixscp
    一.功能说明        scp就是security copy，用于将文件或者目录从一个Linux系统拷贝到另一个Linux系统下。scp传输数据用的是SSH协议，保证了数据传输的安全，其格式如下：        scp 远程用户名@IP地址：文件的绝对路径
  • 【持久化框架MyBatis3五】MyBatis3一对多关联查询 bit1129 Mybatis3
    以教员和课程为例介绍一对多关联关系，在这里认为一个教员可以叫多门课程，而一门课程只有1个教员教，这种关系在实际中不太常见，通过教员和课程是多对多的关系。   示例数据：   地址表：   CREATE TABLE ADDRESSES ( ADDR_ID INT(11) NOT NULL AUTO_INCREMENT, STREET VAR
  • cookie状态判断引发的查找问题 bitcarter formcgi
    先说一下我们的业务背景： 1.前台将图片和文本通过form表单提交到后台，图片我们都做了base64的编码，并且前台图片进行了压缩 2.form中action是一个cgi服务 3.后台cgi服务同时供PC，H5，APP 4.后台cgi中调用公共的cookie状态判断方法（公共的，大家都用，几年了没有问题） 问题：（折腾两天。。。。） 1.PC端cgi服务正常调用，cookie判断没
  • 通过Nginx,Tomcat访问日志(access log)记录请求耗时 ronin47
    一、Nginx通过$upstream_response_time $request_time统计请求和后台服务响应时间 nginx.conf使用配置方式： log_format main '$remote_addr - $remote_user [$time_local] "$request" ''$status $body_bytes_sent "$http_r
  • java-67- n个骰子的点数。 把n个骰子扔在地上，所有骰子朝上一面的点数之和为S。输入n，打印出S的所有可能的值出现的概率。 bylijinnan java
    public class ProbabilityOfDice { /** * Q67 n个骰子的点数 * 把n个骰子扔在地上，所有骰子朝上一面的点数之和为S。输入n，打印出S的所有可能的值出现的概率。 * 在以下求解过程中，我们把骰子看作是有序的。 * 例如当n=2时，我们认为（1，2）和（2，1）是两种不同的情况 */ private stati
  • 看别人的博客，觉得心情很好 Cb123456 博客心情
       以为写博客，就是总结，就和日记一样吧，同时也在督促自己。今天看了好长时间博客:    职业规划:    http://www.iteye.com/blogs/subjects/zhiyeguihua      android学习:    1.http://byandby.i
  • [JWFD开源工作流]尝试用原生代码引擎实现循环反馈拓扑分析 comsci 工作流
        我们已经不满足于仅仅跳跃一次，通过对引擎的升级，今天我测试了一下循环反馈模式，大概跑了200圈，引擎报一个溢出错误      在一个流程图的结束节点中嵌入一段方程，每次引擎运行到这个节点的时候，通过实时编译器GM模块，计算这个方程，计算结果与预设值进行比较，符合条件则跳跃到开始节点，继续新一轮拓扑分析，直到遇到
  • JS常用的事件及方法 cwqcwqmax9 js
    事件 描述 onactivate 当对象设置为活动元素时触发。 onafterupdate 当成功更新数据源对象中的关联对象后在数据绑定对象上触发。 onbeforeactivate 对象要被设置为当前元素前立即触发。 onbeforecut 当选中区从文档中删除之前在源对象触发。 onbeforedeactivate 在 activeElement 从当前对象变为父文档其它对象之前立即
  • 正则表达式验证日期格式 dashuaifu 正则表达式IT其它java其它
    正则表达式验证日期格式 function isDate(d){ var v = d.match(/^(\d{4})-(\d{1,2})-(\d{1,2})$/i); if(!v) { this.focus(); return false; } } <input value="2000-8-8" onblu
  • Yii CModel.rules() 方法 、validate预定义完整列表、以及说说验证 dcj3sjt126com yii
    public array rules () {return} array 要调用 validate() 时应用的有效性规则。 返回属性的有效性规则。声明验证规则，应重写此方法。 每个规则是数组具有以下结构：array('attribute list', 'validator name', 'on'=>'scenario name', ...validation
  • UITextAttributeTextColor = deprecated in iOS 7.0 dcj3sjt126com ios
    In this lesson we used the key "UITextAttributeTextColor" to change the color of the UINavigationBar appearance to white. This prompts a warning "first deprecated in iOS 7.0." Ins
  • 判断一个数是质数的几种方法 EmmaZhao Mathpython
    质数也叫素数，是只能被1和它本身整除的正整数，最小的质数是2，目前发现的最大的质数是p=2^57885161-1【注1】。 判断一个数是质数的最简单的方法如下： def isPrime1(n): for i in range(2, n): if n % i == 0: return False return True 但是在上面的方法中有一些冗余的计算，所以
  • SpringSecurity工作原理小解读 坏我一锅粥 SpringSecurity
      SecurityContextPersistenceFilter   ConcurrentSessionFilter   WebAsyncManagerIntegrationFilter   HeaderWriterFilter   CsrfFilter   LogoutFilter   Use
  • JS实现自适应宽度的Tag切换 ini JavaScripthtmlWebcsshtml5
    效果体验：http://hovertree.com/texiao/js/3.htm   该效果使用纯JavaScript代码，实现TAB页切换效果，TAB标签根据内容自适应宽度，点击TAB标签切换内容页。 HTML文件代码： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"
  • Hbase Rest API : 数据查询 kane_xie RESThbase
    hbase（hadoop）是用java编写的，有些语言（例如python）能够对它提供良好的支持，但也有很多语言使用起来并不是那么方便，比如c#只能通过thrift访问。Rest就能很好的解决这个问题。Hbase的org.apache.hadoop.hbase.rest包提供了rest接口，它内嵌了jetty作为servlet容器。   启动命令：./bin/hbase rest s
  • JQuery实现鼠标拖动元素移动位置（源码+注释） 明子健 jqueryjs源码拖动鼠标
    欢迎讨论指正！   print.html代码： <!DOCTYPE html> <html> <head> <meta http-equiv=Content-Type content="text/html;charset=utf-8"> <title>发票打印</title> &l
  • Postgresql 连表更新字段语法 update qifeifei PostgreSQL
    下面这段sql本来目的是想更新条件下的数据，可是这段sql却更新了整个表的数据。sql如下： UPDATE tops_visa.visa_order SET op_audit_abort_pass_date = now() FROM tops_visa.visa_order as t1 INNER JOIN tops_visa.visa_visitor as t2 ON t1.
  • 将redis,memcache结合使用的方案? tcrct rediscache
    公司架构上使用了阿里云的服务，由于阿里的kvstore收费相当高，打算自建，自建后就需要自己维护，所以就有了一个想法，针对kvstore(redis)及ocs(memcache)的特点，想自己开发一个cache层，将需要用到list，set，map等redis方法的继续使用redis来完成，将整条记录放在memcache下，即findbyid，save等时就memcache，其它就对应使用redi
  • 开发中遇到的诡异的bug wudixiaotie bug
    今天我们服务器组遇到个问题： 我们的服务是从Kafka里面取出数据，然后把offset存储到ssdb中，每个topic和partition都对应ssdb中不同的key，服务启动之后，每次kafka数据更新我们这边收到消息，然后存储之后就发现ssdb的值偶尔是-2,这就奇怪了，最开始我们是在代码中打印存储的日志，发现没什么问题，后来去查看ssdb的日志，才发现里面每次set的时候都会对同一个key
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他