A_GooD_CanceR
A_GooD_CanceR

前端网页学习 Day49(z-index属性 flex布局 响应式布局 过渡 动画)

前端网页学习(html)

DAY49

今日内容:

z-index属性

flex布局

响应式布局

过渡

动画

z-index属性

脱离文档流的标签,具有z-index属性,可以用来控制显示层次的优先级,值为任意的正整数




<div class="box">
    <div class="d1">div>
    <div class="d2">div>
    <div class="d3">div>
div>

CSS样式

<style type="text/css">
    .box {
        /*辅助子级进行绝对定位*/
        position: relative;
        width: 400px;
        height: 400px;
        background-color: red;
        margin: 0 auto;
    }
    .d1, .d2, .d3 {
        width: 200px;
        height: 200px;
        position: absolute;
    }
    .d1 {
        background-color: orange;
    }
    .d2 {
        background-color: blue;
        top: calc(50% - 100px);
        left: calc(50% - 100px);
    }
    .d3 {
        background-color: black;
        right: 0;
        bottom: 0;
    }
    .d2 {
        z-index: 88888;
    }
    .d3 {
        z-index: 666;
    }
style>

flex布局

作用:能够方便的实现块的垂直居中

flex布局:意为”弹性布局”，用来为盒状模型提供最大的灵活性。

任何一个容器都可以指定为Flex布局。


<html>
<head>
	<meta charset="UTF-8">
	<title>flex布局title>
	<style type="text/css">
		.container {
			width: 600px;
			height: 600px;
			border: 1px solid black;
			margin: 0 auto;
		}
		.item {
			/*width: 200px;*/
			/*height: 200px;*/
			/*border-radius: 50%;*/
			background-color: orange;
			font-size: 80px;
		}
		/*容器:规定容器为flex,则容器内的标签会成为该容器的项目(item)*/
		.container {
			display: flex;
		}
		.item {
			/*默认只能一行排列,所有item总宽不允许超出container宽度*/
			/*width: 300px;*/
			/*默认情况下item可以不规定高度,高度会自适应父级*/
			/*item没有设置宽度下,可以通过flex-grow决定对于父级的占比*/
		}
		/*.it1, .it3 {
			flex-grow: 1;
		}
		.it2 {
			flex-grow: 3;
			background-color: pink
		}*/
		/*container属性*/
		.container {
			/*flex-direction: row | row-reverse | column | column-reverse; 方向*/
			/*flex-direction: column-reverse;*/

			/*flex-wrap: nowrap | wrap | wrap-reverse;换行方式*/
			/*flex-wrap: wrap;*/

			/*justify-content: flex-start | flex-end | center | space-between | space-around;水平对齐方式*/
			/*item为沾满父级区域*/
			justify-content: space-around;
		}
		/*item属性*/
		.item {
			/*width: 300px;
			height: 200px;*/
		}

		.item {
			width: 100px;
		}
	style>
	
	
	
	
head>
<body>
	<div class="container">
		<div class="item it1">1div>
		<div class="item it2">2div>
		<div class="item it3">3div>
	div>
body>
html>

响应式布局

响应式布局就是一个网页能够兼容多个终端-而不是为每个终端做一个特定的版本


<html>
<head>
	<meta charset="UTF-8">
	<title>响应式布局title>
	<style type="text/css">
		/*基本样式块*/
		/*.box {
			max-width: 1200px;
			width: 95%;
			margin: 0 auto;
			background-color: red!important;
		}
		.it {
			width: 300px;
			height: 300px;
			font: 900 50px/300px 'STSong';
			text-align: center;
			float: left;
			border-radius: 50%;
			background-color: orange;
		}
		.box:after {
			content: "";
			display: block;
			clear: both;
		}*/
		
		html, body {
			margin: 0;
		}
		.it {
			height: 300px;
			background-color: orange;
			font: 900 50px/300px 'STSong';
			text-align: center;
			border-radius: 50%;
			float: left;
		}
		.box:after {
			content: "";
			display: block;
			clear: both;
		}
		/*屏幕宽度超出1200px*/
		@media only screen and (min-width: 1200px) {
			/*1.在响应式布局内,css语法同正常样式表语法*/
			/*2.响应式布局之间存在不同屏幕尺寸的限制,使用样式相互不影响*/
			/*解释:满足当前屏幕尺寸时,该样式块起作用,不满足时,则样式块失效*/
			/*3.当响应式布局中样式块起作用时,会与正常样式块设置协同布局,遵循选择器的优先级规则*/
			.box {
				background-color: pink;
			}
			.it {
				width: 25%;
			}

			/*原则:*/
			/*1.采用响应式布局的页面,基本样式块只做共性样式设置
			需要根据页面尺寸进行适应变化的样式均有响应式布局处理*/
			/*2.要进行响应式布局的页面要处理所有屏幕尺寸下的样式块*/
		}
		/*屏幕宽度间于600至1200px*/
		@media only screen and (min-width: 600px) and (max-width: 1200px) {
			.box {
				background-color: brown;
			}
			.it {
				width: 30%;
				margin: 0 calc(10% / 6);
			}

		}
		/*屏幕宽度小于600px*/
		@media only screen and (max-width: 600px) {
			.box {
				background-color: cyan;
			}
			.it {
				width: 80%;
				margin-left: 10%;
				min-width: 300px;
			}
		}
	style>
