shunzizhan
shunzizhan

css几种垂直居中

不论是实际项目中，还是面试，经常被面试官问到，css垂直居中有那些方法？今天特意整理一下，亲测有效

css几种垂直居中_第1张图片

通过verticle-align:middle实现CSS垂直居中

通过vertical-align:middle实现CSS垂直居中是最常使用的方法，但是有一点需要格外注意，vertical生效的前提是元素的display：inline-block。

  .S1{
      background-color:#efefef;
      height: 800px;
      line-height: 800px;
      text-align: center;
  }
  .S2{
      display: inline-block;
      width: 50px;
      height: 50px;
      vertical-align: middle;
      background-color: #f00;
  }

通过display:flex实现CSS垂直居中

随着越来越多浏览器兼容CSS中的flexbox特性，所以现在通过“display:flex”实现CSS水平居中的方案也越来越受青睐。
通过display:flex实现CSS垂直居中的方法是给父元素display:flex;而子元素align-self:center;
这个跟CSS水平居中的原理是一样的，只是在flex-direction上有所差别，一个是row(默认值)，另外一个是column。

 .S1{
      background-color:#efefef;
      height: 800px;
      display: flex;
  }
  .S2{
    width: 50px;
    height: 50px;
    background-color: #f00;
    margin: auto;
    align-self: center;
  }

通过display:table-cell实现CSS垂直居中

给父元素display：table-cell，子元素display：inline-table的方式实现CSS垂直居中。

  .S1{
      background-color:#efefef;
      height: 800px;
      display: table-cell;
      vertical-align: middle;
      text-align: center;
      width: 600px;
  }
  .S2{
    width: 50px;
    height: 50px;
    background-color: #f00;
    display: inline-block;
  }

通过隐藏节点实现CSS垂直居中

创建一个隐藏节点#hide，使得隐藏节点的height值为剩余高度的一半即可。这种方法也适用于CSS水平居中，原理一样。

已知父元素高度通过transform实现CSS垂直居中

给子元素的position:relative，再通过translateY即可定位到垂直居中的位置

  .S1{
      background-color:#efefef;
      height: 800px;
  }
  .S2{
    width: 50px;
    height: 50px;
    background-color: #f00;
    position: relative;
    top:50%;
    margin: auto;
    transform: translateY(-50%);
     
  }

未知父元素高度通过transform实现CSS垂直居中。

先给父元素position:relative，再给子元素position:absolute，通过translateY即可定位到垂直居中的位置。

 .S1{
      background-color:#efefef;
      height: 800px;
      position: relative;

  }
  .S2{
    width: 50px;
    height: 50px;
    background-color: #f00;

    top:50%;
    margin: auto;
    transform: translateY(-50%); */
    position: absolute;
    top:50%;
    left: 50%;
    transform: translate(-50%,-50%);
  }

通过line-height实现CSS垂直居中

设置子元素的line-height值等于父元素的height，这种方法适用于子元素为单行文本的情况。

 
<html>
<head>
<style>
  .S1{
      background-color:#efefef;
      height: 800px;

      /* verticle-align:middle */
      /* line-height: 800px;
      text-align: center; */

      /* display:flex */
      /* display: flex; */

      /* display:table-cell */
      /* display: table-cell;
      vertical-align: middle;
      text-align: center;
      width: 600px; */

      position: relative;

  }
  .S2{
    width: 50px;
    height: 50px;
    background-color: #f00;

    /* verticle-align:middle */
    /* display: inline-block;
    vertical-align: middle; */

    /* display:flex */
    /* margin: auto;
    align-self: center; */

    /* display:table-cell */
    /* display: inline-block; */

    /* transform */
    /* position: relative;
    top:50%;
    margin: auto;
    transform: translateY(-50%); */
    position: absolute;
    top:50%;
    left: 50%;
    transform: translate(-50%,-50%);
     
  }
  
style>
head>

<body>
  <div class="S1">
    
    <div class="S2">div>
    
    
  div>
