CSS属性其他小案例

CSS小案例

运动的汽车
无缝滚动
传统三等分
伸缩布局实现三等分
伸缩布局实现固定高度
伸缩布局实现排列方式
justify-content属性

运动的汽车


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Documenttitle>
	<style type="text/css">
        img {
      
        	animation: move 5s infinite;
        }
        /*定义动画*/
	   @keyframes move {
      
           0% {
      
           	  transform: translate3d(0,0,0);
           }
           50% {
      
           	  transform: translate3d(800px,0,0);
           }
           51% {
      
           	  /*多组变形 空格隔开即可*/
           	  transform: translate3d(800px,0,0) rotateY(180deg);
           }
           100% {
      
           	  transform: translate3d(0,0,0) rotateY(180deg);
           }
	   }
	style>
head>
<body>
	<img src="car.jpg" alt="" width="100" />
body>
html>

返回顶层目录

无缝滚动


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Documenttitle>
	<style type="text/css">
	   * {
      
	   	  padding: 0;
	   	  margin: 0;
	   }

	   ul {
      
	   	  list-style: none;
	   }

	   img {
      
	   	  display: block;
	   }

	   section {
      
	   	   width: 378px;
	   	   height: 86px;
	   	   margin: 100px auto;
	   	   overflow: hidden;
	   }

	   section ul {
      
	   	   width: 1000%;
	   	   animation: moving 5s linear infinite;
	   }

	   ul li {
      
	   	  float: left;
	   }

	   /*定义动画*/
	   @keyframes moving {
      
	   	   from {
      
               transform: translateX(0);
	   	   }
	   	   to {
      
              transform: translateX(-882px); 
	   	   } 
	   }

	   section:hover ul {
      
	   	   /* 鼠标放到section时候让ul的动画暂停*/
	   	   animation-play-state: paused;
	   }
	style>  
head>
<body>
	<section>
		<ul>
			<li><img src="nav1.jpg" alt="">li>
			<li><img src="nav2.jpg" alt="">li>
			<li><img src="nav3.jpg" alt="">li>
			<li><img src="nav4.jpg" alt="">li>
			<li><img src="nav5.jpg" alt="">li>
			<li><img src="nav6.jpg" alt="">li>
			<li><img src="nav7.jpg" alt="">li>
			<li><img src="nav1.jpg" alt="">li>
			<li><img src="nav2.jpg" alt="">li>
			<li><img src="nav3.jpg" alt="">li>
		ul>
	section>
body>
html>

返回顶层目录

传统三等分


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Documenttitle>
	<style type="text/css">
	   section {
      
	   	  width: 80%; 
	   	  height: 200px;
	   	  margin: 100px auto;
	   	  border: 1px solid #ccc;
	   }

	   section div{
      
          width: 33.33%; 
          height: 100%;
          float: left;
	   }

	   div:nth-child(1) {
      
	   	  background-color: pink;
	   }

	   div:nth-child(2) {
      
	   	  background-color: red;
	   }

	   div:nth-child(3) {
      
	   	  background-color: blue;
	   }
	style>
head>
<body>
	<section>
		<div>div>
		<div>div>
		<div>div>
	section>
body>
html>

返回顶层目录

伸缩布局实现三等分


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Documenttitle>
	<style type="text/css">
	   section {
      
	   	  width: 80%; 
	   	  height: 200px;
	   	  margin: 100px auto;
	   	  border: 1px solid #ccc;
	   	  /*父盒子添加flex*/
	   	  display: flex; /*伸缩布局模式 这个盒子具有弹性*/
	   }

	   section div{
      
          height: 100%;
          flex: 1; /*子元素添加份数*/
	   }

	   div:nth-child(1) {
      
	   	  background-color: pink;
	   	  flex: 2;
	   	  order: 10;
	   }

	   div:nth-child(2) {
      
	   	  background-color: red;
	   	  order: -2;
	   }

	   div:nth-child(3) {
      
	   	  background-color: blue;
	      order: -1;
	   }
	style>
head>
<body>
	<section>
		<div>div>
		<div>div>
		<div>div>
	section>
body>
html>

返回顶层目录

伸缩布局实现固定高度


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Documenttitle>
	<style type="text/css">
	   section {
      
	   	  width: 80%; 
	   	  height: 200px;
	   	  margin: 100px auto;
	   	  border: 1px solid #ccc;
	   	  /*父盒子添加flex*/
	   	  display: flex; /*伸缩布局模式 这个盒子具有弹性*/
	   	  min-width: 500px;
	   }

	   section div{
      
          height: 100%;
	   }

	   div:nth-child(1) {
      
	   	  background-color: pink;
	   	  width: 200px;
	   }

	   div:nth-child(2) {
      
	   	  background-color: red;
	   	  width: 100px;
	   }

	   div:nth-child(3) {
      
	   	  background-color: blue;
	   	  flex: 1;
	   }

	   div:nth-child(4) {
      
	   	  background-color: green;
	   	  flex: 1;
	   }
	style>
