- 一串奇特的代码
hi武林高手
一个空的div元素,所有浏览器的渲染结果都不一样。body{display:table-cell;vertical-align:middle;//垂直居中}div{margin:atuo;height:100px;width:100px;outline:inset100pxgreen;//设置4个边框的样式outline-offset:-125px;//对轮廓进行偏移}html{display:t
- img垂直水平居中与div
振礼硕晨
方法一:效果1.HTML代码2.CSS代码div{width:400px;height:300px;margin:0auto;background-color:#666;display:table-cell;text-align:center;vertical-align:middle;}img{width:200px;}3.备注1.如果将给div设置display:table-cell,那么di
- display:table和display:table-cell的妙用
盼旺
实现左右布局效果如图左右上一篇下一篇.post-footer{margin-top:30px;display:table;width:100%;border-top:0.5pxdashedwheat;}.post-last{display:table-cell;}.post-next{text-align:right;display:table-cell;}实现多行文本垂直居中效果垂直居中我们只需
- 【CSS3】flex布局实践篇 | 7种常见网页布局方案
子伟-H5
html5css3
1、垂直居中垂直居中一度是前端面试时必问知识点。目前的垂直解决方案使用了从负外边距到display:table-cell等荒谬的奇技淫巧,包括全高的伪元素。这些方法是又复杂又难写。不知道大家第一次使用flex布局做什么,反正我是用来做垂直居中,使用它实在是太简单了,两行代码搞定。我居中啦!这个元素水平垂直居中了。2、stickyfooter布局业务场景:当页面内容少时,让页脚粘在底部;当内容超过一
- 知识笔记(九十八)———哪些html元素可以被css代替
瑞崽崽崽
笔记htmlcss
CSS可以代替HTML中的一些元素,这些元素通常用于布局和样式化,而不是用于表示内容。以下是一些可以用CSS代替的HTML元素:元素可以被CSS中的display:table属性代替,而表格的行和单元格可以使用display:table-row和display:table-cell属性来实现。和元素通常用于布局和包裹文本,可以使用CSS来实现相同的效果。例如,可以使用display:block将元
- 高级前端-最新
山间漫步人生路
VUEvue.jscssjavascript
css相关万能居中1.margin:0auto;水平2.text-align:center;水平3.行高,垂直4.表格,center,middle;水平垂直5.display:table-cell;模拟表格,all6.绝对定位,50%减自身宽高7.绝对定位,上下左右全0,margin:auto8.绝对定位加相对定位。不需要知道宽高9.IE6,IE7:给父元素设一个font-size:高度/1.14
- 仿九宫格布局
追逐繁星的阿忠
s1.png.parent{display:table;table-layout:fixed;width:100%;}.row{display:table-row;text-align:center}.item{display:table-cell;width:23%;height:117px;}.item>img{width:30px;height:30px;}.fodder-666{color
- 元素水平垂直居中的5种方式
诗霖雪
css前端csshtml
1、利用弹性盒子将父元素设置为display:flex;通过:justify-content:center;align-items:center;来设置元素的垂直水平居中2、将元素转化为表格的形式父元素设置:display:table-cell;vertical-align:middle;text-align:center;子元素需设置:display:inline-block;vertical-
- 10个关于css高频面试题(重点!!!)
IT届彭于晏
1.什么是BFC机制(更多资料总结+V:2417268862)BFC(BlockFormattingContext),块级格式化上下文,是一个独立的渲染区域,让处于BFC内部的元素与外部的元素相互隔离,使内外元素的定位不会相互影响。触发条件(以下任意一条)float的值不为noneoverflow的值不为visibledisplay的值为table-cell、tabble-caption和inli
- 图片填满父元素,自适应缩放
付渐渐
css前端
#max-width:100%相对于img本身的尺寸而言,最大的宽度为自身宽度#width:100%相对于父级宽度的1.等比例缩小垂直居中:按宽度等比列缩放或者可以选择按高度等比缩放.photo-box{display:table-cell;text-align:center;vertical-align:middle;overflow:hidden;width:88px;height:120px
- CSS - BFC 、 IFC 和经典布局
kelly0721
CSS
一、BFCBFC(BlockFormattingContext)块级格式化上下文。它是一个独立的渲染区域。它决定了块级元素如何对它的内容进行布局,以及与其他元素的关系和相互关系。满足下列条件之一就可触发BFC根元素float的值不为noneoverflow的值不为visible(hidden、auto、scroll)display的值为inline-block、table-cell、table-c
- 总结几种实现右边宽度固定,左边宽度自适应的css布局
老白_啊
一.display:table-cell的应用首先是简单的html:下面是css代码:以下是效果图:必须注意的是,左侧div必须设置超过父元素减去右侧元素的宽度但是这个方法会产生一个问题,它会使左边的div高度等于右侧div的高度二.flex布局同样使用上面的htmldai'ma下面是css代码效果图如下:可以看到左侧的没有设置宽度,但是却跟右侧的宽度一致,实现了宽度自适应方法三.应用float和
- 解决element ui 表格缩放后gutter: 17px导致表格错位问题
小航冲冲冲
uijavascriptcss前端vue.jscss3elementui
直接复制亲测有效.el-table{th.gutter,colgroup.gutter{width:0px!important;//此处的宽度值,对应自定义滚动条的宽度}}//关键css代码.el-table__headercolgroupcol[name="gutter"]{display:table-cell!important;}.el-table__body{width:100%!impo
- 18-BFC(块级格式化上下文)
喝酸奶要舔盖__
BFC什么是BFC?BFC(BlockFormattingContext)"块级格式化上下文"它是一个独立的与外界隔离的渲染区域,它规定了内部的盒子如何布局什么样的元素才能生产BFCdisplay属性为inline-block/block/flex/table-cell/table-caption等float属性不为noneposition属性为absolute或fixed,相对定位除外overf
- H5ke15--1--文本管理器拖进来
白天的我最菜
H5html前端
1如图1,父元素没有行高,子元素就不继承,有了就变成图22或者直接写表格自动垂直居中,但是table太古老了,没人用这个,如图33我们父元素display:table;展示位表格,子元素display:table-cell;vertical-align:middle;设置为表格细胞,再垂直居中,4#container>p:nth-child(1是从1开始的,测试每一个段落在上中下,如图55我们来进
- element ui中table动态列切换时,样式错位问题
一个敲代码不秃头的俗人
vue.jselementui前端
在动态新增、删除el-table-column列时,会出现表格样式错位的问题。1、v-show绑定无效果的原因:v-show起作用的本质是利用display:none控制隐藏,el-table-column的td是利用了display:table-cell控制显示,而display:table-cell的优先级又高于display:none,所以v-show失效了。2、表格排版错乱的原因:由于te
- css中元素水平居中的方式
鋜斗
前端css前端面试css状态模式前端
文章目录前言水平居中:垂直居中方法一:text-align:center+display:table-cell方法二:父元素静态定位子元素通过相对定位来实现方法三:通过静态和相对定位方法四css图片居中用text-align:center无效怎么回事?如何让图片在DIV中水平和垂直两个方向都居中?利用text-align属性将图片水平居中,然后设置padding-top的值使其垂直居中。只用pad
- 前端面试题全面整理
QY_NO.1
本篇文章整理总结了一些前端面试题,涵盖面很广,并且面的都是知名大厂,所以这些题还是很有代表性的,都掌握以后一面基础面应该没什么问题,二面也能应付大半,奉上:css相关1.万能居中1.margin:0auto;水平2.text-align:center;水平3.行高,垂直4.表格,center,middle;水平垂直5.display:table-cell;模拟表格,all6.绝对定位,50%减自身
- 关于element-ui中el-table组件纵向滚动条上面出现空白,无法遮盖下方内容问题详解
whisperw
uivue.jselementui
1.问题上图如图所示,纵向滚动条上面有部分空白2.解决方案:.el-tableth.gutter{display:table-cell!important;height:32px;background:rgba(240,240,240,1);border-bottom:1pxsolid#bbb!important;position:absolute;right:0;top:0;}1.gutter就
- 56.elementUI表格调整列宽后表头和内容宽度不一致问题解决
heartworm_evan
Vue前端vue
在项目app.vue文件的style里添加:body.el-tableth.gutter{display:table-cell!important;}
- 分享几个初级的垂直居中方法(效果都一样,所以就不放效果图,见谅)
Slience寒江
一、垂直居中,将子元素进行绝对定位,上和左移动50%,再使用margin进行上和左移动,移动为子元素宽高的一半方可实现垂直居中。二、使用transform和定位来进行div的垂直居中布局。三、使用父元素display:table-cell;text-align:center;vertical-align:middle,子元素使用display:inline-block。效果图:四、利用inline
- 元素水平垂直居中的六种方式
俊小赞
#Csscss
文章目录前言代码预设一、绝对定位+transform二、绝对定位+margin1.不用子盒子的宽高2.需要子盒子的宽高三、table-cell属性四、flex布局五、calc()函数总结前言让元素同时实现水平垂直,是我们前端开发所经常遇到的,本文将介绍六种常见的方式,以便你的参考供用。代码预设下面将会介绍到的六种方法均是使用了这里的HTML结构和css主体样式。body{margin:0;padd
- BFC(块格式化上下文)
欧偶藕
前端
概念:BFC:块格式化上下文是Web页面的可视化CSS渲染的一部分,是布局过程中生成块级盒子的区域,也是浮动元素与其他元素的交互限定区域BFC的创建条件根元素:body元素设置浮动:float除了none以外的值元素设置绝对定位:position设置为absolute或fixeddisplay设置为inline-block、table-cell、table-caption、flex等overflo
- css 怎么设置盒子水平居中,css怎么让div盒子垂直水平居中
今天你好123
css怎么设置盒子水平居中
css怎么让div盒子垂直水平居中2018-03-04219提供4种方法1、定位盒子宽高已知,position:absolute;left:50%;top:50%;margin-left:-自身一半宽度;margin-top:-自身一半高度;2、table-cell布局父级display:table-cell;vertical-align:middle;子级margin:0auto;3、定位+tr
- CSS vertical-align 属性
lio_zero
css前端
CSSvertical-align属性控制在一行上相邻设置的元素如何对齐。img{vertical-align:middle;}注意:为了使其正常工作,我们需要沿基线设置元素。如:inline内联元素(例如,)或inline-block内联块(例如,由display属性设置)元素。vertical-align属性也适用于table-cell元素。语法elem{vertical-align:base
- CSS的vertical-align
G018_star sky♬
CSScsscss3html
CSS的属性vertical-align用来指定行内元素(inline)或表格单元格(table-cell)元素的垂直对齐方式。vertical-align属性可被用于两种环境:使行内元素盒模型与其行内元素容器垂直对齐。例如,用于垂直对齐一行文本内的图片:垂直对齐表格单元内容:注意vertical-align只对行内元素、行内块元素和表格单元格元素生效:不能用它垂直对齐块级元素。语法/*Keywo
- css属性之vertical-align
骆骆爱学习
1024程序员节
css属性之vertical-align##vertical-align用来指定行内元素(inline)或表格单元格(table-cell)以及图片的垂直对齐方式。对于块级元素,vertical-align是不起作用的。vertical-align的值可以归为以下4类:属性属性值线类如baseline、top、middle、bottom文本类如text-top、text-bottom上标下标类如s
- CSS属性vertical-align
孙大力力
CSScss前端html
vertical-align用来指定行内元素(inline)或表格单元格(table-cell)元素的垂直对齐方式。vertical-align只对行内元素、行内块元素和表格单元格元素生效/*关键字*/vertical-align:baseline;vertical-align:sub;vertical-align:super;vertical-align:text-top;vertical-al
- div内部改为横向_DIV横向布局的几种方法
weixin_39641876
div内部改为横向
1.使用display:inline;将块级元素转变为行内元素:CSS.item-test{border:1pxsolidblack;padding:7px;cursor:pointer;/*display:table-cell;*//*float:left;*/width:12px;height:214px;display:inline;}HTML缺点:虽然可以做到横向布局,但是不能设置宽度和高
- el-table 在safari显示位置错乱
kgdtl
vueelementui
网络上看到有很多解决办法1.列的宽度统一使用width或者min-width,不要交叉使用2.修改cssbody.el-tableth.gutter{display:table-cell!important;}body.el-tablecolgroup.gutter{display:table-cell!important;}table{width:100%!important;}.el-tabl
- java的(PO,VO,TO,BO,DAO,POJO)
Cb123456
VOTOBOPOJODAO
转:
http://www.cnblogs.com/yxnchinahlj/archive/2012/02/24/2366110.html
-------------------------------------------------------------------
O/R Mapping 是 Object Relational Mapping(对象关系映
- spring ioc原理(看完后大家可以自己写一个spring)
aijuans
spring
最近,买了本Spring入门书:spring In Action 。大致浏览了下感觉还不错。就是入门了点。Manning的书还是不错的,我虽然不像哪些只看Manning书的人那样专注于Manning,但怀着崇敬 的心情和激情通览了一遍。又一次接受了IOC 、DI、AOP等Spring核心概念。 先就IOC和DI谈一点我的看法。IO
- MyEclipse 2014中Customize Persperctive设置无效的解决方法
Kai_Ge
MyEclipse2014
高高兴兴下载个MyEclipse2014,发现工具条上多了个手机开发的按钮,心生不爽就想弄掉他!
结果发现Customize Persperctive失效!!
有说更新下就好了,可是国内Myeclipse访问不了,何谈更新...
so~这里提供了更新后的一下jar包,给大家使用!
1、将9个jar复制到myeclipse安装目录\plugins中
2、删除和这9个jar同包名但是版本号较
- SpringMvc上传
120153216
springMVC
@RequestMapping(value = WebUrlConstant.UPLOADFILE)
@ResponseBody
public Map<String, Object> uploadFile(HttpServletRequest request,HttpServletResponse httpresponse) {
try {
//
- Javascript----HTML DOM 事件
何必如此
JavaScripthtmlWeb
HTML DOM 事件允许Javascript在HTML文档元素中注册不同事件处理程序。
事件通常与函数结合使用,函数不会在事件发生前被执行!
注:DOM: 指明使用的 DOM 属性级别。
1.鼠标事件
属性  
- 动态绑定和删除onclick事件
357029540
JavaScriptjquery
因为对JQUERY和JS的动态绑定事件的不熟悉,今天花了好久的时间才把动态绑定和删除onclick事件搞定!现在分享下我的过程。
在我的查询页面,我将我的onclick事件绑定到了tr标签上同时传入当前行(this值)参数,这样可以在点击行上的任意地方时可以选中checkbox,但是在我的某一列上也有一个onclick事件是用于下载附件的,当
- HttpClient|HttpClient请求详解
7454103
apache应用服务器网络协议网络应用Security
HttpClient 是 Apache Jakarta Common 下的子项目,可以用来提供高效的、最新的、功能丰富的支持 HTTP 协议的客户端编程工具包,并且它支持 HTTP 协议最新的版本和建议。本文首先介绍 HTTPClient,然后根据作者实际工作经验给出了一些常见问题的解决方法。HTTP 协议可能是现在 Internet 上使用得最多、最重要的协议了,越来越多的 Java 应用程序需
- 递归 逐层统计树形结构数据
darkranger
数据结构
将集合递归获取树形结构:
/**
*
* 递归获取数据
* @param alist:所有分类
* @param subjname:对应统计的项目名称
* @param pk:对应项目主键
* @param reportList: 最后统计的结果集
* @param count:项目级别
*/
public void getReportVO(Arr
- 访问WEB-INF下使用frameset标签页面出错的原因
aijuans
struts2
<frameset rows="61,*,24" cols="*" framespacing="0" frameborder="no" border="0">
- MAVEN常用命令
avords
Maven库:
http://repo2.maven.org/maven2/
Maven依赖查询:
http://mvnrepository.com/
Maven常用命令: 1. 创建Maven的普通java项目: mvn archetype:create -DgroupId=packageName 
- PHP如果自带一个小型的web服务器就好了
houxinyou
apache应用服务器WebPHP脚本
最近单位用PHP做网站,感觉PHP挺好的,不过有一些地方不太习惯,比如,环境搭建。PHP本身就是一个网站后台脚本,但用PHP做程序时还要下载apache,配置起来也不太很方便,虽然有好多配置好的apache+php+mysq的环境,但用起来总是心里不太舒服,因为我要的只是一个开发环境,如果是真实的运行环境,下个apahe也无所谓,但只是一个开发环境,总有一种杀鸡用牛刀的感觉。如果php自己的程序中
- NoSQL数据库之Redis数据库管理(list类型)
bijian1013
redis数据库NoSQL
3.list类型及操作
List是一个链表结构,主要功能是push、pop、获取一个范围的所有值等等,操作key理解为链表的名字。Redis的list类型其实就是一个每个子元素都是string类型的双向链表。我们可以通过push、pop操作从链表的头部或者尾部添加删除元素,这样list既可以作为栈,又可以作为队列。
&nbs
- 谁在用Hadoop?
bingyingao
hadoop数据挖掘公司应用场景
Hadoop技术的应用已经十分广泛了,而我是最近才开始对它有所了解,它在大数据领域的出色表现也让我产生了兴趣。浏览了他的官网,其中有一个页面专门介绍目前世界上有哪些公司在用Hadoop,这些公司涵盖各行各业,不乏一些大公司如alibaba,ebay,amazon,google,facebook,adobe等,主要用于日志分析、数据挖掘、机器学习、构建索引、业务报表等场景,这更加激发了学习它的热情。
- 【Spark七十六】Spark计算结果存到MySQL
bit1129
mysql
package spark.examples.db
import java.sql.{PreparedStatement, Connection, DriverManager}
import com.mysql.jdbc.Driver
import org.apache.spark.{SparkContext, SparkConf}
object SparkMySQLInteg
- Scala: JVM上的函数编程
bookjovi
scalaerlanghaskell
说Scala是JVM上的函数编程一点也不为过,Scala把面向对象和函数型编程这两种主流编程范式结合了起来,对于熟悉各种编程范式的人而言Scala并没有带来太多革新的编程思想,scala主要的有点在于Java庞大的package优势,这样也就弥补了JVM平台上函数型编程的缺失,MS家.net上已经有了F#,JVM怎么能不跟上呢?
对本人而言
- jar打成exe
bro_feng
java jar exe
今天要把jar包打成exe,jsmooth和exe4j都用了。
遇见几个问题。记录一下。
两个软件都很好使,网上都有图片教程,都挺不错。
首先肯定是要用自己的jre的,不然不能通用,其次别忘了把需要的lib放到classPath中。
困扰我很久的一个问题是,我自己打包成功后,在一个同事的没有装jdk的电脑上运行,就是不行,报错jvm.dll为无效的windows映像,如截图
最后发现
- 读《研磨设计模式》-代码笔记-策略模式-Strategy
bylijinnan
java设计模式
声明: 本文只为方便我个人查阅和理解,详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/
/*
策略模式定义了一系列的算法,并将每一个算法封装起来,而且使它们还可以相互替换。策略模式让算法独立于使用它的客户而独立变化
简单理解:
1、将不同的策略提炼出一个共同接口。这是容易的,因为不同的策略,只是算法不同,需要传递的参数
- cmd命令值cvfM命令
chenyu19891124
cmd
cmd命令还真是强大啊。今天发现jar -cvfM aa.rar @aaalist 就这行命令可以根据aaalist取出相应的文件
例如:
在d:\workspace\prpall\test.java 有这样一个文件,现在想要将这个文件打成一个包。运行如下命令即可比如在d:\wor
- OpenJWeb(1.8) Java Web应用快速开发平台
comsci
java框架Web项目管理企业应用
OpenJWeb(1.8) Java Web应用快速开发平台的作者是我们技术联盟的成员,他最近推出了新版本的快速应用开发平台 OpenJWeb(1.8),我帮他做做宣传
OpenJWeb快速开发平台以快速开发为核心,整合先进的java 开源框架,本着自主开发+应用集成相结合的原则,旨在为政府、企事业单位、软件公司等平台用户提供一个架构透
- Python 报错:IndentationError: unexpected indent
daizj
pythontab空格缩进
IndentationError: unexpected indent 是缩进的问题,也有可能是tab和空格混用啦
Python开发者有意让违反了缩进规则的程序不能通过编译,以此来强制程序员养成良好的编程习惯。并且在Python语言里,缩进而非花括号或者某种关键字,被用于表示语句块的开始和退出。增加缩进表示语句块的开
- HttpClient 超时设置
dongwei_6688
httpclient
HttpClient中的超时设置包含两个部分:
1. 建立连接超时,是指在httpclient客户端和服务器端建立连接过程中允许的最大等待时间
2. 读取数据超时,是指在建立连接后,等待读取服务器端的响应数据时允许的最大等待时间
在HttpClient 4.x中如下设置:
HttpClient httpclient = new DefaultHttpC
- 小鱼与波浪
dcj3sjt126com
一条小鱼游出水面看蓝天,偶然间遇到了波浪。 小鱼便与波浪在海面上游戏,随着波浪上下起伏、汹涌前进。 小鱼在波浪里兴奋得大叫:“你每天都过着这么刺激的生活吗?简直太棒了。” 波浪说:“岂只每天过这样的生活,几乎每一刻都这么刺激!还有更刺激的,要有潮汐变化,或者狂风暴雨,那才是兴奋得心脏都会跳出来。” 小鱼说:“真希望我也能变成一个波浪,每天随着风雨、潮汐流动,不知道有多么好!” 很快,小鱼
- Error Code: 1175 You are using safe update mode and you tried to update a table
dcj3sjt126com
mysql
快速高效用:SET SQL_SAFE_UPDATES = 0;下面的就不要看了!
今日用MySQL Workbench进行数据库的管理更新时,执行一个更新的语句碰到以下错误提示:
Error Code: 1175
You are using safe update mode and you tried to update a table without a WHERE that
- 枚举类型详细介绍及方法定义
gaomysion
enumjavaee
转发
http://developer.51cto.com/art/201107/275031.htm
枚举其实就是一种类型,跟int, char 这种差不多,就是定义变量时限制输入的,你只能够赋enum里面规定的值。建议大家可以看看,这两篇文章,《java枚举类型入门》和《C++的中的结构体和枚举》,供大家参考。
枚举类型是JDK5.0的新特征。Sun引进了一个全新的关键字enum
- Merge Sorted Array
hcx2013
array
Given two sorted integer arrays nums1 and nums2, merge nums2 into nums1 as one sorted array.
Note:You may assume that nums1 has enough space (size that is
- Expression Language 3.0新特性
jinnianshilongnian
el 3.0
Expression Language 3.0表达式语言规范最终版从2013-4-29发布到现在已经非常久的时间了;目前如Tomcat 8、Jetty 9、GlasshFish 4已经支持EL 3.0。新特性包括:如字符串拼接操作符、赋值、分号操作符、对象方法调用、Lambda表达式、静态字段/方法调用、构造器调用、Java8集合操作。目前Glassfish 4/Jetty实现最好,对大多数新特性
- 超越算法来看待个性化推荐
liyonghui160com
超越算法来看待个性化推荐
一提到个性化推荐,大家一般会想到协同过滤、文本相似等推荐算法,或是更高阶的模型推荐算法,百度的张栋说过,推荐40%取决于UI、30%取决于数据、20%取决于背景知识,虽然本人不是很认同这种比例,但推荐系统中,推荐算法起的作用起的作用是非常有限的。
就像任何
- 写给Javascript初学者的小小建议
pda158
JavaScript
一般初学JavaScript的时候最头痛的就是浏览器兼容问题。在Firefox下面好好的代码放到IE就不能显示了,又或者是在IE能正常显示的代码在firefox又报错了。 如果你正初学JavaScript并有着一样的处境的话建议你:初学JavaScript的时候无视DOM和BOM的兼容性,将更多的时间花在 了解语言本身(ECMAScript)。只在特定浏览器编写代码(Chrome/Fi
- Java 枚举
ShihLei
javaenum枚举
注:文章内容大量借鉴使用网上的资料,可惜没有记录参考地址,只能再传对作者说声抱歉并表示感谢!
一 基础 1)语法
枚举类型只能有私有构造器(这样做可以保证客户代码没有办法新建一个enum的实例)
枚举实例必须最先定义
2)特性
&nb
- Java SE 6 HotSpot虚拟机的垃圾回收机制
uuhorse
javaHotSpotGC垃圾回收VM
官方资料,关于Java SE 6 HotSpot虚拟机的garbage Collection,非常全,英文。
http://www.oracle.com/technetwork/java/javase/gc-tuning-6-140523.html
Java SE 6 HotSpot[tm] Virtual Machine Garbage Collection Tuning
&