科学熊
科学熊

【css】css位置布局position

position 属性规定应用于元素的定位方法的类型。元素其实是通过使用top、bottom、left 和 right 属性来定位的。但是，需要首先设置了 position 属性，否则这些属性将不起作用。根据不同的 position 值，它们的设置特点不同。

其有五个不同的位置值：

  • static ：默认情况下的定位方式

  • relative：相对于其正常位置进行定位，设置相对定位的元素的 top、right、bottom 和 left 属性将导致其偏离其正常位置进行调整。不会对其余内容进行调整来适应元素留下的任何空间。

  • fixed：相对于视口定位的，这意味着即使滚动页面，它也始终位于同一位置。 top、right、bottom 和 left 属性用于定位此元素。固定定位的元素不会在页面中通常应放置的位置上留出空隙。

  • absolute：相对于最近的定位祖先元素进行定位（而不是相对于视口定位，如 fixed）。然而，如果绝对定位的元素没有祖先，它将使用文档主体（body），并随页面滚动一起移动。

  • sticky：根据用户的滚动位置进行定位。粘性元素根据滚动位置在相对（relative）和固定（fixed）之间切换。起先它会被相对定位，直到在视口中遇到给定的偏移位置为止 然后将其“粘贴”在适当的位置（比如 position:fixed）

1、relative
代码：

DOCTYPE html>
<html>
<head>
<style>
div.relative {
  position: relative;
  left: 30px;
  top:200px;
  width:50px;
  border: 3px solid #73AD21;
}
style>
head>
<body>
<span>内容一span>
<div class="relative">
这个 div 元素设置 position: relative;
div>
<span>内容二span>
body>
html>

渲染效果：原来的位置保留了，相对原来的位置偏移到新的位置。
【css】css位置布局position_第1张图片

2、fixed
代码：

DOCTYPE html>
<html>
<head>
<style>
div.fixed {
  position: fixed;
  bottom: 200px;
  right: 0;
  width: 300px;
  border: 3px solid #73AD21;
}
style>
head>
<body>
<h1>position: fixed;h1>
<div class="fixed">
这个 div 元素设置 position: fixed;
div>

body>
html>

渲染效果：根据视窗固定，不随页面滚动变化位置。

【css】css位置布局position_第2张图片
3、absolute

DOCTYPE html>
<html>
<head>
<style>
div.relative {
  position: relative;
  width: 400px;
  height: 200px;
  border: 3px solid #73AD21;
} 

div.absolute {
  position: absolute;
  top: 80px;
  right: 0;
  width: 200px;
  height: 100px;
  border: 3px solid #73AD21;
}
style>
head>
<body>

<h1>position: absolute;h1>
<p>设置 position: absolute; 的元素会相对于最近的定位祖先进行定位（而不是相对于视口进行定位，比如 fixed）：p>
<div class="relative">这个 div 元素设置 position: relative;
  <div class="absolute">这个 div 元素设置 position: absolute;div>
div>

body>
html>

渲染效果：
【css】css位置布局position_第3张图片
4、sticky
代码：

DOCTYPE html>
<html>
<head>
<style>
div.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 20px;
  padding: 5px;
  background-color: #cae8ca;
  border: 2px solid #4CAF50;
}
style>
head>
<body>

<p>请试着在这个框架内<b>滚动b>页面，以理解粘性定位的原理。p>

<div class="sticky">我是有粘性的！div>

<div style="padding-bottom:2000px">
  <p>在此例中，当您到达元素的滚动位置时，粘性元素将停留在页面顶部（top: 0）。p>
  <p>向上滚动以消除粘性。p>
  <p>一些启用滚动的文本.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.p>
  <p>一些启用滚动的文本.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.p>
div>

body>
html>

渲染效果：
没有滚动前，滚动过程中粘性框也跟着滚动，直达到达top:20px处，便固定在那。
【css】css位置布局position_第4张图片
滚动后：滚定在top：20px处
【css】css位置布局position_第5张图片