head>
<body>
	<section>
		<div>111div>
		<div>222div>
		<div>3333div>
		<div>4444div>
	section>
body>
html>

返回顶层目录

伸缩布局实现排列方式


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Documenttitle>
	<style type="text/css">
	   section {
      
	   	  width: 80%; 
	   	  height: 200px;
	   	  margin: 100px auto;
	   	  border: 1px solid #ccc;
	   	  /*父盒子添加flex*/
	   	  display: flex; /*伸缩布局模式 这个盒子具有弹性*/
	   	  min-width: 500px;
	   	  flex-direction: row-reverse;
	   	  flex-direction: column-reverse;
	   }

	   section div{
      
         
	   }

	   div:nth-child(1) {
      
	   	  background-color: pink;
	   	  width: 200px;
	   }

	   div:nth-child(2) {
      
	   	  background-color: red;
	   	  width: 100px;
	   	  margin: 0 6px;
	   }

	   div:nth-child(3) {
      
	   	  background-color: blue;
	   	  flex: 1;
	   }

	   div:nth-child(4) {
      
	   	  background-color: green;
	   	  flex: 1;
	   }
	style>
head>
<body>
	<section>
		<div>111div>
		<div>222div>
		<div>3333div>
		<div>4444div>
	section>
body>
html>

返回顶层目录

justify-content属性


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Documenttitle>
	<style type="text/css">
	   section {
      
	   	  width: 80%; 
	   	  height: 200px;
	   	  margin: 100px auto;
	   	  border: 1px solid #ccc;
	   	  /*父盒子添加flex*/
	   	  display: flex; /*伸缩布局模式 这个盒子具有弹性*/
	   	  min-width: 500px;
	   	  justify-content: flex-start;
	   	  justify-content: flex-end; 
	   	  justify-content: center;
	   	  justify-content: space-between;
	   	  justify-content: space-around;
	   }

	   section div{
      
           width: 200px;
	   }

	   div:nth-child(1) {
      
	   	  background-color: pink;  
	   }

	   div:nth-child(2) {
      
	   	  background-color: red;
	   	  margin: 0 6px;
	   }

	   div:nth-child(3) {
      
	   	  background-color: blue;
	   	  
	   }

	   
	style>
head>
<body>
	<section>
		<div>111div>
		<div>222div>
		<div>3333div>
	section>
body>
html>

返回顶层目录

align-items属性详解


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Documenttitle>
	<style type="text/css">
	   section {
      
	   	  width: 80%; 
	   	  height: 600px;
	   	  margin: 100px auto;
	   	  border: 1px solid #ccc;
	   	  /*父盒子添加flex*/
	   	  display: flex; /*伸缩布局模式 这个盒子具有弹性*/
	   	  min-width: 500px;
	   	  align-items: stretch; /*默认 子元素高度会拉伸适应父容器（子元素没有设置高度前提下）*/
	   	  align-items: center; /*垂直居中*/
	   	  align-items: flex-start;/*上对齐*/
	   	  align-items: flex-end;/*下对齐*/
	   }

	   section div{
      
           width: 200px;
           height: 200px;
	   }

	   div:nth-child(1) {
      
	   	  background-color: pink;  
	   }

	   div:nth-child(2) {
      
	   	  background-color: red;
	   	  margin: 0 6px;
	   }

	   div:nth-child(3) {
      
	   	  background-color: blue;
	   	  
	   }

	   
	style>
head>
<body>
	<section>
		<div>111div>
		<div>222div>
		<div>3333div>
	section>
body>
html>

返回底层目录

flex-wrap属性


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Documenttitle>
	<style type="text/css">
	   section {
      
	   	  width: 80%; 
	   	  height: 600px;
	   	  margin: 100px auto;
	   	  border: 1px solid #ccc;
	   	  /*父盒子添加flex*/
	   	  display: flex; /*伸缩布局模式 这个盒子具有弹性*/
	   	  min-width: 500px;
	   	  flex-wrap: nowrap;
	   	  flex-wrap: wrap-reverse;
	   	  flex-wrap: wrap;
	   	  align-content: space-between;
	   }

	   section div{
      
           width: 500px;
           height: 200px;
	   }

	   div:nth-child(1) {
      
	   	  background-color: pink;  
	   }

	   div:nth-child(2) {
      
	   	  background-color: red;
	   	  margin: 0 6px;
	   }

	   div:nth-child(3) {
      
	   	  background-color: blue;
	   	  
	   }

	   
	style>