body>
html>

你可能感兴趣的:(web前端技术,学习笔记,css)

  • Python3小白基础入门 | 学习笔记 查理养殖场 编程语言笔记学习笔记python
    一、输入输出1、读入字符串str=input()print(str)2、读入整数数字a=int(input())print(a)print(type(a))#type()输出变量类型3、格式化输出+直接拼接：name="Lihua"age=24print("Hello"+name+",youare"+str(age)+"yearsold")%：name="Lihua"age=24print("He
  • 学习笔记08——ConcurrentHashMap实现原理及源码解析 码代码的小仙女 高级开发必备技能哈希算法算法
    1.概述为什么需要ConcurrentHashMap？解决HashMap线程不安全问题：多线程put可能导致死循环（JDK7）、数据覆盖（JDK8）优化HashTable性能：通过细粒度锁替代全局锁，提高并发度对比表特性HashMapHashTableConcurrentHashMap线程安全否是是锁粒度无锁全局锁分段锁/CAS+synchronized并发性能高极低高Null键/值允许不允许不允
  • 前端面试100问！！ 一只松 javascriptes6
    面试造火箭，工作拧螺丝！在技术圈毕竟只有百分之一的人能进入BAT，百分之九九的小伙伴只能在普通公司做这普通的事情，厌烦哪些标题党，我们抛开那些高大上的台词，回归到面试的本质。本课程帮助小伙伴们快速梳理知识，不会涉及到具体的很细节的知识点，关注面试本身。公司一般会从以下5个方面考察一个人的能力，本课程的100问是总结了最近2-3年常问的面试题，适合初中级前端工程师。1、HTML(5)和CSS3方面1
  • 深入探索CSS：从基础到高级，解锁网页设计的无限可能 斯~内克 csscss前端
    CSS（层叠样式表）是现代网页设计中不可或缺的一部分，它不仅决定了网页的外观和风格，还极大地影响了用户体验和交互效果。从简单的文本样式到复杂的布局设计，CSS的灵活性和强大功能使其成为前端开发的核心技术之一。本文将从CSS的基础概念出发，逐步深入到高级应用，带你全面了解CSS的魅力和实用性。一、CSS简介：网页设计的基石CSS是一种用于描述HTML或XML文档外观和格式的样式表语言。它的主要作用是
  • NCCL学习笔记-拓扑和算法 MatsumotoChrikk NVIDIANCCL学习笔记算法
    集合通信数据并行：all-reduce或reduce-scatter和all-gather张量并行：all-reduce流水并行：点对点p2p序列并行：all-gather和reduce-scatter专家并行：all-to-all集合通信-MPI标准进程间通信也是消息传递最基本的消息传递包括sendreceive等等MPI系统的通信方式都是p2p可以阻塞可以非阻塞而openMPI中就有多个集合通
  • 终极指南：styled-components 深度解析与实战对比 ox0080 #北漂+滴滴出行WebVIP激励styled-comCSS
    一、CSS-in-JS革命：现代Web样式新范式1.1传统CSS的三大痛点全局污染：class命名冲突导致"样式战争"状态隔离：动态样式需要操作DOM类名架构割裂：样式文件与组件逻辑分离//传统CSS的典型问题实例//Button.css.btn{background:blue;}//全局作用域//App.css.btn{padding:10px;}//意外覆盖1.2CSS-in-JS的核心优势真
  • 前端必知必会-Vue动画Animations-Transition ‘name‘ 属性 编程岁月 前端vue.jsjavascript
    文章目录Transition'name'属性Transition‘name’属性如果您有多个组件，但您希望至少一个组件具有不同的动画，则需要为组件指定不同的名称以区分它们。我们可以使用name属性选择组件的名称，这也会更改过渡类的名称，以便我们可以为该组件设置不同的CSS动画规则。如果过渡名称属性值设置为‘swirl’，则自动可用的类现在将以‘swirl-’而不是‘v-’开头：swirl-ente
  • 数据库学习笔记一 Ziguangkkk 数据库数据库学习笔记
    数据库基础概念数据库定义：数据库（DataBase）是专门用于存储数据的仓库，可类比为数据的“存放地”。数据库分类：分为关系型数据库和非关系型数据库。关系型数据库中表与表之间存在关联关系，所有关系型数据库需遵循1999年制定的SQL标准，语法上90%相似，10%为各自“方言”；非关系型数据库中表相互独立，无统一标准，不同数据库语法各异。主流关系型数据库介绍Oracle数据库：由美国甲骨文公司开发，
  • Golang学习笔记_40——模版方法模式 LuckyLay Golang学习笔记golang学习笔记设计模式模板方法模式
    Golang学习笔记_37——外观模式Golang学习笔记_38——享元模式Golang学习笔记_39——策略模式文章目录一、核心概念1.定义2.解决的问题3.核心角色4.类图二、特点分析三、适用场景1.文件解析系统2.设备初始化流程3.OTP验证系统四、Go语言实现示例输出结果五、高级应用1.钩子方法扩展2.组合模板方法六、与其他模式对比七、总结设计要点Go语言实现建议一、核心概念1.定义模板方
  • java计算机毕业设计企业销售管理系统源代码+数据库+系统+lw文档 今晚的月亮真好看 java开发语言
    java计算机毕业设计企业销售管理系统源代码+数据库+系统+lw文档java计算机毕业设计企业销售管理系统源代码+数据库+系统+lw文档本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5.7/8.0源码地址：https://p
  • HTML---css选择器 lh_freak htmlcss前端
    CSS指层叠样式表，是一种用来为结构化文档（如HTML文档或XML应用）添加样式（字体、间距和颜色等）的计算机语言，CSS文件扩展名为.css。使用CSS我们可以大大提升网页开发的工作效率！插入样式表的方法有三种:外部样式(Externalstylesheet)内部样式(Internalstylesheet)内联样式(Inlinestyle)内联样式（行内样式）hello样式直接写入到本元素标签中
  • Vue打包（webpack）缓存 歌歌的前端学习之路 vue.jswebpack前端
    解决方法：1、修改vue.config.js文件constTimestamp=newDate().getTime();module.exports=defineConfig({configureWebpack{output:{filename:`[name].${Timestamp}.js`,chunkFilename:`[name].${Timestamp}.js`},},css:{extrac
  • HTML+CSS学习笔记 潘越越 学习笔记
    目录一、emmet语法二、常用html标签使用方法：三、常用CSS样式css样式设计具体引入方式1.关于border边框的设计2.关于text文本内容的管理3.关于盒模型的分类以及position属性：4.background属性的使用5.实现样式转变持续更新……首先，整体了解有关HTML和CSS的使用，主要是为了搭建静态页面有关HTML5所需要掌握的框架：React+Reactnativeuni
  • Recat学习 freelb 学习webpackjavascriptreactjs
    Recatv17.x项目开发框架搭建1.创建React项目2.暴露配置文件方法一方法二3.支持less4.支持scss/sass5.安装element-ui6.路由导航（常规使用）编译出错错误一错误二错误三错误四8.Serve插件（查看打包运行效果）安装typescript支持1.创建React项目为了加速npm下载速度，先把npm设置为淘宝镜像地址。npmconfigsetregistryhtt
  • Python web基础知识，后端服务器开发，观点还停留在Java上吗！ 道-闇影 pythonjavaweb开发
    极简生活，极简编程，简到极致，就是完美！在写CSDN的Python技能树体验五(web应用开发:Djiago、Tornado、Flask)—终于可以写点能看的了！之前，wc，提前剧透了！先对web开发做一个简要的说明，话不多说，往下看！web应用开发的含义web应用开发分为：前端网页开发，后端服务器开发，还有前后端的一个通信技术！各个部分需要哪些基础前端开发基础：HTML,CSS，JavaScti
  • AI大模型-提示工程学习笔记21-图提示 (Graph Prompting) 9命怪猫 AI人工智能学习大模型aiprompt
    目录1.图提示的核心思想(1)传统提示的局限性(2)GraphPrompting的解决方案2.GraphPrompting的工作流程(1)图构建(2)图选择/子图提取(3)图编码(4)提示构建(5)LLM推理与生成3.GraphPrompting的关键组件(1)大语言模型(LLM)(2)图数据库(GraphDatabase)(3)图编码器(GraphEncoder)(4)提示模板(PromptTe
  • 微信小程序 底部导航栏实现凸出内凹效果 hujie9371 微信小程序
    话不多说，首先上效果展示:在微信小程序开发中，开发者往往需要根据自定义的需求实现底部导航栏，而这种凸出与内凹的效果往往使人头疼。主要难点是背景色、圆切角的过渡、透明、阴影遮挡等问题。一般的解决方案是使用图片或者svg显示凹凸，或者利用css阴影效果遮挡切角。但在【SkylineUI组件库】小程序中的底部导航栏，我则是直接使用canvas绘制，并且使用skyline渲染框架，不仅解决了以上问题，并且
  • “伪元素”是啥 向贤 前端开发css
    “伪元素”是啥CSS伪元素（Pseudo-elements）是一种特殊的CSS选择器，允许开发者在不修改HTML结构的前提下，通过样式表操作元素的特定部分或插入虚拟内容。以下是其核心特性解析：一、本质特性‌虚拟元素‌伪元素并非真实存在于HTML文档树中，而是通过CSS生成的抽象元素‌。例如::before会在元素内容前生成一个虚拟容器，::after则在内容后生成。‌无法通过JS直接操作‌由于伪元
  • 什么是轮播图？如何实现轮播图？有几种方法？ 妮在想什么 前端html5csscss3vue.js前端框架
    轮播图（Carousel或Slider）是一种图像展示组件，用于在网页或应用中以动画效果展示多张图片或其他内容。用户可以手动控制轮播图的播放，也可以设置自动切换功能。常见的轮播图应用包括图片展示、广告、产品展示等。实现轮播图的几种方法：使用纯HTML和CSS这种方法适用于简单的轮播图，主要依靠CSS动画和过渡效果实现图像的切换。适合静态或少量内容的展示。css实现轮播图.box{/*可视区域宽须设
  • Go语言学习笔记（二） 正在绘制中 Go语言学习之路golang学习笔记
    文章目录六、数组和map数组多维数组切片直接声明新的切片使用make()函数构造切片map遍历map删除线程安全的mapnew和make七、nil八、条件判断&循环ifelseforforrangeswitchgotobreakcontinue九、函数函数的参数匿名函数闭包延迟调用十、异常六、数组和map数组数组是一个由固定长度的特定类型元素组成的序列，一个数组可以由零个或多个元素组成。因为数组的
  • Go语言学习笔记（五） 正在绘制中 Go语言学习之路golang学习笔记
    文章目录十八、go操作MySQL、RedisMySQLRedis十九、泛型泛型函数泛型类型泛型约束泛型特化泛型接口二十、workspaces核心概念示例二十一、模糊测试十八、go操作MySQL、RedisMySQLpackagemainimport("database/sql""errors""fmt"_"github.com/go-sql-driver/mysql""log""time")typ
  • GO语言学习笔记——详细版 码农之家★资源共享 golang学习笔记
    1.1.1.Go编译词法与语法分析意义:解析源代码文件,将文件中字符串序列转换成Token序列把执行词法分析的程序称为词法解析器(lexer)语法解析的结果就是抽象语法树(AST)每个AST都对应一个单独的Go语言文件,这个抽象语法树中包括当前文件属于的包名,定义的常量,结构体和函数等如果发生错误,被语法解析器发现并将消息打印在标准输出上,编译过程直接中止Go语言早期用lex做词法分析,后续还是使
  • 【学习笔记】Kubernetes 还没入门的大菜狗 笔记
    一、概览Kubernetes提供了一个抽象层，是用户可以在屋里或虚拟环境中部署容器化应用，提供以容器为中心的基础架构。Kubernetes的控制平面和工作节点都有什么组建？分别有什么作用？1.1Kubernetes控制平面和工作节点的组件及其作用控制平面组件控制平面组件负责管理集群的全局决策（如调度），以及检测和响应集群事件。kube-apiserverKubernetesAPI的前端，所有组件通
  • GO语言学习笔记(1) 大王算法 golang学习笔记
    目录一、go语言结构1.语言结构示例2.语言结构二、go基础语法1.行分隔符:2.注释：3.标识符：4.字符串连接：5.关键字：6.格式化字符串：三、变量1、申明一个变量值，变量类型，并初始化一、go语言结构1.语言结构示例packagemainimport"fmt"funcmain(){fmt.Println("HelloWorld！")}2.语言结构1).第一行代码packagemain定义了
  • 基于web在线餐饮网站的设计与实现——蛋糕甜品店铺(HTML+CSS+JavaScript) html网页制作 网页设计前端javascripthtmldreamweaver网页设计web网页设计期末课程大作业
    ‍静态网站的编写主要是用HTMLDIV+CSSJS等来完成页面的排版设计‍,常用的网页设计软件有Dreamweaver、EditPlus、HBuilderX、VScode、Webstorm、Animate等等，用的最多的还是DW，当然不同软件写出的前端Html5代码都是一致的，本网页适合修改成为各种类型的产品展示网页，比如美食、旅游、摄影、电影、音乐等等多种主题，希望对大家有所帮助。精彩专栏推荐❤
  • 侯捷C++课程学习笔记：深入探索C++内存管理机制 清水白石008 c++学习笔记
    侯捷C++课程学习笔记：深入探索C++内存管理机制引言有幸参与“学C++，赢好礼”——侯捷C++系列精品课学习笔记征文活动，我深感荣幸。侯捷老师作为C++教育界的泰斗，其课程深入浅出，实战性强，引领我们开发者真正理解C++的精髓。在学习侯捷C++系列课程的过程中，我受益匪浅，尤其是在内存管理这一核心领域，更是有了系统而深刻的认识。本文将围绕侯捷C++课程的学习内容，结合个人心得体会，深入探讨C++
  • 侯捷 C++ 课程学习笔记：C++ 2.0 新特性 宇寒风暖 c++c++学习笔记开发语言
    一、课程目标这节课的目标是帮助学员全面认识C++2.0（即C++11/14）的新特性，并通过实例获得实际体验。课程内容涵盖语言和标准库两个层面，旨在让学员深入理解C++2.0的核心特性和应用场景。二、C++标准的演化C++标准经历了多个版本的演化，每个版本都引入了新的特性和改进。以下是C++标准的主要版本：C++98(1.0)：第一个正式的C++标准，奠定了C++语言的基础。C++03(TR1,T
  • 开发基于提示工程的大语言模型（LLM）应用——学习笔记 ricky_fan 人工智能python
    本文是学习笔记。学习通过提示工程与大语言模型进行程序化的交互。将从最基本的开始，比如使用哪些模型，以及如何向它们发送提示词并查看响应。将逐步构建更复杂的提示词，并学习LangChain为我们提供的、用于与大语言模型交互的丰富工具。Langchain链核心是运行时（runnable），它们能以多种方式组合的为工作流。如何创建LangChain链 fromlangchain_nvidia_ai_end
  • CSS隐藏元素的方式 林的快手 HTML+CSScsshtml前端javascript开发语言chrome
    方式一：visibility属性visibility属性默认值是show，如果设置为hidden，元素会隐藏。元素看不见了，还占有原来的位置（元素的大小依然保持）。方式二：display属性设置display:none，就可以让元素隐藏。彻底地隐藏，不但看不见，也不占用任何位置，没有大小宽高。.隐藏元素的方式.box{width:400px;height:400px;}.box1{backgrou
  • css3实现缺角四边形_CSS3实现缺角矩形，折角矩形以及缺角边框 weixin_39953102 css3实现缺角四边形
    前言前几天偶然看到缺角矩形这个功能，脑袋中第一想法是，搞个绝对定位的伪元素，哪里需要挡哪里，或者找UI小哥聊聊天，忽然灵光一闪，想起之前翻过的《CSS揭秘》一书，记得有这个篇章，遂有了此文。话不多说，放个效果图先缺角CSS3实现缺角矩形，折角矩形以及缺角边框-1.png(10.03KB,下载次数:0)2020-7-2219:03上传1.伪元素实现.bg{width:120px;height:80p
  • 继之前的线程循环加到窗口中运行 3213213333332132 javathreadJFrameJPanel
    之前写了有关java线程的循环执行和结束，因为想制作成exe文件，想把执行的效果加到窗口上，所以就结合了JFrame和JPanel写了这个程序，这里直接贴出代码，在窗口上运行的效果下面有附图。 package thread; import java.awt.Graphics; import java.text.SimpleDateFormat; import java.util
  • linux 常用命令 BlueSkator linux命令
    1.grep 相信这个命令可以说是大家最常用的命令之一了。尤其是查询生产环境的日志，这个命令绝对是必不可少的。 但之前总是习惯于使用 （grep -n 关键字 文件名 ）查出关键字以及该关键字所在的行数，然后再用 （sed -n  '100,200p' 文件名），去查出该关键字之后的日志内容。 但其实还有更简便的办法，就是用（grep  -B n、-A n、-C n 关键
  • php heredoc原文档和nowdoc语法 dcj3sjt126com PHPheredocnowdoc
    <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>Current To-Do List</title> </head> <body> <?
  • overflow的属性 周华华 JavaScript
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&q
  • 《我所了解的Java》——总体目录 g21121 java
            准备用一年左右时间写一个系列的文章《我所了解的Java》，目录及内容会不断完善及调整。         在编写相关内容时难免出现笔误、代码无法执行、名词理解错误等，请大家及时指出，我会第一时间更正。    &n
  • [简单]docx4j常用方法小结 53873039oycg docx
            本代码基于docx4j-3.2.0，在office word 2007上测试通过。代码如下:         import java.io.File; import java.io.FileInputStream; import ja
  • Spring配置学习 云端月影 spring配置
    首先来看一个标准的Spring配置文件 applicationContext.xml <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi=&q
  • Java新手入门的30个基本概念三 aijuans java新手java 入门
    17.Java中的每一个类都是从Object类扩展而来的。　　18.object类中的equal和toString方法。　　equal用于测试一个对象是否同另一个对象相等。　　toString返回一个代表该对象的字符串,几乎每一个类都会重载该方法,以便返回当前状态的正确表示.(toString 方法是一个很重要的方法)　　 19.通用编程:任何类类型的所有值都可以同object类性的变量来代替。　
  • 《2008 IBM Rational 软件开发高峰论坛会议》小记 antonyup_2006 软件测试敏捷开发项目管理IBM活动
    我一直想写些总结,用于交流和备忘,然都没提笔,今以一篇参加活动的感受小记开个头,呵呵! 其实参加《2008 IBM Rational 软件开发高峰论坛会议》是9月4号,那天刚好调休.但接着项目颇为忙,所以今天在中秋佳节的假期里整理了下. 参加这次活动是一个朋友给的一个邀请书,才知道有这样的一个活动,虽然现在项目暂时没用到IBM的解决方案,但觉的参与这样一个活动可以拓宽下视野和相关知识.
  • PL/SQL的过程编程,异常,声明变量,PL/SQL块 百合不是茶 PL/SQL的过程编程异常PL/SQL块声明变量
    PL/SQL;    过程; 符号; 变量; PL/SQL块; 输出; 异常;     PL/SQL 是过程语言(Procedural Language)与结构化查询语言(SQL)结合而成的编程语言PL/SQL 是对 SQL 的扩展,sql的执行时每次都要写操作
  • Mockito(三)--完整功能介绍 bijian1013 持续集成mockito单元测试
            mockito官网：http://code.google.com/p/mockito/，打开documentation可以看到官方最新的文档资料。 一.使用mockito验证行为 //首先要import Mockito import static org.mockito.Mockito.*; //mo
  • 精通Oracle10编程SQL(8)使用复合数据类型 bijian1013 oracle数据库plsql
    /* *使用复合数据类型 */ --PL/SQL记录 --定义PL/SQL记录 --自定义PL/SQL记录 DECLARE TYPE emp_record_type IS RECORD( name emp.ename%TYPE, salary emp.sal%TYPE, dno emp.deptno%TYPE ); emp_
  • 【Linux常用命令一】grep命令 bit1129 Linux常用命令
    grep命令格式   grep [option] pattern [file-list]     grep命令用于在指定的文件(一个或者多个,file-list)中查找包含模式串(pattern)的行,[option]用于控制grep命令的查找方式。   pattern可以是普通字符串，也可以是正则表达式，当查找的字符串包含正则表达式字符或者特
  • mybatis3入门学习笔记 白糖_ sqlibatisqqjdbc配置管理
    MyBatis 的前身就是iBatis，是一个数据持久层(ORM)框架。  MyBatis 是支持普通 SQL 查询，存储过程和高级映射的优秀持久层框架。MyBatis对JDBC进行了一次很浅的封装。   以前也学过iBatis，因为MyBatis是iBatis的升级版本，最初以为改动应该不大，实际结果是MyBatis对配置文件进行了一些大的改动，使整个框架更加方便人性化。
  • Linux 命令神器：lsof 入门 ronin47 lsof
           lsof是系统管理/安全的尤伯工具。我大多数时候用它来从系统获得与网络连接相关的信息，但那只是这个强大而又鲜为人知的应用的第一步。将这个工具称之为lsof真实名副其实，因为它是指“列出打开文件（lists openfiles）”。而有一点要切记，在Unix中一切（包括网络套接口）都是文件。 有趣的是，lsof也是有着最多
  • java实现两个大数相加，可能存在溢出。 bylijinnan java实现
    import java.math.BigInteger; import java.util.regex.Matcher; import java.util.regex.Pattern; public class BigIntegerAddition { /** * 题目：java实现两个大数相加，可能存在溢出。 * 如123456789 + 987654321
  • Kettle学习资料分享，附大神用Kettle的一套流程完成对整个数据库迁移方法 Kai_Ge Kettle
    Kettle学习资料分享   Kettle 3.2 使用说明书 目录 概述..........................................................................................................................................7 1.Kettle 资源库管
  • [货币与金融]钢之炼金术士 comsci 金融
           自古以来,都有一些人在从事炼金术的工作.........但是很少有成功的        那么随着人类在理论物理和工程物理上面取得的一些突破性进展......        炼金术这个古老
  • Toast原来也可以多样化 dai_lm androidtoast
    Style 1： 默认 Toast def = Toast.makeText(this, "default", Toast.LENGTH_SHORT); def.show(); Style 2： 顶部显示 Toast top = Toast.makeText(this, "top", Toast.LENGTH_SHORT); t
  • java数据计算的几种解决方法3 datamachine javahadoopibatisr-languer
    4、iBatis     简单敏捷因此强大的数据计算层。和Hibernate不同，它鼓励写SQL，所以学习成本最低。同时它用最小的代价实现了计算脚本和JAVA代码的解耦，只用20%的代价就实现了hibernate 80%的功能,没实现的20%是计算脚本和数据库的解耦。     复杂计算环境是它的弱项，比如：分布式计算、复杂计算、非数据
  • 向网页中插入透明Flash的方法和技巧 dcj3sjt126com htmlWebFlash
    将 Flash 作品插入网页的时候，我们有时候会需要将它设为透明，有时候我们需要在Flash的背面插入一些漂亮的图片，搭配出漂亮的效果……下面我们介绍一些将Flash插入网页中的一些透明的设置技巧。 　　一、Swf透明、无坐标控制　　首先教大家最简单的插入Flash的代码，透明，无坐标控制： 　　注意wmode="transparent"是控制Flash是否透明
  • ios UICollectionView的使用 dcj3sjt126com
    UICollectionView的使用有两种方法，一种是继承UICollectionViewController，这个Controller会自带一个UICollectionView；另外一种是作为一个视图放在普通的UIViewController里面。 个人更喜欢第二种。下面采用第二种方式简单介绍一下UICollectionView的使用。 1.UIViewController实现委托，代码如
  • Eos平台java公共逻辑 蕃薯耀 Eos平台java公共逻辑Eos平台java公共逻辑
     Eos平台java公共逻辑 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2015年6月1日 17:20:4
  • SpringMVC4零配置--Web上下文配置【MvcConfig】 hanqunfeng springmvc4
    与SpringSecurity的配置类似，spring同样为我们提供了一个实现类WebMvcConfigurationSupport和一个注解@EnableWebMvc以帮助我们减少bean的声明。   applicationContext-MvcConfig.xml <!-- 启用注解，并定义组件查找规则 ，mvc层只负责扫描@Controller --> <
  • 解决ie和其他浏览器poi下载excel文件名乱码 jackyrong Excel
       使用poi,做传统的excel导出，然后想在浏览器中，让用户选择另存为，保存用户下载的xls文件，这个时候，可能的是在ie下出现乱码（ie,9,10,11),但在firefox,chrome下没乱码， 因此必须综合判断，编写一个工具类：      /** * * @Title: pro
  • 挥洒泪水的青春 lampcy 编程生活程序员
    2015年2月28日，我辞职了，离开了相处一年的触控，转过身--挥洒掉泪水，毅然来到了兄弟连，背负着许多的不解、质疑——”你一个零基础、脑子又不聪明的人，还敢跨行业，选择Unity3D？“，”真是不自量力••••••“，”真是初生牛犊不怕虎•••••“，••••••我只是淡淡一笑，拎着行李----坐上了通向挥洒泪水的青春之地——兄弟连！ 这就是我青春的分割线，不后悔，只会去用泪水浇灌——已经来到
  • 稳增长之中国股市两点意见-----严控做空，建立涨跌停版停牌重组机制 nannan408
       对于股市，我们国家的监管还是有点拼的，但始终拼不过飞流直下的恐慌，为什么呢？    笔者首先支持股市的监管。对于股市越管越荡的现象，笔者认为首先是做空力量超过了股市自身的升力，并且对于跌停停牌重组的快速反应还没建立好，上市公司对于股价下跌没有很好的利好支撑。    我们来看美国和香港是怎么应对股灾的。美国是靠禁止重要股票做空，在
  • 动态设置iframe高度(iframe高度自适应) Rainbow702 JavaScriptiframecontentDocument高度自适应局部刷新
    如果需要对画面中的部分区域作局部刷新，大家可能都会想到使用ajax。 但有些情况下，须使用在页面中嵌入一个iframe来作局部刷新。 对于使用iframe的情况，发现有一个问题，就是iframe中的页面的高度可能会很高，但是外面页面并不会被iframe内部页面给撑开，如下面的结构： <div id="content"> <div id=&quo
  • 用Rapael做图表 tntxia rap
    function drawReport(paper,attr,data){          var width = attr.width;     var height = attr.height;          var max = 0;   &nbs
  • HTML5 bootstrap2网页兼容（支持IE10以下） xiaoluode html5bootstrap
    <!DOCTYPE html> <html> <head lang="zh-CN"> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他