head>
<body>
	<div class="box">
		<div class="it">1div>
		<div class="it">2div>
		<div class="it">3div>
		<div class="it">4div>
		<div class="it">5div>
		<div class="it">6div>
		<div class="it">7div>
		<div class="it">8div>
		<div class="it">9div>
		<div class="it">10div>
		<div class="it">11div>
		<div class="it">12div>
	div>
body>
html>

过渡

过渡:从一个状态以动画的方式变成另一种状态的这种变化过程

过渡效果通过hover产生,可以制作一个hover层

hover层处理方式:与显示层同等区域大小

同样可以将显示层的位置交于hover层处理


<html>
<head>
	<meta charset="UTF-8">
	<title>过度title>
	<style type="text/css">
		.box {
			width: 200px;
			height: 200px;
			background-color: orange;
			/*过度*/
			/*持续时间*/
			/*来去均具有过度效果*/
			transition-duration: .5s;
			/*延迟时间*/
			/*transition-delay: 1s;*/
			/*过度属性: all*/
			/*transition-property: width, height;*/
			/*过度曲线*/
			/*transition-timing-function: linear;*/

			/*整体设置*/
			/*transition: all .3s .1s linear;*/
			transition: .3s cubic-bezier(0,.99,0,.99);
		}
		.hover {
			width: 200px;
			height: 200px;
			margin: 0 auto;
		}
		/*可以制造第二状态的处理方式*/
		.hover:hover .box {
			width: 400px;
			height: 190px;
			background-color: red;
			/*去向第二状态才有过度效果*/
			/*transition-duration: .1s;*/
		}

	style>
head>
<body>
	<div class="hover">
		<div class="box">div>
	div>
	
body>
html>

动画


<html>
<head>
	<meta charset="UTF-8">
	<title>动画title>
	<style type="text/css">
		.box {
			width: 200px;
			height: 200px;
			background-color: orange;
		}
		/*动画样式*/
		.box {
			/*绑定动画名*/
			animation-name: wasai;
			/*持续时间*/
			animation-duration: 1s;
			/*延迟时间*/
			/*animation-delay: .1s;*/
			/*动画结束停留位置:backwards起点 forwards终点*/
			/*animation-fill-mode: forwards;*/
			/*运动次数 infinite无数次*/
			animation-iteration-count: 4;
			/*多次运动方向的规则*/
			/*alternate:来回*/
			/*alternate-reverse:终点开始来回*/
			/*animation-direction: alternate-reverse;*/quotes: ;
			/*动画状态 running*/
			/*animation-play-state: paused;*/

			/*整体设置*/
			animation: wasai 1s 2 linear alternate;
		}
		.box:hover {
			animation-play-state: running;
		}
		/*动画体*/
		@keyframes wasai{
   			0% {

   			}
    		100% {
    			width: 400px;
    		}
		}
		@keyframes wasai1{
   			0% {}
    		100% {}
		}
		@keyframes wasai2{
   			0% {}
    		100% {}
		}
	style>
head>
<body>
	<div class="box">div>
body>
html>

以上为本次学习内容