head>
<body>
	<section>
		<div>111div>
		<div>222div>
		<div>3333div>
	section>
body>
html>

返回底层目录

返回目录

你可能感兴趣的:(前端,CSS属性其他小案例)

android系统selinux中添加新属性property 辉色投像
1.定位/android/system/sepolicy/private/property_contexts声明属性开头：persist.charge声明属性类型：u:object_r:system_prop:s0图12.定位到android/system/sepolicy/public/domain.te删除neverallow{domain-init}default_prop:property
OC语言多界面传值五大方式 Magnetic_h ios ui 学习 objective-c 开发语言
前言在完成暑假仿写项目时，遇到了许多需要用到多界面传值的地方，这篇博客来总结一下比较常用的五种多界面传值的方式。属性传值属性传值一般用前一个界面向后一个界面传值，简单地说就是通过访问后一个视图控制器的属性来为它赋值，通过这个属性来做到从前一个界面向后一个界面传值。首先在后一个界面中定义属性@interfaceBViewController:UIViewController@propertyNSSt
Cell Insight | 单细胞测序技术又一新发现，可用于HIV-1和Mtb共感染个体诊断尐尐呅
结核病是艾滋病合并其他疾病中导致患者死亡的主要原因。其中结核病由结核分枝杆菌（Mycobacteriumtuberculosis,Mtb）感染引起，获得性免疫缺陷综合症（艾滋病）由人免疫缺陷病毒（Humanimmunodeficiencyvirustype1,HIV-1）感染引起。国家感染性疾病临床医学研究中心/深圳市第三人民医院张国良团队携手深圳华大生命科学研究院吴靓团队，共同研究得出单细胞测序
Long类型前后端数据不一致 igotyback 前端
响应给前端的数据浏览器控制台中response中看到的Long类型的数据是正常的到前端数据不一致前后端数据类型不匹配是一个常见问题，尤其是当后端使用Java的Long类型（64位）与前端JavaScript的Number类型（最大安全整数为2^53-1，即16位）进行数据交互时，很容易出现精度丢失的问题。这是因为JavaScript中的Number类型无法安全地表示超过16位的整数。为了解决这个问
ArcGIS栅格计算器常见公式（赋值、0和空值的转换、补充栅格空值）研学随笔 arcgis 经验分享
我们在使用ArcGIS时通常经常用到栅格计算器，今天主要给大家介绍我日常中经常用到的几个公式，供大家参考学习。将特定值（-9999）赋值为0，例如-9999.Con("raster"==-9999,0,"raster")2.给空值赋予特定的值（如0）Con(IsNull("raster"),0,"raster")3.将特定的栅格值(如1)赋值为空值，其他保留原值SetNull("raster"==
网易严选官方旗舰店，优质商品，卓越服务高省_飞智666600
网易严选官方旗舰店是网易旗下的一家电商平台，以提供优质商品和卓越服务而闻名。作为一名SEO优化师，我将为您详细介绍网易严选官方旗舰店，并重点强调其特点和优势。大家好！我是高省APP最大团队&联合创始人飞智导师。相较于其他返利app，高省APP的佣金更高，模式更好，最重要的是，终端用户不会流失！高省APP佣金更高，模式更好，终端用户不流失。【高省】是一个自用省钱佣金高，分享推广赚钱多的平台，百度有几
Python教程：一文了解使用Python处理XPath 旦莫 Python进阶 python 开发语言
目录1.环境准备1.1安装lxml1.2验证安装2.XPath基础2.1什么是XPath？2.2XPath语法2.3示例XML文档3.使用lxml解析XML3.1解析XML文档3.2查看解析结果4.XPath查询4.1基本路径查询4.2使用属性查询4.3查询多个节点5.XPath的高级用法5.1使用逻辑运算符5.2使用函数6.实战案例6.1从网页抓取数据6.1.1安装Requests库6.1.2代
DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理 STU学生网页设计网页设计期末网页作业 html静态网页 html5期末大作业网页设计 web大作业
️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程
【加密社】Solidity 中的事件机制及其应用加密社闲侃区块链智能合约区块链
加密社引言在Solidity合约开发过程中，事件（Events）是一种非常重要的机制。它们不仅能够让开发者记录智能合约的重要状态变更，还能够让外部系统（如前端应用）监听这些状态的变化。本文将详细介绍Solidity中的事件机制以及如何利用不同的手段来触发、监听和获取这些事件。事件存储的地方当我们在Solidity合约中使用emit关键字触发事件时，该事件会被记录在区块链的交易收据中。具体而言，事件
探索OpenAI和LangChain的适配器集成：轻松切换模型提供商 nseejrukjhad langchain easyui 前端 python
#探索OpenAI和LangChain的适配器集成：轻松切换模型提供商##引言在人工智能和自然语言处理的世界中，OpenAI的模型提供了强大的能力。然而，随着技术的发展，许多人开始探索其他模型以满足特定需求。LangChain作为一个强大的工具，集成了多种模型提供商，通过提供适配器，简化了不同模型之间的转换。本篇文章将介绍如何使用LangChain的适配器与OpenAI集成，以便轻松切换模型提供商
关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript 二挡起步 web前端期末大作业 javascript html css 旅游风景
⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip
HTML网页设计制作大作业（div+css）云南我的家乡旅游景点带文字滚动二挡起步 web前端期末大作业 web设计网页规划与设计 html css javascript dreamweaver 前端
Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线
其二十八尾喵
你知道吗？图片发自App我今天知道了你有喜欢的人，不是我。心空空的，整个人都不是我的了。可，怎么办？还是要好好的活着，毕竟你喜欢的人，我不能杀，可是我可以杀其他喜欢你的人呀！也罢，此生无缘，来世再见。鱼干
Python快速入门 —— 第三节：类与对象孤华暗香 Python快速入门 python 开发语言
第三节：类与对象目标：了解面向对象编程的基础概念，并学会如何定义类和创建对象。内容：类与对象：定义类：class关键字。类的构造函数：__init__()。类的属性和方法。对象的创建与使用。示例：classStudent:def__init__(self,name,age,major):self.name&#
webpack图片等资源的处理 dmengmeng
需要的loaderfile-loader（让我们可以引入这些资源文件）url-loader（其实是file-loader的二次封装）img-loader（处理图片所需要的）在没有使用任何处理图片的loader之前，比如说css中用到了背景图片，那么最后打包会报错的，因为他没办法处理图片。其实你只想能够使用图片的话。只加一个file-loader就可以，打开网页能准确看到图片。{test:/\.(p
Python爬虫解析工具之xpath使用详解 eqa11 python 爬虫开发语言
文章目录Python爬虫解析工具之xpath使用详解一、引言二、环境准备1、插件安装2、依赖库安装三、xpath语法详解1、路径表达式2、通配符3、谓语4、常用函数四、xpath在Python代码中的使用1、文档树的创建2、使用xpath表达式3、获取元素内容和属性五、总结Python爬虫解析工具之xpath使用详解一、引言在Python爬虫开发中，数据提取是一个至关重要的环节。xpath作为一门
【PG】常见数据库、表属性设置江无羡数据库
PG的常见属性配置方法数据库复制、备份相关表的复制标识单表操作批量表操作链接数据库复制、备份相关表的复制标识单表操作通过ALTER语句单独更改一张表的复制标识。ALTERTABLE[tablename]REPLICAIDENTITYFULL;批量表操作通过代码块的方式，对某个schema中的所有表一起更新其复制标识。SELECTtablename,CASErelreplidentWHEN'd'TH
简介Shell、zsh、bash zhaosuningsn Shell zsh bash shell linux bash
Shell是Linux和Unix的外壳，类似衣服，负责外界与Linux和Unix内核的交互联系。例如接收终端用户及各种应用程序的命令，把接收的命令翻译成内核能理解的语言，传递给内核，并把内核处理接收的命令的结果返回给外界，即Shell是外界和内核沟通的桥梁或大门。Linux和Unix提供了多种Shell，其中有种bash，当然还有其他好多种。Mac电脑中不但有bash，还有一个zsh，预装的，据说
Python中深拷贝与浅拷贝的区别 yuxiaoyu.
转自：http://blog.csdn.net/u014745194/article/details/70271868定义：在Python中对象的赋值其实就是对象的引用。当创建一个对象，把它赋值给另一个变量的时候，python并没有拷贝这个对象，只是拷贝了这个对象的引用而已。浅拷贝：拷贝了最外围的对象本身，内部的元素都只是拷贝了一个引用而已。也就是，把对象复制一遍，但是该对象中引用的其他对象我不复
厉国刚：新闻学与传播学到底有何区别微观大道
厉国刚：新闻学与传播学到底有何区别头几天，有人在知乎上问我：新闻学与传播学到底有何区别。他是一位想要跨专业考研的学生，对新闻传播学学科可谓了解甚少，甚至一头雾水，想要让我帮他解释解释。在研究生学硕层面，新闻传播学是一级学科，分成新闻学、传播学这两个二级学科。有些高校，还自设了广告学、出版发行学等其他二级学科，但从官方角度，新闻传播学一级学科下，正统的就是那两个二级学科。招生时，一般会按一级学科招，
简单了解 JVM 记得开心一点啊 jvm
目录♫什么是JVM♫JVM的运行流程♫JVM运行时数据区♪虚拟机栈♪本地方法栈♪堆♪程序计数器♪方法区/元数据区♫类加载的过程♫双亲委派模型♫垃圾回收机制♫什么是JVMJVM是JavaVirtualMachine的简称，意为Java虚拟机。虚拟机是指通过软件模拟的具有完整硬件功能的、运行在一个完全隔离的环境中的完整计算机系统（如：JVM、VMwave、VirtualBox）。JVM和其他两个虚拟机
关于Mysql 中 Row size too large (＞ 8126) 错误的解决和理解秋刀prince mysql mysql 数据库
提示：啰嗦一嘴，数据库的任何操作和验证前，一定要记得先备份！！！不会有错；文章目录问题发现一、问题导致的可能原因1、页大小2、行格式2.1compact格式2.2Redundant格式2.3Dynamic格式2.4Compressed格式3、BLOB和TEXT列二、解决办法1、修改页大小（不推荐）2、修改行格式3、修改数据类型为BLOB和TEXT列4、其他优化方式（可以参考使用）4.1合理设置数据
【从浅识到熟知Linux】Linux发展史 Jammingpro 从浅学到熟知Linux linux 运维服务器
归属专栏：从浅学到熟知Linux个人主页：Jammingpro每日努力一点点，技术变化看得见文章前言：本篇文章记录Linux发展的历史，因在介绍Linux过程中涉及的其他操作系统及人物，本文对相关内容也有所介绍。文章目录Unix发展史Linux发展史开源Linux官网企业应用情况发行版本在学习Linux前，我们可能都会问Linux从哪里来？它是如何发展的。但在介绍Linux之前，需要先介绍一下Un
如何培养兴趣绽蕊向阳
今天读李笑来的书《与时间做朋友》，读到有关兴趣部分，深有感触。书中提到，好多人说对某事没有兴趣，实际上是没有能力把这件事做好，做这件事时的感受很不好，有挫败感，每个人对自己不擅长做不好的事情，都本能的容易逃避，所以就以为自己对这件事不感兴趣，他们真正感兴趣的是其他事情。可事实上，出现这种感觉应该仅仅是因为还没有开始做那件事情，也还没有在那件事情上遭受挫折而已。其实，很多人真的放弃原来做的事情，转去
戴容容中原焦点团队.网络初级第33期,坚持分享第19天 2022年3月9日 TessDai
《每个人眼中的世界都是不同的》“一千个人眼里有一千个哈姆雷特”世界是多元的,每个人都有自己的道理,人人按照自己的理解去看待这个世界的人和物.我们如此,其他人也是如此.因此,任何事情,我们要放下自己以为的真理,去理解他人认为的真理,只有同频方能共振.孩子在慢慢长大的过程中慢慢学会独立,甚至对抗.尤其当孩子处于青春期的时候,他们开始有很多自己独立的想法,和一些特立独行的做法,家长常常会觉得不可思议,觉
第1步win10宿主机与虚拟机通过NAT共享上网互通学习3人组大数据大数据
VM的CentOS采用NAT共用宿主机网卡宿主机器无法连接到虚拟CentOS要实现宿主机与虚拟机通信，原理就是给宿主机的网卡配置一个与虚拟机网关相同网段的IP地址，实现可以互通。1、查看虚拟机的IP地址2、编辑虚拟机的虚拟网络的NAT和DHCP的配置，设置虚拟机的网卡选择NAT共享模式3、宿主机的IP配置，确保vnet8的IPV4属性与虚拟机在同一网段4、ping测试连通性[root@localh
系统架构设计师需求分析篇二 AmHardy 软件架构设计师系统架构需求分析面向对象分析分析模型 UML和SysML
面向对象分析方法1.用例模型构建用例模型一般需要经历4个阶段：识别参与者：识别与系统交互的所有事物。合并需求获得用例：将需求分配给予其相关的参与者。细化用例描述：详细描述每个用例的功能。调整用例模型：优化用例之间的关系和结构，前三个阶段是必需的。2.用例图的三元素参与者：使用系统的用户或其他外部系统和设备。用例：系统所提供的服务。通信关联：参与者和用例之间的关系，或用例与用例之间的关系。3.识别参
每时每刻都是开始2019-03-09 Action熊猫
过去有多少想了无数遍要做的，但实际并没有做到的。以没时间，或其他种种自己认为可以接受的理由，看着一天走啦，一月去啦，又是一年。最后笑一笑，新年不是来了吗！重新开始...如果在过去的365天里，每次醒来，都没能开始，那新年来了，又如何呢？何不把人生的每时每刻都作为起点，不等待，不期盼，不自欺，让每时每刻都在开始中...。
2022-02-15 百味人生摆渡人
习惯她和他在谈恋时，就吵架，有时吵的还很厉害，不像其他恋人，恋爱期间有说不完的情话，享受不尽的温情，珍惜在一块的每一分每一秒。分手也分了无数次，不知怎的，就是没有分开。不见面时，特想见面，见了面时，说不了几句，又就开始吵，吵的次数多了，连他们自己也说不清值不值得吵，为什么吵。她妈妈说，这孩子从小就性格倔强。他爸爸说，这孩子从小就性格固执。想想其实也没什么大事。为吃什么吵为穿什么吵为说什么吵……日子
android 更改窗口的层次,浮窗开发之窗口层级 Ms.Bu android 更改窗口的层次
最近在项目中遇到了这样的需求：需要在特定的其他应用之上悬浮自己的UI交互(拖动、输入等复杂的UI交互)，和九游的浮窗类似，不过我们的比九游的体验更好，我们越过了很多授权的限制。浮窗效果很多人都知道如何去实现一个简单的浮窗，但是却很少有人去深入的研究背后的流程机制，由于项目中浮窗交互比较复杂，遇到了些坑查看了很多资料，故总结浮窗涉及到的知识点：窗口层级关系(浮窗是如何“浮”的)？浮窗有哪些限制，如何
ASM系列五利用TreeApi 解析生成Class lijingyao8206 ASM 字节码动态生成 ClassNode TreeAPI
前面CoreApi的介绍部分基本涵盖了ASMCore包下面的主要API及功能，其中还有一部分关于MetaData的解析和生成就不再赘述。这篇开始介绍ASM另一部分主要的Api。TreeApi。这一部分源码是关联的asm-tree-5.0.4的版本。在介绍前，先要知道一点， Tree工程的接口基本可以完
链表树——复合数据结构应用实例 bardo 数据结构树型结构表结构设计链表菜单排序
我们清楚：数据库设计中，表结构设计的好坏，直接影响程序的复杂度。所以，本文就无限级分类（目录）树与链表的复合在表设计中的应用进行探讨。当然，什么是树，什么是链表，这里不作介绍。有兴趣可以去看相关的教材。需求简介：经常遇到这样的需求，我们希望能将保存在数据库中的树结构能够按确定的顺序读出来。比如，多级菜单、组织结构、商品分类。更具体的，我们希望某个二级菜单在这一级别中就是第一个。虽然它是最后
为啥要用位运算代替取模呢 chenchao051 位运算哈希汇编
在hash中查找key的时候，经常会发现用&取代%，先看两段代码吧， JDK6中的HashMap中的indexFor方法： /** * Returns index for hash code h. */ static int indexFor(int h, int length) {
最近的情况麦田的设计者生活感悟计划软考想
今天是2015年4月27号整理一下最近的思绪以及要完成的任务 1、最近在驾校科目二练车，每周四天，练三周。其实做什么都要用心，追求合理的途径解决。为
PHP去掉字符串中最后一个字符的方法 IT独行者 PHP 字符串
今天在PHP项目开发中遇到一个需求，去掉字符串中的最后一个字符原字符串1,2,3,4,5,6, 去掉最后一个字符","，最终结果为1,2,3,4,5,6 代码如下： $str = "1,2,3,4,5,6,"; $newstr = substr($str,0,strlen($str)-1); echo $newstr;
hadoop在linux上单机安装过程 _wy_ linux hadoop
1、安装JDK jdk版本最好是1.6以上，可以使用执行命令java -version查看当前JAVA版本号，如果报命令不存在或版本比较低，则需要安装一个高版本的JDK，并在/etc/profile的文件末尾，根据本机JDK实际的安装位置加上以下几行： export JAVA_HOME=/usr/java/jdk1.7.0_25
JAVA进阶----分布式事务的一种简单处理方法无量多系统交互分布式事务
每个方法都是原子操作：提供第三方服务的系统，要同时提供执行方法和对应的回滚方法 A系统调用B,C,D系统完成分布式事务 =========执行开始======== A.aa(); try { B.bb(); } catch(Exception e) { A.rollbackAa(); } try { C.cc(); } catch(Excep
安墨移动广告：移动DSP厚积薄发引领未来广告业发展命脉矮蛋蛋 hadoop 互联网
　　“谁掌握了强大的DSP技术，谁将引领未来的广告行业发展命脉。”2014年，移动广告行业的热点非移动DSP莫属。各个圈子都在纷纷谈论，认为移动DSP是行业突破点，一时间许多移动广告联盟风起云涌，竞相推出专属移动DSP产品。　　到底什么是移动DSP呢? 　　DSP(Demand-SidePlatform)，就是需求方平台，为解决广告主投放的各种需求，真正实现人群定位的精准广
myelipse设置 alafqq IP
在一个项目的完整的生命周期中，其维护费用，往往是其开发费用的数倍。因此项目的可维护性、可复用性是衡量一个项目好坏的关键。而注释则是可维护性中必不可少的一环。注释模板导入步骤安装方法：打开eclipse/myeclipse 选择 window-->Preferences-->JAVA-->Code-->Code
java数组百合不是茶 java数组
java数组的声明创建初始化； java支持C语言数组中的每个数都有唯一的一个下标一维数组的定义声明： int[] a = new int[3];声明数组中有三个数int[3] int[] a 中有三个数，下标从0开始，可以同过for来遍历数组中的数
javascript读取表单数据 bijian1013 JavaScript
利用javascript读取表单数据，可以利用以下三种方法获取： 1、通过表单ID属性：var a = document.getElementByIdx_x_x("id"); 2、通过表单名称属性：var b = document.getElementsByName("name"); 3、直接通过表单名字获取：var c = form.content.
探索JUnit4扩展：使用Theory bijian1013 java JUnit Theory
理论机制（Theory）一.为什么要引用理论机制（Theory）当今软件开发中，测试驱动开发（TDD — Test-driven development）越发流行。为什么 TDD 会如此流行呢？因为它确实拥有很多优点，它允许开发人员通过简单的例子来指定和表明他们代码的行为意图。 TDD 的优点： &nb
[Spring Data Mongo一]Spring Mongo Template操作MongoDB bit1129 template
什么是Spring Data Mongo Spring Data MongoDB项目对访问MongoDB的Java客户端API进行了封装，这种封装类似于Spring封装Hibernate和JDBC而提供的HibernateTemplate和JDBCTemplate，主要能力包括 1. 封装客户端跟MongoDB的链接管理 2. 文档-对象映射，通过注解:@Document(collectio
【Kafka八】Zookeeper上关于Kafka的配置信息 bit1129 zookeeper
问题： 1. Kafka的哪些信息记录在Zookeeper中 2. Consumer Group消费的每个Partition的Offset信息存放在什么位置 3. Topic的每个Partition存放在哪个Broker上的信息存放在哪里 4. Producer跟Zookeeper究竟有没有关系？没有关系！！！ //consumers、config、brokers、cont
java OOM内存异常的四种类型及异常与解决方案 ronin47 java OOM 内存异常
　OOM异常的四种类型：　　　　　一：　StackOverflowError ：通常因为递归函数引起（死递归，递归太深）。-Xss 128k 一般够用。　二：　out Of memory: PermGen Space：通常是动态类大多，比如web 服务器自动更新部署时引起。-Xmx
java-实现链表反转-递归和非递归实现 bylijinnan java
20120422更新：对链表中部分节点进行反转操作，这些节点相隔k个： 0->1->2->3->4->5->6->7->8->9 k=2 8->1->6->3->4->5->2->7->0->9 注意1 3 5 7 9 位置是不变的。解法：将链表拆成两部分： a.0-&
Netty源码学习-DelimiterBasedFrameDecoder bylijinnan java netty
看DelimiterBasedFrameDecoder的API，有举例：接收到的ChannelBuffer如下： +--------------+ | ABC\nDEF\r\n | +--------------+ 经过DelimiterBasedFrameDecoder(Delimiters.lineDelimiter())之后，得到： +-----+----
linux的一些命令 -查看cc攻击-网口ip统计等 hotsunshine linux
Linux判断CC攻击命令详解 2011年12月23日 ⁄ 安全 ⁄ 暂无评论查看所有80端口的连接数 netstat -nat|grep -i '80'|wc -l 对连接的IP按连接数量进行排序 netstat -ntu | awk '{print $5}' | cut -d: -f1 | sort | uniq -c | sort -n 查看TCP连接状态 n
Spring获取SessionFactory ctrain sessionFactory
String sql = "select sysdate from dual"; WebApplicationContext wac = ContextLoader.getCurrentWebApplicationContext(); String[] names = wac.getBeanDefinitionNames(); for(int i=0; i&
Hive几种导出数据方式 daizj hive 数据导出
Hive几种导出数据方式 1.拷贝文件如果数据文件恰好是用户需要的格式，那么只需要拷贝文件或文件夹就可以。 hadoop fs –cp source_path target_path 2.导出到本地文件系统 --不能使用insert into local directory来导出数据，会报错 --只能使用
编程之美 dcj3sjt126com 编程 PHP 重构
我个人的 PHP 编程经验中，递归调用常常与静态变量使用。静态变量的含义可以参考 PHP 手册。希望下面的代码，会更有利于对递归以及静态变量的理解 header("Content-type: text/plain"); function static_function () { static $i = 0; if ($i++ < 1
Android保存用户名和密码 dcj3sjt126com android
转自：http://www.2cto.com/kf/201401/272336.html 我们不管在开发一个项目或者使用别人的项目，都有用户登录功能，为了让用户的体验效果更好，我们通常会做一个功能，叫做保存用户，这样做的目地就是为了让用户下一次再使用该程序不会重新输入用户名和密码，这里我使用3种方式来存储用户名和密码 1、通过普通的txt文本存储 2、通过properties属性文件进行存
Oracle 复习笔记之同义词 eksliang Oracle 同义词 Oracle synonym
转载请出自出处：http://eksliang.iteye.com/blog/2098861 1.什么是同义词同义词是现有模式对象的一个别名。概念性的东西，什么是模式呢？创建一个用户，就相应的创建了一个模式。模式是指数据库对象，是对用户所创建的数据对象的总称。模式对象包括表、视图、索引、同义词、序列、过
Ajax案例 gongmeitao Ajax jsp
数据库采用Sql Server2005 项目名称为:Ajax_Demo 1.com.demo.conn包 package com.demo.conn; import java.sql.Connection;import java.sql.DriverManager;import java.sql.SQLException; //获取数据库连接的类public class DBConnec
ASP.NET中Request.RawUrl、Request.Url的区别 hvt .net Web C#asp.net hovertree
如果访问的地址是：http://h.keleyi.com/guestbook/addmessage.aspx?key=hovertree%3C&n=myslider#zonemenu那么Request.Url.ToString() 的值是：http://h.keleyi.com/guestbook/addmessage.aspx?key=hovertree<&
SVG 教程（七）SVG 实例，SVG 参考手册天梯梦 svg
SVG 实例在线实例下面的例子是把SVG代码直接嵌入到HTML代码中。谷歌Chrome，火狐，Internet Explorer9，和Safari都支持。注意：下面的例子将不会在Opera运行，即使Opera支持SVG - 它也不支持SVG在HTML代码中直接使用。 SVG 实例 SVG基本形状一个圆矩形不透明矩形一个矩形不透明2 一个带圆角矩
事务管理 luyulong java spring 编程事务
事物管理 spring事物的好处为不同的事物API提供了一致的编程模型支持声明式事务管理提供比大多数事务API更简单更易于使用的编程式事务管理API 整合spring的各种数据访问抽象 TransactionDefinition 定义了事务策略 int getIsolationLevel()得到当前事务的隔离级别 READ_COMMITTED
基础数据结构和算法十一：Red-black binary search tree sunwinner Algorithm Red-black
The insertion algorithm for 2-3 trees just described is not difficult to understand; now, we will see that it is also not difficult to implement. We will consider a simple representation known
centos同步时间 stunizhengjia linux 集群同步时间
做了集群，时间的同步就显得非常必要了。以下是查到的如何做时间同步。在CentOS 5不再区分客户端和服务器，只要配置了NTP，它就会提供NTP服务。 1)确认已经ntp程序包： # yum install ntp 2)配置时间源（默认就行，不需要修改） # vi /etc/ntp.conf server pool.ntp.o
ITeye 9月技术图书有奖试读获奖名单公布 ITeye管理员 ITeye
ITeye携手博文视点举办的9月技术图书有奖试读活动已圆满结束，非常感谢广大用户对本次活动的关注与参与。 9月试读活动回顾：http://webmaster.iteye.com/blog/2118112本次技术图书试读活动的优秀奖获奖名单及相应作品如下（优秀文章有很多，但名额有限，没获奖并不代表不优秀）：《NFC：Arduino、Andro

按字母分类： A B C D E F G H I J K L M N O P Q R S T U V W X Y Z 其他