BFC引发的关于position的思考】的更多相关文章

BFC布局规则: 内部的Box会在垂直方向,一个接一个地放置. Box垂直方向的距离由margin决定.属于同一个BFC的两个相邻Box的margin会发生重叠 每个元素的margin box的左边, 与包含块border box的左边相接触(对于从左往右的格式化,否则相反).即使存在浮动也是如此. BFC的区域不会与float box重叠. BFC就是页面上的一个隔离的独立容器,容器里面的子元素不会影响到外面的元素.反之也如此. 计算BFC的高度时,浮动元素也参与计算 其中第4条:BFC的区域…
由异常:Repeated column in mapping for entity/should be mapped with insert="false" update="false 引发对jpa关联的思考 首先说一下以上问题的解决方法 //主键列 显示指定只读 --这块是解决该文的代码@Column(name = "xxx", insertable = false, updatable = false) @OneToMany(fetch = Fetch…
关键代码拆解成如下图所示(无关部分已省略): 起初我认为可能是这个 getRowDataItemNumberFormat 函数里面某些方法执行太慢,从 formatData.replace 到 unescape(已废弃,官方建议使用 decodeURI 或者 decodeURIComponent 替代) 方法都怀疑了一遍,发现这些方法都不是该函数运行慢的原因.为了深究原因,我给 style.formatData 传入了不同的值,发现这个函数的运行效率出现不同的表现.开始有点疑惑为什么 style…
软件工程课程的一个题目:写一个程序,分析一个文本文件中各个词出现的频率,并且把频率最高的10个词打印出来.文本文件大约是30KB~300KB大小. 首先说一下这边的具体的实现都是在linux上实现的.没有大型IDE的性能检测.其实30KB还不是瞬间的事情,基于语言和一些简单的策略.所以在后面可能会尝试考虑增加文件大小到G级,然后发生的东西.我只能是从简单的原理研究.至于调试我只能写个简单的shell来自己检测一下.嗯,就这样吧.能力还是有点小白,特别是看了v_JULY_v 的海量数据处理http…
小强最近在项目中遇到了一个很奇怪的问题:在整改日志规范时,为了避免影响现有的代码结构以及改动尽可能小的前提下,在调用记日志的SDK处将某一个字段值首字母改为大写,代码示例如下: fmt.Println("--------SayHello begin------------") //项目中这里的a实际是作为参数传入,只是可能为空串,不为空串,这样写肯定没问题 a := "" b := strings.ToUpper(a[:1]) + a[1:] fmt.Println…
一场机器迁移引起的思考 最近团队一台机器老化了,准备做全量迁移,一不小心,就把100多个G的/data目录放到了新机器的/data/data目录下,上愁了,怎么削减一层data目录呢?难倒像Windows一样剪切过来吗?可是有100多个G啊?!抱着试试的心态,运行mv命令,没想到系统瞬间就完成了.为什么Linux可以这么快速剪切呢?这一切都要从Linux对文件的管理机制说起的. inode是什么 要想理解inode,就要从Linux的文件存储开始说起. 文件存储在硬盘上,硬盘上最小的存储单位叫做…
学习了孟老师的这几节课程,我学习了如何搭建一个简单的命令行menu小程序,从最简单的程序开始,一步步的根据软件工程的一般规律,进行逐步开发.完善,最终实现了一个比较通用的menu程序,可以让别的开发者进行作为内嵌子程序调用执行.经过这段时间的学习,收益匪浅,于是将一些学到的东西总结如下. 为了menu小程序的开发,首先需要配置VSCOde 的C++环境,因为VScode不带C++的编译器. 1 编译和环境配置 首先从官网下载MinGW-w64,下载Install安装程序,安装过程十分简单,一路n…
看到一道面试题,["1", "2", "3"].map(parseInt) 答案是多少? 心生好奇,做做看,发现卡住,没什么头绪.首先对parseInt不了解,只好百度,看了MDN的解释一度以为parseInt(string, radix)是在[radix]进制下,string转换成数字是多少.于是简单地进行一个测试,parseInt(3,2),应该很简单吧,然鹅返回了个NaN,what?百度知道给了我答案,parseInt(string, ra…
公司的新项目决定使用Vue.js来做,当我打印出Vue实例下的data对象里的属性时,发现了一个有趣的事情: 它的每个属性都有两个相对应的get和set方法,我觉的这是多此一举的,于是去网上查了查Vue双向绑定的实现原理,才发现它和Angular.js双向绑定的实现原理完全不同,Angular是用的数据脏检测,当Model发生变化,会检测所有视图是否绑定了相关数据,再更改视图.而Vue使用的发布订阅模式,是点对点的绑定数据. Vue的数据绑定只有两个步骤,compile=>link. 我一直在想…
起因 周五改一个checkbox的display属性被错误地设置为none的bug. 经debug发现, 有两个地方修改了display属性: 1) checkbox的controller; 2) checkbox的parent(container). 前者先将display属性更新为block(正确), 后者再次更新为none(错误). 普通的思路是, 修改checkbox的container的代码, 使其能正确更新display值. 但另有一种更巧妙的方法, 就是修改checkbox的con…
字符集.字符序的概念与联系 在数据的存储上,MySQL提供了不同的字符集支持.而在数据的对比操作上,则提供了不同的字符序支持. MySQL提供了不同级别的设置,包括server级.database级.table级.column级,可以提供非常精准的设置. 什么是字符集.字符序?简单的来说: 字符集(character set):定义了字符以及字符的编码. 字符序(collation):定义了字符的比较规则. 举个例子: 有四个字符:A.B.a.b,这四个字符的编码分别是A = 0, B = 1,…
https://mp.weixin.qq.com/s/1VP7l9iuId_ViP1Z_vCA-w 某天早上,毛老师在群里问「cat 上怎么看 gc」. 好好的一个群 看到有 GC 的问题,立马做出小鸡搓手状. 之后毛老师发来一张图. 老年代内存占用情况 图片展示了老年代内存占用情况. 第一个大陡坡是应用发布,老年代内存占比下降,很正常. 第二个小陡坡,老年代内存占用突然下降,应该是发生了老年代 GC. 但奇怪的是,此时老年代内存占用并不高,发生 GC 并不是正常现象. 于是,毛老师查看了 GC…
什么是BFC BFC(Block formatting context)的中文翻译我们一般叫做块级格式化上下文.它是一个独立渲染的区域,规定了内部如何布局,同时不受外界的影响.我们的根元素本身就是一个BFC BFC的特性 BFC的特性有很多,但是这里主要说到四点,也是我们常用的. BFC内部的margin会发生折叠,即是我们常说的margin collasping. BFC内部的浮动元素也参与高度计算,我们常利用此点解决高度塌陷的问题. BFC的区域不会与float box重叠,我们可以利用这点…
W3C官方对于BFC的描述只有3小段,强烈建议想理解BFC的朋友先去看看,链接见文末. 常见的文档流分为:定位流.浮动流.普通流3种.BFC是普通流中的一种. 本文提出3个问题并给出使用BFC来解决这些问题的方法,这3个问题是: 外边距折叠(Collapsing Margins) 让一个没有设置高度的容器包含浮动元素 阻止文字环绕 什么是BFC 根据W3C对BFC的描述,可以总结出:BFC是一个具有特殊CSS样式的HTML盒子,比如div 标签就经常用来当盒子用. 这些特殊样式如下,下面的样式只…
0x00 前言 早些时候在gayhub翻安全大会的paper,翻到了kcon的一些paper. https://github.com/knownsec/KCon 从前辈们的paper中学到了不少,也产生了不少疑问. 这篇文章是对kcon 2015年清华大学网络安全实验室走马前辈的<cookie之困>(https://github.com/knownsec/KCon/blob/master/2015/Cookie%20%E4%B9%8B%E5%9B%B0.pdf)所引发的一些总结和思考. 走马前…
W3C官方对于BFC的描述只有3小段,强烈建议想理解BFC的朋友先去看看,链接见文末. 常见的文档流分为:定位流.浮动流.普通流3种.BFC是普通流中的一种. 本文提出3个问题并给出使用BFC来解决这些问题的方法,这3个问题是: 外边距折叠(Collapsing Margins) 让一个没有设置高度的容器包含浮动元素 阻止文字环绕 什么是BFC 根据W3C对BFC的描述,可以总结出:BFC是一个具有特殊CSS样式的HTML盒子,比如div 标签就经常用来当盒子用. 这些特殊样式如下,下面的样式只…
BFC(边距重叠解决方案) 1.BFC的基本概念:块级格式化上下文 2.BFC的原理(说白了就是BFC的渲染规则): 这个规则是什么呢?我觉得大家能说出4点就够了 第一个就是BFC可以解决这个元素的垂直的边距发生重叠的情况 第二个是BFC的区域不会与浮动元素的box重叠,这个肯定是用来清除浮动的. 第三个是BFC在页面上是一个独立的容器,外面的元素不会影响它里面的元素,反过来,里面的元素也不会影响到外面的元素. 第四个就是计算BFC高度的时候,浮动元素也会参与计算,现在比较抽象,等会通过代码演示…
我们在很多地方都见过BFC这个词,或许能够知道大概意思,但是有时候它的具体原理以及作用会记得很模糊,下面就对BFC这个概念深入学习下. 块级格式化上下文(Block Formatting Context,BFC)是Web页面的可视化CSS渲染部分,它是块级元素布局出现的区域,也是浮动层元素进行交互的区域,该区域是独立存在的,即BFC内部元素与外部元素之间不会相互影响. BFC能够解决的问题 解决浮动定位 解决外边距合并 清除浮动 自适应多栏布局 ...... BFC的创建方式 html元素或者包…
前言 过去一直听说旧版本IE下很多诡异bug均由一个神秘角色引起的,那就是hasLayout.趁着最近突然发神经打算好好学习CSS,顺便解答多年来的疑惑. hasLayout到底是何方神圣? hasLayout可以简单看作是IE5.5/6/7中的BFC(Block Formatting Context).也就是一个元素要么自己对自身内容进行组织和尺寸计算(即可通过width/height来设置自身的宽高),要么由其containing block来组织和尺寸计算.而IFC(即没有拥有布局)而言,…
最近一直在关注阿里的一个开源项目:OpenMessaging OpenMessaging, which includes the establishment of industry guidelines and messaging, streaming specifications to provide a common framework for finance, e-commerce, IoT and big-data area. The design principles are the…
Cocos2dx中CCNode经常作为一个父容器,里面装一些UI控件,最后组成一个复杂的自定义的UI控件,但是在使用别人的自定义控件和自己写自定义问题的时候会踩一些坑. 首先拿到一个自定义的UI控件一定要明确他的position是在控件的什么位置,即锚点位置,这样才能知道改如何取设置position. 其次知道父容器区域是不是全包含子容器的,因为ccnode里面的子节点的范围是可以超出你设定的ccnode的区域的.原因在于ccnode可以没有区域,这个跟winform桌面编程的Panel有差别,…
Vue项目经验 setInterval路由跳转继续运行并没有及时进行销毁比如一些弹幕,走马灯文字,这类需要定时调用的,路由跳转之后,因为组件已经销毁了,但是setInterval还没有销毁,还在继续后台调用,控制台会不断报错,如果运算量大的话,无法及时清除,会导致严重的页面卡顿.解决方案:在组件生命周期beforeDestroy停止setIntervalbeforeDestory() {clearInterval(this.timer);MessageBox.close() } 使用vue过程中…
文章开头先给大家出一道面试题: 在设计某小型项目的数据库(假设用的是 MySQL)时,如果给用户表(User)添加一个字段(Roles)用来存储用户的角色,你会给这个字段设置什么类型?提示:要考虑到角色在后端开发时需要用枚举表示,且一个用户可能会拥有多个角色. 映入你脑海的第一个答案可能是:varchar 类型,用分隔符的方式来存储多个角色,比如用 1|2|3 或 1,2,3 来表示用户拥有多个角色.当然如果角色数量可能超过个位数,考虑到数据库的查询方便(比如用 INSTR 或 POSITION…
继续上一篇<开发 ASP.NET vNext 初步总结(使用Visual Studio 2014 CTP1)>之后, 关于云优化和版本控制: 我本想做一下MAC和LINUX的self-host测试,但是官方说运行环境的MONO版本至少需要3.4.1,我去年买了个表,至本文发布为止,你让我下地狱去找3.4.1吗,硬着头皮用3.4.0搞了一晚上,MAC一直停留在 httpapi.dll出错,Ubuntu Server 12.0.4 是不认其中的几个DLL包,具体哪几个也忘了,过段时间有了稳定版本再…
本文非技术文 十点半游戏的代码大概完成了1/3,想到今晚提早验收完汇编实验,还是副院长亲自验的,似乎很看好我的样子,然后问我的方向,导师和参加的项目.聊了几句后结束了对话,不禁又引发了我的一些思考. 关于方向我当初选择了软件方向.我自知自己对硬件的兴趣较小,当初选方向很快划掉了嵌入式方向:可能我更对网络方向感兴趣,但是这个方向并不可选,pass:数字媒体和软件的抉择也没多做考虑,果断选了软件,比起花花绿绿的东西我更喜欢朴素的吧,尽管底层都是朴素繁琐的东西. 然后是方向导师.惭愧.当初满腔热血选了…
参考这篇文章, 将外边距的 折叠 参考这篇文章, 将bfc的生成, bfc的应用 参考这篇文章 position: absolute的元素, 仍然具有内填充padding和border边框属性样式, 但没有 外边距margin属性? 这个说法是错误的! 实际操作表明, 所有的style样式属性都是具有的! 该属性设置一个定位元素沿 z 轴的位置,z 轴定义为垂直延伸到显示区的轴.如果为正数,则离用户更近,为负数则表示离用户更远. z-index 与 position属性的关系? 关于stacki…
原文网址:http://www.blogjava.net/sound/archive/2008/08/21/40499.html 现在的计算机图书发展的可真快,很久没去书店,昨日去了一下,真是感叹万千,很多陌生的出版社,很多陌生的作者,很多陌生的译者,书名也是越来越夸张,什么××天精通××,精通××编程, ××宝典等等,书的印刷质量真的很好,纸张的质量也是今非昔比啊,但书的内容好象却是越来越让人失望,也许是我老了,我的思想我的观念已脱离现实社会,也许是外面的世界变化得太快,我编程数月,出去一走,…
云优化的概念.Entity Framework 7.0.简单吞吐量压力测试 继续上一篇<开发 ASP.NET vNext 初步总结(使用Visual Studio 2014 CTP1)>之后, 关于云优化和版本控制: 我本想做一下MAC和LINUX的self-host测试,但是官方说运行环境的MONO版本至少需要3.4.1,我去年买了个表,至本文发布为止,你让我下地狱去找3.4.1吗,硬着头皮用3.4.0搞了一晚上,MAC一直停留在 httpapi.dll出错,Ubuntu Server 12…
最近开始学习js,在看到书上的一个例子时,引发了我的一系列思考: 书上例子: function Person(name,age,job){ var o =new Object(); o.name=name; o.age=age; o.job=job; o.sayName=function(){ alert(this.name); }; return  o; } var friend=new Person("Nicholas",29,"Software Engineer&quo…
最近在阅读<你不知道的JavaScript中卷>,当我看到第二部分介绍异步和回调函数的一些知识时,由于该书在第二部分1.2章对线程.事件循环的概念介绍的并非详细,因此引发了我的一系列思考.于是写下这篇小文章,记录自己对该知识点的学习和思考. 什么是线程 由于JavaScript是单线程语言,因此,在一个进程上,只能运行一个线程,而不能多个线程同时运行.也就是说JavaScript不允许多个线程共享内存空间.因此,如果有多个线程想同时运行,则需采取排队的方式,即只有当前一个线程执行完毕,后一个线…