你可能感兴趣的:(前端网页学习 Day49(z-index属性 flex布局 响应式布局 过渡 动画))

  • python学习系列之logging(一、基础教程) Idea King python3
    文章目录1.什么是日志？为什么需要日志？2.什么时候使用什么级别的日志？2.1日志的级别3.logging基础教程3.1输出到控制台3.2记录日志到文件3.3从多个模块记录日志3.4记录变量数据3.5修改日志输出的格式参考文献按照官方使用说明进行编写1.什么是日志？为什么需要日志？日志是对软件执行时所发生事件的一种追踪方式。软件开发人员对他们的代码添加日志调用，借此来指示某事件的发生。一个事件通过
  • python 基本知识 达达玲玲 python开发语言
    Python：背景知识及环境安装什么是Python？Python是一种解释型、面向对象的高级编程语言。它的设计哲学强调代码的可读性和简洁性，因此被广泛应用于各种领域，包括：数据科学与机器学习：NumPy,Pandas,Matplotlib,Scikit-learn等库让Python成为了数据分析和机器学习的首选语言。Web开发：Django,Flask等框架提供了高效的Web开发解决方案。自动化：
  • 学习使用pymodbus模块实现Modbus通讯 草莓仙生 学习单片机嵌入式硬件
    Modbus是一种工业领域广泛使用的通信协议，而PyModbus是一个在Python中实现Modbus通信的库。它支持多种Modbus模式，包括RTU（通过串行线路），ASCII和TCP/IP。1.建立通讯frompymodbus.clientimportModbusTcpClientclient=ModbusTcpClient('localhost',port=502)client.connec
  • 力扣动态规划-12【算法学习day.106】 南宫生 算法#动态规划算法leetcode动态规划java数据结构
    前言###我做这类文章一个重要的目的还是给正在学习的大家提供方向（例如想要掌握基础用法，该刷哪些题？建议灵神的题单和代码随想录）和记录自己的学习过程，我的解析也不会做的非常详细，只会提供思路和一些关键点，力扣上的大佬们的题解质量是非常非常高滴！！！习题1.乘积最大子数组题目链接:152.乘积最大子数组-力扣（LeetCode）题面:代码:classSolution{publicintmaxProd
  • 力扣动态规划-10【算法学习day.104】 南宫生 算法#动态规划算法leetcode动态规划java学习
    前言###我做这类文章一个重要的目的还是给正在学习的大家提供方向（例如想要掌握基础用法，该刷哪些题？建议灵神的题单和代码随想录）和记录自己的学习过程，我的解析也不会做的非常详细，只会提供思路和一些关键点，力扣上的大佬们的题解质量是非常非常高滴！！！习题1.环形子数组的最大和题目链接:918.环形子数组的最大和-力扣（LeetCode）题面:附上灵神代码:classSolution{publicin
  • 学习yosys(一款开源综合器) qq85058522 自己动手写CPUfpga开发
    安装sudoapt-getinstallyosys#ubuntu22.04仓库里面是yosys-0.9sudoinstallxdot创建脚本show_rtl.ysread_verilogcpu.vhierarchy-topcpuproc;opt;fsm;opt;memory;opt;show-prefixcpu调用脚本yosysshow_rtl.ysverilog代码modulecpu(input
  • NVIDIA Isaac Lab 入门教程（一） kuan_li_lyg 机器人最优控制工具人工智能机器人开发语言python强化学习模仿学习Isaac
    系列文章目录前言IsaacLab是一个用于机器人学习的统一模块化框架，旨在简化机器人研究中的常见工作流程（如RL、从演示中学习和运动规划）。它建立在英伟达IsaacSim的基础上，利用最新的仿真功能实现逼真的场景和快速高效的仿真。该框架的核心目标是模块化：轻松定制和添加新环境、机器人和传感器。灵活性：适应社区不断变化的需求。开放性：保持开源，允许社区贡献和扩展框架。包含电池：包含大量可随时使用的环
  • isaac lab 教程（二） weixin_44572777 机器人
    关于看过的内容的备份，在初期学习开发过程中是不必要的原文链接开发人员指南—IsaacLabdocumentation(robotsfan.com)开发人员指南对于开发，我们建议使用MicrosoftVisualStudioCode(VSCode)。NVIDIAOmniverse也建议使用此方法，并且存在有关如何使用VSCode进行调试Omniverse扩展的教程。设置VisualStudioCod
  • 深入Kotlin语言在Android开发中的应用_Android_lecture07 新职语
    本文还有配套的精品资源，点击获取简介：在Android开发领域，Kotlin凭借其简洁性、安全性和强大的交互能力已经成为首选编程语言。本讲座将深入讲解Kotlin的基础语法、空安全、类型系统、高阶函数与Lambda表达式、扩展函数与属性、Anko库、协程、Android核心组件以及数据绑定。同时，还将介绍Dagger2或Hilt依赖注入、MVVM架构和AndroidJetpack组件等高级技巧，并
  • Pytest Fixtures 介绍与用法 香奈儿5号奶茶 pytest
    PytestFixtures是Pytest框架中用于管理测试前置条件和后置清理的一种强大工具。可以帮助我们在测试中设置初始状态，减少重复代码，并提高测试的可维护性登录后复制下载代码查看我的示例gitclonehttps://gitee.com/Ac1998/pytest-fixtures-demo.git1.2.下面我们来学习一下如何使用它前置条件已经安装了最新版本已安装Python基本了解如何使
  • python模块之psutil详解_基于python调用psutil模块过程解析 谢艺馨
    这篇文章主要介绍了基于python调用psutils模块过程解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下用Python来编写脚本简化日常的运维工作是Python的一个重要用途。在Linux下，有许多系统命令可以让我们时刻监控系统运行的状态，如ps，top，free等等。要获取这些系统信息，Python可以通过subprocess模块调用并获
  • 软件测试基础：全面入门与实践指南 AWS云计算
    本文还有配套的精品资源，点击获取简介：软件测试是软件开发中的关键环节，对产品的质量和用户体验起决定性作用。本文详细介绍了软件测试的基本概念、类型、方法和过程，提供了测试工具的选择建议，并强调了持续学习、沟通协作、问题解决和业务理解的重要性。这些内容为软件测试的初学者提供了全面的入门指导和实践建议。1.软件测试基本概念与目标软件测试是确保软件质量和可靠性的关键环节，贯穿于整个软件开发生命周期。测试的
  • Python subprocess模块学习总结 weixin_34414196 pythonshell操作系统
    2019独角兽企业重金招聘Python工程师标准>>>从Python2.4开始，Python引入subprocess模块来管理子进程，以取代一些旧模块的方法：如os.system、os.spawn*、os.popen*、popen2.*、commands.*不但可以调用外部的命令作为子进程，而且可以连接到子进程的input/output/error管道，获取相关的返回信息一、subprocess以
  • 服务器中的流量主要是指什么？ wanhengidc 服务器运维流量
    服务器流量就是指服务器在单位时间内所传输的数据量，服务器流量在互联网中起着十分重要的作用，一般会被用来处理网站的访问请求，当用户在网站中浏览网页和视频时，服务器会接收到用户的请求，同时会返回网站的内容。服务器流量能够决定服务器可以处理的用户访问量和反应速度，服务器中的高流量则表示着可以同时处理多种用户请求，还可以保证网站正常运行和响应用户请求。服务器流量也是评估服务器性能的重要参考指标之一，管理员
  • 软件测试学习路线 IT菇凉 单元测试jmeter功能测试
    软件测试学习路线1.软件测试基础知识内容软件测试职业以及发展定位软件测试的概述&原则软件测试的策略及详细讲解软件测试的生命周期软件测试工作流程软件需求分析制作详解软件测试计划的编写软件测试用例的常用方法–等价类，边界值软件测试用例的常用方法–因果图，判定表测试用例的常用方法–状态迁移图;场景法软件测试环境准备&团队组织架构&职责划分bug编写规范，教你写出不low的缺陷bug的流转与状态处理缺陷编
  • 预训练语言模型 Algorithm_Engineer_ 基础知识和深度学习语言模型人工智能自然语言处理
    一.预训练模型的基本介绍预训练模型是一种在大规模数据上训练而得的模型，通常通过无监督学习或自监督学习的方式进行。在预训练阶段，模型被训练来学习数据的内在表示，而无需标注数据或任务特定的目标函数。这种学习能力使得预训练模型可以捕获数据的复杂结构和特征，并且在后续的特定任务上进行微调，从而提高模型在目标任务上的性能。1.1预训练过程数据收集与处理：收集大规模的数据，并对数据进行预处理，以便模型训练使用
  • 利用jQuery实现h5播放器播放组件 我是真的不会前端 html5jqueryjavascript前端
    播放组件介绍首先会H5播放组件其实自带videoaudio标签，只需要引入添加属性就可以自动在网页上播放，同样，vue和react也有相应的播放插件。比如vue-video-player和reactnative的播放组件这里提供一个npm地址https://www.npmjs.com/package/vue-video-playerhttps://www.npmjs.com/package/rea
  • web自动化——前端知识 大哥喝阔落 前端自动化运维
    是HTML中的一个元素，用于在当前网页中嵌入另一个网页或文档。它就像一个“窗口”，可以在页面中显示其他内容。主要特点：嵌入外部内容：可以在网页中嵌入其他网页、视频、地图等。独立上下文：嵌入的内容与主页面相互独立，拥有自己的JavaScript和CSS环境。可定制：可以通过属性调整大小、边框等。常用属性：src：指定要嵌入内容的URL。width和height：设置iframe的宽度和高度。fram
  • CSS：模拟下雪效果动画制作教程 IT新时代 前端css前端开发web前端前端基础
    下雪效果只是一类效果的名称，可以是红包雨等一些自由落体的运动效果，本文就是用纯css模拟下雪的效果，更多效果大家可以自行发挥。1.前言由于公司产品的活动，需要模拟类似下雪的效果。浏览器实现动画无非css3和canvas（还有gif），对比下css3和canvas的优缺点：动画自由度：canvas胜；复杂度：canvas胜；兼容性：canvas胜；性能：css3胜（requestAnimationF
  • 【软件测试】冒烟测试详解 测试杂货铺 python软件测试自动化测试测试工具职场和发展程序人生压力测试
    视频学习：文末有免费的配套视频可观看点击文末小卡片，免费获取软件测试全套资料，资料在手，涨薪更快冒烟测试介绍冒烟测试一词，来源于电路板测试：电路板拼接或组装完成后，进行通电测试，如果冒烟，则说明存在缺陷。而软件应用中，对其的定义为：在软件开发过程中的一种针对软件版本包的快速基本功能验证策略，是对软件基本功能进行确认验证的手段，并非深入测试。通过冒烟测试，可以快速判断提测软件包是否具有可测性，也可以
  • Linux 内核学习(3) --- 内核中断机制 小猪佩奇TONY Linux内核学习单片机linux
    目录中断来源中断处理程序Linux中断处理程序架构获取中断信息ARMGIC申请和释放中断DTS中的配置中断处理函数中断来源根据中断的来源，中断可以分为外部中断和内部中断,内部中断的来源是CPU内部(软件中断指令，溢出，除法错误等),例如操作系统从用户态切换到内核态,需要借助于CPU的软件中断，外部中断的中断源来自于外设，由外设提出请求。根据中断是否可以被屏蔽分为可屏蔽中断和不可屏蔽中断(NMI)，
  • IsaacLab从入门到精通（六）真机部署与Sim2real NathanWu7 IsaacLab人工智能机器人深度学习机器学习
    在之前的教程中，我们已经完成了整个强化学习任务流程，现在我们需要将自己训练的策略迁移到真机上1.1Sim2real简要方法论强化学习的Sim2real问题一直以来是非常难解决的问题，在仿真环境中训练的policy往往很难迁移到实际的机器人系统上，因此我们需要用一些特殊的方法协助来实现这个过程。1.1.1建立数字孪生（Digitaltwin）在仿真环境中，我们建立的环境需要尽可能与真实世界对齐，因此
  • 智能工厂的设计软件 应用场景的一个例子：为AI聊天工具添加一个知识系统 之8 重新开始 之1 特定于领域的模板--一个三套接的hoc结构 一水鉴天 软件智能人工语言智能制造人工智能状态模式
    由于前面的项目信息全部丢失，所以重新建立了这个项目，并以前一篇文章（之7）中的内容作为项目附件重新沟通。本文要点特定于领域的模板--一个三套接的hoc结构。这是今天讨论的内容。它是本项目actors剧本原型。其地位：祖传代码脚本模板中的--一个div标签的内容模型，在三端架构中描述前端执行公式的“体”性。目的是准备完善出该项目。希望的做法是：我将我给出的附件文档中零散的一些考虑组成出完整的描述文字
  • 我的创作纪念日 蒙奇D索大 年度总结c语言创作纪念日
    我的创作纪念日前言一、人生之路的抉择1.1为什么会选计算机呢？1.2为什么开始写博客呢？二、这一年的小结2.1博客开设的专栏2.2这一年的收获2.3每天的日常2.4学习上的成就三、对接下来的学习规划前言大家好，很高兴又和大家见面啦！从2023.8.19到今天一眨眼，一年多就过去了。我从2023.10.01在C站发表了第一篇文章——猜数字，到2024.10.01刚好就满一年了。原本这篇文章应该在20
  • GRAPHARG——学习 大哥喝阔落 学习flaskpython
    20250106项目git地址：https://github.com/microsoft/graphrag.git版本：1.2.0###Thisconfigfilecontainsrequiredcoredefaultsthatmustbeset,alongwithahandfulofcommonoptionalsettings.###Forafulllistofavailablesettings
  • 鸿蒙学习自由流转与分布式运行环境-价值与架构定义(1) 技术分享，共享成长 鸿蒙harmonyos学习架构
    文章目录价值与架构定义1、价值2、架构定义随着个人设备数量越来越多，跨多个设备间的交互将成为常态。基于传统OS开发跨设备交互的应用程序时，需要解决设备发现、设备认证、设备连接、数据同步等技术难题，不但开发成本高，还存在安全隐私、兼容性、性能等诸多问题。为了适应万物互联时代的环境变化，鸿蒙系统构建了基于分布式运行环境所需要的基础设施，为开发者提供了基础的分布式框架能力，使开发者可以更方便的实现跨设备
  • 【Python】已解决：error: subprocess-exited-with-error 屿小夏 python开发语言linux
    个人简介：某不知名博主，致力于全栈领域的优质博客分享|用最优质的内容带来最舒适的阅读体验！文末获取免费IT学习资料！文末获取更多信息精彩专栏推荐订阅收藏专栏系列直达链接相关介绍书籍分享点我跳转书籍作为获取知识的重要途径，对于IT从业者来说更是不可或缺的资源。不定期更新IT图书，并在评论区抽取随机粉丝，书籍免费包邮到家AI前沿点我跳转探讨人工智能技术领域的最新发展和创新，涵盖机器学习、深度学习、自然
  • 智能工厂的设计软件 应用场景的一个例子：为AI聊天工具添加一个知识系统 之6 三端架构的本质/内在/外观：自明性/信念/bank词扇 一水鉴天 软件智能智能制造人工语言人工智能
    本文提要一些补充在为前端和后端锁定的两个中心词“概念”（命题“作文”的程序公共逻辑语言）和“描述”（谓词“描述”的自然描述语言）的基础上，暂时将中端的中心词锁定在“环境”（情境“意义”的人工语义网络语言）。三者的共同性--都需要通过“演算”得到（命题演算/谓词演算/情境演算）。每种演算都以本地或局部的this此岸为输入（A-box，最初是一个条件分支符--条件表达式），远处或全局的彼岸that（T
  • python删除类方法_026.Python面向对象类的相关操作以及对象和类的删除操作 weixin_39708502 python删除类方法
    类的相关操作定义的类访问共有成员的成员和方法定义的类动态添加公有成员的属性和方法定义的类删除公有成员的属性和方法1定义一个基本的类#定义一个类classPlane():#添加一个共有成员属性capitain="John"#添加一个私有成员属性__flight_attendant=20#共有绑定方法deffly(self):print("飞机飞行速度更快")#共有普通方法，这个只能是使用类来调用de
  • html手机端富文本,移动端富文本踩坑 weixin_39608657 html手机端富文本
    最近在做一个vue的项目。之前的前端同事离职了，和女朋友去云南潇洒去了，剩下我一个苦逼坐在电脑前哒哒哒敲代码。刚刚接手就开始做移动端富文本编辑器的需求。主管说压了半个月，尽快做出来。在网上找了不少编辑器，前段时间做过react的后台项目，用了百度的编辑器。功能很多很强，遗憾的是ios不支持flash，在移动端并不适用。因为要兼容ios和Android，而且还要在vue的项目中使用，在网上找了很多编
  • HQL之投影查询 归来朝歌 HQLHibernate查询语句投影查询
            在HQL查询中，常常面临这样一个场景，对于多表查询，是要将一个表的对象查出来还是要只需要每个表中的几个字段，最后放在一起显示？ 针对上面的场景，如果需要将一个对象查出来： HQL语句写“from 对象”即可 Session session = HibernateUtil.openSession();
  • Spring整合redis bylijinnan redis
    pom.xml <dependencies> <!-- Spring Data - Redis Library --> <dependency> <groupId>org.springframework.data</groupId> <artifactId>spring-data-redi
  • org.hibernate.NonUniqueResultException: query did not return a unique result: 2 0624chenhong Hibernate
    参考：http://blog.csdn.net/qingfeilee/article/details/7052736 org.hibernate.NonUniqueResultException: query did not return a unique result: 2         在项目中出现了org.hiber
  • android动画效果 不懂事的小屁孩 android动画
    前几天弄alertdialog和popupwindow的时候，用到了android的动画效果，今天专门研究了一下关于android的动画效果，列出来，方便以后使用。 Android 平台提供了两类动画。 一类是Tween动画，就是对场景里的对象不断的进行图像变化来产生动画效果（旋转、平移、放缩和渐变）。 第二类就是 Frame动画，即顺序的播放事先做好的图像，与gif图片原理类似。
  • js delete 删除机理以及它的内存泄露问题的解决方案 换个号韩国红果果 JavaScript
    delete删除属性时只是解除了属性与对象的绑定，故当属性值为一个对象时，删除时会造成内存泄露  （其实还未删除） 举例： var person={name:{firstname:'bob'}} var p=person.name delete person.name p.firstname -->'bob' // 依然可以访问p.firstname，存在内存泄露
  • Oracle将零干预分析加入网络即服务计划 蓝儿唯美 oracle
    由Oracle通信技术部门主导的演示项目并没有在本月较早前法国南斯举行的行业集团TM论坛大会中获得嘉奖。但是，Oracle通信官员解雇致力于打造一个支持零干预分配和编制功能的网络即服务（NaaS）平台，帮助企业以更灵活和更适合云的方式实现通信服务提供商（CSP）的连接产品。这个Oracle主导的项目属于TM Forum Live!活动上展示的Catalyst计划的19个项目之一。Catalyst计
  • spring学习——springmvc（二） a-john springMVC
    Spring MVC提供了非常方便的文件上传功能。 1，配置Spring支持文件上传： DispatcherServlet本身并不知道如何处理multipart的表单数据，需要一个multipart解析器把POST请求的multipart数据中抽取出来，这样DispatcherServlet就能将其传递给我们的控制器了。为了在Spring中注册multipart解析器，需要声明一个实现了Mul
  • POJ-2828-Buy Tickets aijuans ACM_POJ
    POJ-2828-Buy Tickets http://poj.org/problem?id=2828 线段树，逆序插入 #include<iostream>#include<cstdio>#include<cstring>#include<cstdlib>using namespace std;#define N 200010struct
  • Java Ant build.xml详解 asia007 build.xml
    1,什么是antant是构建工具2,什么是构建概念到处可查到，形象来说，你要把代码从某个地方拿来，编译，再拷贝到某个地方去等等操作，当然不仅与此，但是主要用来干这个3,ant的好处跨平台   --因为ant是使用java实现的，所以它跨平台使用简单--与ant的兄弟make比起来语法清晰--同样是和make相比功能强大--ant能做的事情很多，可能你用了很久，你仍然不知道它能有
  • android按钮监听器的四种技术 百合不是茶 androidxml配置监听器实现接口
    android开发中经常会用到各种各样的监听器,android监听器的写法与java又有不同的地方;    1,activity中使用内部类实现接口 ,创建内部类实例  使用add方法  与java类似   创建监听器的实例 myLis lis = new myLis();   使用add方法给按钮添加监听器  
  • 软件架构师不等同于资深程序员 bijian1013 程序员架构师架构设计
            本文的作者Armel Nene是ETAPIX Global公司的首席架构师，他居住在伦敦，他参与过的开源项目包括 Apache Lucene,，Apache Nutch， Liferay 和 Pentaho等。         如今很多的公司
  • TeamForge Wiki Syntax & CollabNet User Information Center sunjing TeamForgeHow doAttachementAnchorWiki Syntax
    the CollabNet user information center http://help.collab.net/   How do I create a new Wiki page? A CollabNet TeamForge project can have any number of Wiki pages. All Wiki pages are linked, and
  • 【Redis四】Redis数据类型 bit1129 redis
    概述 Redis是一个高性能的数据结构服务器，称之为数据结构服务器的原因是，它提供了丰富的数据类型以满足不同的应用场景，本文对Redis的数据类型以及对这些类型可能的操作进行总结。 Redis常用的数据类型包括string、set、list、hash以及sorted set.Redis本身是K/V系统，这里的数据类型指的是value的类型，而不是key的类型，key的类型只有一种即string
  • SSH2整合-附源码 白糖_ eclipsespringtomcatHibernateGoogle
    今天用eclipse终于整合出了struts2+hibernate+spring框架。 我创建的是tomcat项目，需要有tomcat插件。导入项目以后，鼠标右键选择属性，然后再找到“tomcat”项，勾选一下“Is a tomcat project”即可。具体方法见源码里的jsp图片，sql也在源码里。     补充1：项目中部分jar包不是最新版的，可能导
  • [转]开源项目代码的学习方法 braveCS 学习方法
    转自： http://blog.sina.com.cn/s/blog_693458530100lk5m.html http://www.cnblogs.com/west-link/archive/2011/06/07/2074466.html   1）阅读features。以此来搞清楚该项目有哪些特性2）思考。想想如果自己来做有这些features的项目该如何构架3）下载并安装d
  • 编程之美-子数组的最大和（二维） bylijinnan 编程之美
    package beautyOfCoding; import java.util.Arrays; import java.util.Random; public class MaxSubArraySum2 { /** * 编程之美 子数组之和的最大值（二维） */ private static final int ROW = 5; private stat
  • 读书笔记-3 chengxuyuancsdn jquery笔记resultMap配置ibatis一对多配置
    1、resultMap配置 2、ibatis一对多配置 3、jquery笔记 1、resultMap配置 当<select resultMap="topic_data"> <resultMap id="topic_data">必须一一对应。 (1)<resultMap class="tblTopic&q
  • [物理与天文]物理学新进展 comsci
          如果我们必须获得某种地球上没有的矿石,才能够进行某些能量输出装置的设计和建造,而要获得这种矿石,又必须首先进行深空探测,而要进行深空探测,又必须获得这种能量输出装置,这个矛盾的循环,会导致地球联盟在与宇宙文明建立关系的时候,陷入困境       怎么办呢?  
  • Oracle 11g新特性:Automatic Diagnostic Repository daizj oracleADR
    Oracle Database 11g的FDI（Fault Diagnosability Infrastructure）是自动化诊断方面的又一增强。 FDI的一个关键组件是自动诊断库（Automatic Diagnostic Repository-ADR）。 在oracle 11g中，alert文件的信息是以xml的文件格式存在的，另外提供了普通文本格式的alert文件。 这两份log文
  • 简单排序:选择排序 dieslrae 选择排序
    public void selectSort(int[] array){ int select; for(int i=0;i<array.length;i++){ select = i; for(int k=i+1;k<array.leng
  • C语言学习六指针的经典程序，互换两个数字 dcj3sjt126com c
    示例程序，swap_1和swap_2都是错误的，推理从1开始推到2，2没完成，推到3就完成了 # include <stdio.h> void swap_1(int, int); void swap_2(int *, int *); void swap_3(int *, int *); int main(void) { int a = 3; int b =
  • php 5.4中php-fpm 的重启、终止操作命令 dcj3sjt126com PHP
    php 5.4中php-fpm 的重启、终止操作命令: 查看php运行目录命令：which php/usr/bin/php 查看php-fpm进程数：ps aux | grep -c php-fpm 查看运行内存/usr/bin/php  -i|grep mem 重启php-fpm/etc/init.d/php-fpm restart 在phpinfo()输出内容可以看到php
  • 线程同步工具类 shuizhaosi888 同步工具类
    同步工具类包括信号量（Semaphore）、栅栏（barrier）、闭锁（CountDownLatch）   闭锁（CountDownLatch） public class RunMain { public long timeTasks(int nThreads, final Runnable task) throws InterruptedException { fin
  • bleeding edge是什么意思 haojinghua DI
    不止一次，看到很多讲技术的文章里面出现过这个词语。今天终于弄懂了——通过朋友给的浏览软件，上了wiki。  我再一次感到，没有辞典能像WiKi一样，给出这样体贴人心、一清二楚的解释了。为了表达我对WiKi的喜爱，只好在此一一中英对照，给大家上次课。   In computer science, bleeding edge is a term that
  • c中实现utf8和gbk的互转 jimmee ciconvutf8&gbk编码
    #include <iconv.h> #include <stdlib.h> #include <stdio.h> #include <unistd.h> #include <fcntl.h> #include <string.h> #include <sys/stat.h> int code_c
  • 大型分布式网站架构设计与实践 lilin530 应用服务器搜索引擎
    1.大型网站软件系统的特点？ a.高并发，大流量。 b.高可用。 c.海量数据。 d.用户分布广泛，网络情况复杂。 e.安全环境恶劣。 f.需求快速变更，发布频繁。 g.渐进式发展。 2.大型网站架构演化发展历程？ a.初始阶段的网站架构。 应用程序，数据库，文件等所有的资源都在一台服务器上。 b.应用服务器和数据服务器分离。 c.使用缓存改善网站性能。 d.使用应用
  • 在代码中获取Android theme中的attr属性值 OliveExcel androidtheme
    Android的Theme是由各种attr组合而成, 每个attr对应了这个属性的一个引用, 这个引用又可以是各种东西.   在某些情况下, 我们需要获取非自定义的主题下某个属性的内容 (比如拿到系统默认的配色colorAccent), 操作方式举例一则: int defaultColor = 0xFF000000; int[] attrsArray = { andorid.r.
  • 基于Zookeeper的分布式共享锁 roadrunners zookeeper分布式共享锁
    首先，说说我们的场景，订单服务是做成集群的，当两个以上结点同时收到一个相同订单的创建指令，这时并发就产生了，系统就会重复创建订单。等等......场景。这时，分布式共享锁就闪亮登场了。   共享锁在同一个进程中是很容易实现的，但在跨进程或者在不同Server之间就不好实现了。Zookeeper就很容易实现。具体的实现原理官网和其它网站也有翻译，这里就不在赘述了。   官
  • 两个容易被忽略的MySQL知识 tomcat_oracle mysql
    1、varchar(5)可以存储多少个汉字，多少个字母数字？ 　　相信有好多人应该跟我一样，对这个已经很熟悉了，根据经验我们能很快的做出决定，比如说用varchar(200)去存储url等等，但是，即使你用了很多次也很熟悉了，也有可能对上面的问题做出错误的回答。 　　这个问题我查了好多资料，有的人说是可以存储5个字符，2.5个汉字（每个汉字占用两个字节的话），有的人说这个要区分版本，5.0
  • zoj 3827 Information Entropy(水题) 阿尔萨斯 format
    题目链接：zoj 3827 Information Entropy 题目大意：三种底，计算和。 解题思路：调用库函数就可以直接算了，不过要注意Pi = 0的时候，不过它题目里居然也讲了。。。limp→0+plogb(p)=0，因为p是logp的高阶。 #include <cstdio> #include <cstring> #include <cmath&
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他