你可能感兴趣的:(前端,css,html,javascript)

  • webpack多页面打包的一次尝试
    初始化cd项目名webpackinit创建第二页面与其头文件touchpage2.htmltouchsrc/page2.js修改page2.jsconsole.log("success")修改webpack.config.js添加page2.html至plugins项，添加src/page2.js至entry项最终模板:constpath=require('path');constHtmlWebp
  • AI前端技术赋能智慧交通：从实时路况到智能导航 前端
    在现代社会，日益严重的交通拥堵和出行效率低下已成为许多城市面临的重大挑战。传统的交通管理模式难以应对海量交通数据和复杂的交通状况，而AI写代码工具的出现为解决这些问题提供了新的途径。特别是AI前端技术，它在处理和可视化交通数据，构建智能交通应用方面扮演着至关重要的角色，为建设智慧交通系统提供了强有力的支撑。AI前端在交通管理中的应用：数据驱动，智能决策AI前端技术在交通管理中的应用主要体现在以下几
  • nodejs创建ws服务器，前端浏览器用websocket接收信息和发送信息给服务端 cdcdhj nodejs服务器前端websocket
    首页是用nodejs建立服务器端//wsserver.jsconstWebSocket=require('ws');constwss=newWebSocket.Server({port:8080});wss.on('connection',functionconnection(ws){ws.on('error',console.error);//接收客户端发送过来的信息ws.on('message
  • 玩转前端正则表达式 正则表达式前端后端
    文章首发本人博客，由于格式和图片解析问题，可以前往阅读原文JavaScript中的正则是Perl的大子集，但Perl内部的一些表达式却没有继承正则表达式是用于匹配字符串中字符组合的模式(可参考MDN教程)扫码关注公粽号，查看更多优质文章一个例子使用正则将一个数字以科学计数法进行表示，如：//10000000=>10,000,000现在用一个正则来解决conststr='10000000'const
  • 理解静态类型：为什么选择TypeScript？
    本文我们要讨论一个非常关键的概念——静态类型，以及它是如何帮助我们更好地编写代码的，特别是为什么在开发中选择TypeScript而不是传统的JavaScript。我们可能已经听说过静态类型这个词，但是它到底是什么意思？它对我们编写代码有哪些帮助？今天我们就带你一起深入理解静态类型，探讨TypeScript的优势。4.1什么是静态类型？首先，让我们明确一下静态类型这个概念。简单来说，静态类型是指变量
  • 免费的SSL证书在哪里申请？——七大免费申请平台 sslhttphttps
    免费的SSL证书可以从多个可靠的平台申请，以下是几个推荐的选择：JoySSL特点：提供永久免费的SSL证书服务，拥有自主品牌SSL证书，服务响应快速，并提供全程技术支持。适用对象：适合希望快速、自动化部署且能提供安全有效的数据保护服务的网站。申请网址：https://www.joyssl.com/certificate/select/free.html?nid=7注册码：填写(230907)享受免
  • 深度剖析 JavaScript 变量提升与暂时性死区：原理、实战与避坑指南
    在JavaScript中，变量提升与暂时性死区影响着着程序的运行逻辑、性能表现以及可维护性。接下来将从底层原理、实际场景案例以及最佳实践全方位展开深度剖析。变量提升：JavaScript引擎背后的“隐形重构”JavaScript在执行代码前，引擎会率先开启编译流程，其中变量提升堪称关键一环。使用var关键字声明的变量以及函数声明，都会被自动“提升”至所在作用域的顶部。这一过程并非物理层面挪动代码，
  • [前端] node版本升级后续 平坑2 -npm版本问题 前端node.jsnpm版本
    最近又遇到了一个前端工程node版本升级的后续问题。一个同事在拉取了最新的master分支，安装依赖后，运行项目时有一个文件缺失，无法编译成功。定位问题：我本地重新拉取了master分支，安装依赖，运行项目可以正常启动，排除项目文件问题。在同事的电脑上重新开了一个文件夹，拉取master分支，执行安装(npminstall)，发现第一行跳了提醒(Thisversionofnpmiscompatib
  • 什么是虚拟DOM？
    古老的渲染方式（innerHTML）在虚拟DOM出现之前，我们创建页面UI最常用的方式就是innerHTML，但是它有一个很大的问题，就是会导致很多不必要的性能开销。看下面这段代码，这是个很经典的渲染服务器返回的列表数据到HTML中：constdataList=[{label:'Lorem,ipsum.',value:112.7},{label:'Praesentium,facere.',valu
  • 一篇文章引出的N个面试题
    太久没看面试题了，看之前的输入一个URL，回车之后到页面渲染的那些事，又来复习一波，把其中的碰到过的一些面试题提取出来，面向面试学习。1.如何减少DNS的解析时间启动DNS预解析；浏览器在解析HTML时，遇到配置了预解析的，会发起一个异步的DNS查询，等到资源请求时，就不用再等待DNS解析。2.HTTP和HTTPS的区别安全性：HTTP是明文传输协议，数据在传输过程中不经过加密处理，容易被窃听和篡
  • 2024前端面试经验分享 前端面试
    一、简历1、整理步骤把自己过去做过的有亮点的事情整理一遍。项目经历，通过star法则来做，不赘述，网上很多人讲。需要突出的亮点见下面。2、前端开发常见突出亮点：性能优化代码优化组件封装框架原理项目推进、协调能力技术难点的解决能力技术方案设计能力前端工程化的推进3、管理相关亮点如何制定代码规范，以及review如何提升团队人员的水平如何制定流程为团队提效4、注意点遵循star法则；尽量简洁，减少面试
  • Vue3中通过加密串进行后端验证并实现登录跳转教程 ecmascript-6
    在Vue3中进行登录并通过加密串进行后端验证，一般步骤是：用户输入用户名和密码，前端将其加密后发送给后端进行验证，后端验证通过后，返回身份验证信息（如令牌），前端接收验证结果并实现登录跳转。主要步骤：用户输入信息并加密用户输入的密码可以通过加密算法（如SHA256,AES等）进行加密，确保数据的安全性。发送请求到后端前端将加密后的数据发送到后端进行验证，通常使用POST请求。后端验证加密数据后端解
  • 教你玩转JavaScript元编程
    教你玩转JavaScript元编程大家好，我是倔强青铜三。我是一名热情的软件工程师，我热衷于分享和传播IT技术，致力于通过我的知识和技能推动技术交流与创新，欢迎关注我，微信公众号：倔强青铜三。JavaScript元编程：深度解析Proxy、Reflect和对象属性控制JavaScript元编程超越了典型编程的范畴，为开发人员提供了一套创建高度灵活、高效和响应式代码库的工具。让我们深入探讨Proxy
  • mac新手开发基础配置（前端版） macos前端vscode插件
    brewhttps://www.cnblogs.com/hanease/p/15962094.html方法四fnmhttps://www.jianshu.com/p/0843d55e044evscodehttps://blog.csdn.net/weixin_46474921/article/details/132841711有几点需要配置下：1.语言切换成中文2.文件设置自动保存3.取消预览模式
  • 基于jQuery / 原生JS两种方式流畅实现半屏悬浮窗 池泽123 jsjQueryjavascriptjquery前端
    本篇分别用jQuery和原生两种方式实现悬浮窗功能和样式的切换，兼容IE完成样式示例使用技术栈：jquery、javaScript、HTML/CSS一、基础版面悬浮窗可以有很多样式，但基础结构可以大致分为触发按钮、遮罩层、内容三部分。触发按钮通常设置在屏幕边缘，我这里举例一个右下的位置展示；联系我们/*悬浮窗触发按钮样式*/.Suspended_window_box{width:150px;hei
  • 前端-从入门到入土
    前端学习路线基础部分（HTML+CSS+JS入门）快速了解，能够进行简单的页面布局，交互JS部分，可以写一些小demo来熟悉常见的API推荐教程：https://www.bilibili.com/video/BV1BT4y1W7Aw/?spm_id_from=333....框架部分这里推荐Vue框架，相对React会更容易上手，并且中文文档也相对友好推荐教程：https://www.bilibil
  • JavaScript防抖与节流的运用 Enti7c javascript开发语言ecmascript
    防抖（Debounce）概念：防抖是指在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时。防抖的主要目的是将多次连续触发的事件合并为一次执行，适用于例如输入框输入搜索内容时，避免频繁发送请求，只在用户停止输入一段时间后才发送请求。实现思路：创建一个定时器。当事件触发时，清除之前的定时器。重新创建一个新的定时器，在指定延迟时间后执行回调函数。functiondebounce(func,
  • JavaScript 与 TypeScript 的详细对比
    JavaScript是当前Web开发的主要编程语言，也是现代前端开发的基石。尽管它灵活而强大，但在大型项目中，JavaScript的动态类型系统和无类型检查常常带来代码管理上的问题。为了解决这些问题，微软在2012年推出了TypeScript，这是一种JavaScript的超集，增加了静态类型检查、接口、类和其他现代化的编程特性。本文将深入对比JavaScript和TypeScript，分析两者在
  • 深入理解 CSS Flexbox：如何使用弹性布局实现自适应的水平和垂直居中
    在Web开发中，布局一直是CSS的一个重要主题，而水平和垂直居中往往是布局中最常见、最基础的需求。传统的居中方法通常需要使用多层嵌套、position、margin等属性来实现，代码繁琐且不够灵活。而随着CSS弹性布局（Flexbox）的引入，水平和垂直居中变得非常简单、直观，几乎可以适应所有的布局场景。本文将专注于如何使用CSSFlexbox来实现内容的自适应居中，包括水平居中、垂直居中、以及水
  • 手撸Webpack自定义Loader
    前言我们知道webpack只能处理JavaScript和Json文件，面对CSS、图片等资源是无能为力的，它需要通过loader将这些资源转换为可处理的模块。loader的本质是一个解析资源的函数模块，该函数对接受到的内容进行转换，然后返回webpack可处理的资源。loader的执行顺序loader可根据执行顺序区分为：pre：前置loadernormal：普通loaderinline：内联lo
  • 深入 JavaScript：前端开发的核心语言
    JavaScript是一种广泛应用于前端开发的编程语言，最早由Netscape公司在1995年推出。作为一种轻量、解释性和多范式的编程语言，JavaScript支持事件驱动、面向对象和函数式编程。它不仅是网页交互的核心技术之一，还随着Node.js的出现，逐渐渗透到了后端开发。本文将带你了解JavaScript的核心概念、特点及常见应用场景，帮助你掌握这门现代化的编程语言。一、JavaScript
  • Vue.js：轻量高效的前端框架
    Vue.js是一个用于构建用户界面的渐进式JavaScript框架，因其轻量、灵活和易上手的特性备受欢迎。Vue.js不仅适合小型项目的快速开发，也可用于构建复杂的单页面应用（SPA）。本文将介绍Vue.js的核心特性、项目结构、常用功能及其在现代前端开发中的应用场景。一、Vue.js简介Vue.js（简称Vue）由尤雨溪于2014年推出，是一个专注于视图层的JavaScript框架。它采用渐进式
  • vue表单案例练习：vue表单创建一行数据及删除数据的实现与理解
    ==如何使用Vue：基本结构:1、引入Vue的核心JS文件2、准备Dom结构3、实例化组件通过el属性，挂载元素，绑定id为app的html元素通过data属性，定义数据，可以在html代码段中显示的数据4、获取数据数据绑定最常见的形式就是使用“Mustache”语法(双大括号)的文本插值==@[TOC]目标两个例子:1.表单数据一行的创建+删除(彻底删除/隐藏双实现)代码+注释==特色:1:内容
  • Svelte 5震撼发布，前端开发的新变革！ 前端程序员
    title:Svelte5震撼发布，前端开发的新变革！博主小程序体验|博主公众号分享亲爱的前端小伙伴们，大家好！Svelte5正式发布啦！这可是新一代的前端框架哦。就在10月22日，这个备受期待的版本终于和我们见面了。它带来了好多超棒的更新呢。首先，它是完全重写的框架哦。这意味着什么呢？就是它让应用变得更快啦，体积更小了，而且更加可靠。我们写出来的代码也会更加一致，更符合我们的习惯。比如在代码结构
  • 【9.1】Golang后端开发系列--Gin快速入门指南 不知名美食探索家 Golang系统性学习golanggin开发语言
    文章目录一、引言二、Gin框架概述（一）什么是Gin（二）为什么选择Gin三、安装Gin框架（一）安装Go语言环境（二）使用GoModules安装Gin四、路由基础（一）基本路由定义（二）路由参数（三）查询参数五、请求处理和响应（一）处理JSON数据（二）处理表单数据六、中间件的使用️（一）内置中间件（二）中间件的执行顺序七、模板渲染（一）使用HTML模板（二）模板语法和数据传递八、错误处理❌（一
  • unplugin-dist-zip-pack：前端构建产物打包神器，开发者的得力助手
    作为一名前端开发者，在项目开发过程中，我们常常需要对构建产物进行高效的打包管理。最近，我发现了一个超级好用的插件——unplugin-dist-zip-pack，它简直是我们开发者的福音。一、强大的功能特性unplugin-dist-zip-pack能够将构建产物完美打包，并且支持众多主流的构建工具，包括Webpack、Vue-CLI、Vite、Rollup、esbuild、Astro、Nuxt和
  • AJAX是如何凭一己之力提高前端程序员的工资水平的？ 前端程序员ajax
    作者：阿达西链接：juejin.cn/post/7395396352183009290emmm，今天无意间听到一个比较奇怪的信息，就是在很早之前，前端工程师只是一个切图崽，而且工资也不是很高。说白了，就是没含金量的工作。因为那时候的Web应用相对简单，主要关注于页面的静态内容和基本的交互。所以前端开发的工作主要集中在HTML、CSS和基础的JavaScript上。但是自从AJAX出现后，前端程序员
  • cat命令详解 猫咪-9527 计算机操作系统Linux指令
    ️专栏：https://blog.csdn.net/2301_81831423/category_12872319.html主页：猫咪-9527-CSDN博客“欲穷千里目，更上一层楼。会当凌绝顶，一览众山小。”cat是Linux/Unix中的一个非常常用的命令，主要用于连接文件并显示文件内容。它的名称来源于concatenate（连接），不仅可以查看文件内容，还能将多个文件合并为一个文件，或用作其
  • ls指令详讲 猫咪-9527 计算机操作系统linux
    ️专栏：https://blog.csdn.net/2301_81831423/category_12872319.html主页：猫咪-9527-CSDN博客“欲穷千里目，更上一层楼。会当凌绝顶，一览众山小。”目录基本语法常用选项详解1.基本选项2.组合选项文件类型表示高级选项常见用法示例常用别名ls是Linux/Unix系统中一个非常常用的命令，用于列出指定目录中的文件和子目录。它可以提供文件的
  • CSS盒子模型的外边距详解 平常心cyk css前端
    CSS盒子模型的外边距（margin）是控制元素之间间距的重要属性。以下是与CSS盒子模型外边距相关的所有重要知识点：一、外边距的概念外边距是指盒子边框与其他元素边框之间的空白区域。它用于控制元素之间的距离，从而调整页面布局。二、外边距的设置在CSS中，可以使用margin属性或margin-top、margin-right、margin-bottom和margin-left属性来设置外边距。属性
  • 关于旗正规则引擎规则中的上传和下载问题 何必如此 文件下载压缩jsp文件上传
    文件的上传下载都是数据流的输入输出，大致流程都是一样的。 一、文件打包下载 1.文件写入压缩包 string mainPath="D:\upload\";     下载路径 string tmpfileName=jar.zip;        &n
  • 【Spark九十九】Spark Streaming的batch interval时间内的数据流转源码分析 bit1129 Stream
      以如下代码为例（SocketInputDStream）： Spark Streaming从Socket读取数据的代码是在SocketReceiver的receive方法中，撇开异常情况不谈(Receiver有重连机制，restart方法，默认情况下在Receiver挂了之后，间隔两秒钟重新建立Socket连接)，读取到的数据通过调用store(textRead)方法进行存储。数据
  • spark master web ui 端口8080被占用解决方法 daizj 8080端口占用sparkmaster web ui
    spark master web ui 默认端口为8080，当系统有其它程序也在使用该接口时，启动master时也不会报错，spark自己会改用其它端口，自动端口号加1，但为了可以控制到指定的端口，我们可以自行设置，修改方法：   1、cd SPARK_HOME/sbin   2、vi start-master.sh     3、定位到下面部分
  • oracle_执行计划_谓词信息和数据获取 周凡杨 oracle执行计划
      oracle_执行计划_谓词信息和数据获取(上) 一：简要说明 在查看执行计划的信息中，经常会看到两个谓词filter和access，它们的区别是什么，理解了这两个词对我们解读Oracle的执行计划信息会有所帮助。 简单说，执行计划如果显示是access，就表示这个谓词条件的值将会影响数据的访问路径（表还是索引），而filter表示谓词条件的值并不会影响数据访问路径，只起到
  • spring中datasource配置 g21121 dataSource
    datasource配置有很多种，我介绍的一种是采用c3p0的，它的百科地址是： http://baike.baidu.com/view/920062.htm   <!-- spring加载资源文件 --> <bean name="propertiesConfig" class="org.springframework.b
  • web报表工具FineReport使用中遇到的常见报错及解决办法（三） 老A不折腾 finereportFAQ报表软件
    这里写点抛砖引玉，希望大家能把自己整理的问题及解决方法晾出来，Mark一下，利人利己。   出现问题先搜一下文档上有没有，再看看度娘有没有，再看看论坛有没有。有报错要看日志。下面简单罗列下常见的问题，大多文档上都有提到的。 1、repeated column width is largerthan paper width： 这个看这段话应该是很好理解的。比如做的模板页面宽度只能放
  • mysql 用户管理 墙头上一根草 linuxmysqluser
    1.新建用户 //登录MYSQL@>mysql -u root -p@>密码//创建用户mysql> insert into mysql.user(Host,User,Password) values(‘localhost’,'jeecn’,password(‘jeecn’));//刷新系统权限表mysql>flush privileges;这样就创建了一个名为：
  • 关于使用Spring导致c3p0数据库死锁问题 aijuans springSpring 入门Spring 实例Spring3Spring 教程
    这个问题我实在是为整个 springsource 的员工蒙羞 如果大家使用 spring 控制事务，使用 Open Session In View 模式， com.mchange.v2.resourcepool.TimeoutException: A client timed out while waiting to acquire a resource from com.mchange.
  • 百度词库联想 annan211 百度
    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>RunJS</title&g
  • int数据与byte之间的相互转换实现代码 百合不是茶 位移int转bytebyte转int基本数据类型的实现
    在BMP文件和文件压缩时需要用到的int与byte转换,现将理解的贴出来;   主要是要理解;位移等概念 http://baihe747.iteye.com/blog/2078029   int转byte;   byte转int;   /** * 字节转成int,int转成字节 * @author Administrator *
  • 简单模拟实现数据库连接池 bijian1013 javathreadjava多线程简单模拟实现数据库连接池
    简单模拟实现数据库连接池 实例1： package com.bijian.thread; public class DB { //private static final int MAX_COUNT = 10; private static final DB instance = new DB(); private int count = 0; private i
  • 一种基于Weblogic容器的鉴权设计 bijian1013 javaweblogic
            服务器对请求的鉴权可以在请求头中加Authorization之类的key，将用户名、密码保存到此key对应的value中，当然对于用户名、密码这种高机密的信息，应该对其进行加砂加密等，最简单的方法如下： String vuser_id = "weblogic"; String vuse
  • 【RPC框架Hessian二】Hessian 对象序列化和反序列化 bit1129 hessian
     任何一个对象从一个JVM传输到另一个JVM，都要经过序列化为二进制数据(或者字符串等其他格式，比如JSON)，然后在反序列化为Java对象，这最后都是通过二进制的数据在不同的JVM之间传输(一般是通过Socket和二进制的数据传输)，本文定义一个比较符合工作中。   1. 定义三个POJO    Person类 package com.tom.hes
  • 【Hadoop十四】Hadoop提供的脚本的功能 bit1129 hadoop
    1. hadoop-daemon.sh 1.1 启动HDFS ./hadoop-daemon.sh start namenode ./hadoop-daemon.sh start datanode  通过这种逐步启动的方式，比start-all.sh方式少了一个SecondaryNameNode进程，这不影响Hadoop的使用，其实在 Hadoop2.0中，SecondaryNa
  • 中国互联网走在“灰度”上 ronin47 管理 灰度
    中国互联网走在“灰度”上（转） 文/孕峰   第一次听说灰度这个词，是任正非说新型管理者所需要的素质。第二次听说是来自马化腾。似乎其他人包括马云也用不同的语言说过类似的意思。   灰度这个词所包含的意义和视野是广远的。要理解这个词，可能同样要用“灰度”的心态。灰度的反面，是规规矩矩，清清楚楚，泾渭分明，严谨条理，是决不妥协，不转弯，认死理。黑白分明不是灰度，像彩虹那样
  • java-51-输入一个矩阵，按照从外向里以顺时针的顺序依次打印出每一个数字。 bylijinnan java
    public class PrintMatrixClockwisely { /** * Q51.输入一个矩阵，按照从外向里以顺时针的顺序依次打印出每一个数字。 例如：如果输入如下矩阵： 1 2 3 4 5 6 7 8 9
  • mongoDB 用户管理 开窍的石头 mongoDB用户管理
      1:添加用户    第一次设置用户需要进入admin数据库下设置超级用户（use admin）      db.addUsr({user:'useName',pwd:'111111',roles:[readWrite,dbAdmin]});    第一个参数用户的名字    第二个参数
  • [游戏与生活]玩暗黑破坏神3的一些问题 comsci 生活
        暗黑破坏神3是有史以来最让人激动的游戏。。。。但是有几个问题需要我们注意      玩这个游戏的时间，每天不要超过一个小时，且每次玩游戏最好在白天      结束游戏之后，最好在太阳下面来晒一下身上的暗黑气息，让自己恢复人的生气   &nb
  • java 二维数组如何存入数据库 cuiyadll java
    using System; using System.Linq; using System.Text; using System.Windows.Forms; using System.Xml; using System.Xml.Serialization; using System.IO; namespace WindowsFormsApplication1 {
  • 本地事务和全局事务Local Transaction and Global Transaction(JTA) darrenzhu javaspringlocalglobaltransaction
    Configuring Spring and JTA without full Java EE http://spring.io/blog/2011/08/15/configuring-spring-and-jta-without-full-java-ee/ Spring doc -Transaction Management http://docs.spring.io/spri
  • Linux命令之alias - 设置命令的别名，让 Linux 命令更简练 dcj3sjt126com linuxalias
    用途说明 设置命令的别名。在linux系统中如果命令太长又不符合用户的习惯，那么我们可以为它指定一个别名。虽然可以为命令建立“链接”解决长文件名的问 题，但对于带命令行参数的命令，链接就无能为力了。而指定别名则可以解决此类所有问题【1】。常用别名来简化ssh登录【见示例三】，使长命令变短，使常 用的长命令行变短，强制执行命令时询问等。   常用参数 格式：alias 格式：ali
  • yii2 restful web服务[格式响应] dcj3sjt126com PHPyii2
    响应格式 当处理一个 RESTful API 请求时， 一个应用程序通常需要如下步骤 来处理响应格式： 确定可能影响响应格式的各种因素， 例如媒介类型， 语言， 版本， 等等。 这个过程也被称为 content negotiation。 资源对象转换为数组， 如在 Resources 部分中所描述的。 通过 [[yii\rest\Serializer]]
  • MongoDB索引调优（2）——[十] eksliang mongodbMongoDB索引优化
    转载请出自出处：http://eksliang.iteye.com/blog/2178555 一、概述       上一篇文档中也说明了，MongoDB的索引几乎与关系型数据库的索引一模一样，优化关系型数据库的技巧通用适合MongoDB，所有这里只讲MongoDB需要注意的地方 二、索引内嵌文档     可以在嵌套文档的键上建立索引，方式与正常
  • 当滑动到顶部和底部时，实现Item的分离效果的ListView gundumw100 android
    拉动ListView，Item之间的间距会变大，释放后恢复原样； package cn.tangdada.tangbang.widget; import android.annotation.TargetApi; import android.content.Context; import android.content.res.TypedArray; import andr
  • 程序员用HTML5制作的爱心树表白动画 ini JavaScriptjqueryWebhtml5css
    体验效果：http://keleyi.com/keleyi/phtml/html5/31.htmHTML代码如下： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"><head><meta charset="UTF-8" > <ti
  • 预装windows 8 系统GPT模式的ThinkPad T440改装64位 windows 7旗舰版 kakajw ThinkPad预装改装windows 7windows 8
      该教程具有普遍参考性，特别适用于联想的机器，其他品牌机器的处理过程也大同小异。 该教程是个人多次尝试和总结的结果，实用性强，推荐给需要的人！   缘由 小弟最近入手笔记本ThinkPad T440，但是特别不能习惯笔记本出厂预装的Windows 8系统，而且厂商自作聪明地预装了一堆没用的应用软件，消耗不少的系统资源（本本的内存为4G，系统启动完成时，物理内存占用比
  • Nginx学习笔记 mcj8089 nginx
    一、安装nginx             1、在nginx官方网站下载一个包，下载地址是：  http://nginx.org/download/nginx-1.4.2.tar.gz      2、WinSCP(ftp上传工
  • mongodb 聚合查询每天论坛链接点击次数 qiaolevip 每天进步一点点学习永无止境mongodb纵观千象
    /* 18 */ { "_id" : ObjectId("5596414cbe4d73a327e50274"), "msgType" : "text", "sendTime" : ISODate("2015-07-03T08:01:16.000Z"
  • java术语（PO/POJO/VO/BO/DAO/DTO） Luob. DAOPOJODTOpoVO BO
    PO(persistant object) 持久对象 在o/r 映射的时候出现的概念,如果没有o/r映射,就没有这个概念存在了.通常对应数据模型(数据库),本身还有部分业务逻辑的处理.可以看成是与数据库中的表相映射的java对象.最简单的PO就是对应数据库中某个表中的一条记录,多个记录可以用PO的集合.PO中应该不包含任何对数据库的操作. VO(value object) 值对象 通
  • 算法复杂度 Wuaner Algorithm
    Time Complexity & Big-O： http://stackoverflow.com/questions/487258/plain-english-explanation-of-big-o http://bigocheatsheet.com/ http://www.sitepoint.com/time-complexity-algorithms/
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他