Float

浮动相关问题

浮动相关问题：使得父元素包含子元素，常见的方式是为父元素设置overflow:hidden或浮动父元素。根本原因在于创建BFC的元素，子浮动元素也会参与其高度计算，即不会产生高度塌陷问题。实际上只要让父元素生成BFC即可，并不只有这两种方式。复制代码<!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> <title></title> <style> html, body { height: 100%; width: 100%; margin: 0; padding: 0; }#map{ padding:0;}.first{ margin:20px; background:lightgreen; border: 2px solid lightgreen; /*display:inline-block;*/ /*overflow:hidden;*/ /*float: left;*/ /*position: absolute;*/}ul{ overflow:hidden; margin:10px; background:lightblue; width:100px; height:200px; float: left;}li{ margin:25px;}</style> </head> <body class="claro"> <div class="first"> ...

Css清除浮动的方法总结

网页布局中经常会用到float浮动，但是浮动的块级元素脱离了标准文档流，使得浮动元素的父元素没有高度，导致父级元素没有高度，所以需要清除浮动对父级元素的影响，本文介绍清除浮动的几种方法。清除浮动影响的几种方法: 给父级元素设置高度效果图：代码： <style> * { padding: 0; margin: 0; } .header { height: 30px; line-height: 30px; background-color: #333; } .header a { color: #fff; text-decoration: none; } ul { float: right; } li { float: left; list-style: none; padding-right: 20px; }</style><div class="header"> <ul> <li><a href="#">首页</a></li> <li><a href="#">文章</a></li> <li><a href="#">问答</a></li> <li><a href="#">帮助</a></li> <li><a href="#">关于</a></li> </ul></div>外墙法：使用一个空白块级元素上添加css样式clear清除浮动注意：添加了clear样式的块级元素添加不了margin外边距属性效果图：代码： <style> * { padding: 0; margin: 0; } .header { /* background-color: #333; */ } .header a { /* color: #fff; */ text-decoration: none; } ul { float: right; } li { float: left; list-style: none; padding: 5px 20px; } .clearfix { height: 10px; background-color: red; clear: both; } .main { color: #fff; height: 100px; background-color: blue; }</style><div class="header"> <ul> <li><a href="#">首页</a></li> <li><a href="#">文章</a></li> <li><a href="#">问答</a></li> <li><a href="#">帮助</a></li> <li><a href="#">关于</a></li> </ul> </div><div class="clearfix"></div> <div class="main">主要内容</div>内墙法：使用一个空白块级元素上添加css样式clear清除浮动效果图： ...

利用clear清除浮动的一些问题

下面这段代码是用来清除浮动带来的高度塌陷问题 .clearfix:before { content: "."; display: block; height: 0; clear: both; visibility: hidden;} Question 1: 上面的代码的能够实现清除浮动的问题吗？ Answer： Can’t. 因为clear属性只能控制元素本身与前面的浮动元素的关系。在本例中，使用:before伪元素明显位于所有子元素之前，故而clear属性不会因后面的浮动元素产生任何作用效果。 clear属性的官方定义可以查看CSS文档。那么应该如何修改呢？将:before换成:after即可。最终代码如下： .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;} Question 2: content属性的内容能改成空吗content: '';？ Answer： Yes. 因为设置了 height:0; 和 visibility: hidden。如果设置了content:'';，那么 height:0; 和 visibility: hidden和可以去掉吗？当然可以，因为块元素没有内容就不会有高度咯。 ...

论证PHP是世界上最好的语言（其实是浮点数问题

众所周知，计算机内的浮点存储并不是精确的，本文的目的是为了警醒各位，在业务中，遇到浮点计算，一定要慎重，尽可能的使用整形来规避。这次我们使用 1.38 * 10000这个式子来测试各个语言对于浮点数的处理。NodeJspython2python3GolangC++JavaPHP是世界上最好的语言对于金额计算，最好是使用整形来规避，比如系统内的精度设置为小数点后两位，用户的余额 1.38 存到数据库内，可以存成138，这样计算可以避免这个问题。但是整形也不是万能的，也有最大值，如果精度过大或者金额过大，整形也是撑不住的。

MySQL float猜想

问题描述使用JPA映射一个float类型到数据库：然后存储129364.57，发现存储的结果是129365。从上周就开始研究这个问题，查阅了各种资料，网上许多人都说是因为MySQL默认是保留六位有效数字，自己测试了一下也确实是这样。但是查询MYSQL官方文档，并没有找到依据。MySQL官方文档：Float - MySQL如果你看到了这篇文章，欢迎评论发表意见，让我们互相学习、进步。结论写的非常好的一篇文章，MySQL存储的各种尝试：MySQL数字类型int与tinyint、float与decimal如何选择用JPA映射的Float默认的长度与小数点都是0。这是测试的结果：float默认能精确到6位有效数字！原理猜想这是MySQL官方文档对float和double的描述：官方文档并没有说MySQL是如何存储浮点数的，所以如果没有去读过其源代码，所有的博客都只是猜想。IEEE 754目前大多数人认为MySQL内部是采用IEEE 754进行存储的，IEEE 754 - 维基百科。IEEE二进制浮点数算术标准（IEEE 754）是20世纪80年代以来最广泛使用的浮点数运算标准，为许多CPU与浮点运算器所采用。以32位的单精度浮点数为例：与日常所说的科学计数法类似。因为底数是有效数字，所以第一位肯定是1，所以这个1不进行存储，所以虽然是23位的底数，但是实际的底数位数其实是24位，含有一个隐含的1。双精度与此类似，一个符号位，指数位为11，尾数为52位，合计64位。假设假设是用MySQL是用IEEE 754标准存储的浮点数。用单精度存储129364.57，其二进制为11111100101010100.1001000111101011100001010001111011。正数：符号位为0。指数位为：00010000(十进制中的16)。去掉第一个1，保留23位，底数为：11111001010101001001000。所以最后的结果是11111100101010100.1001000，转换为十进制为：129364.5625。但是实际的MySQL存储后的结果为129365，所以猜想要么MySQL就是不是按IEEE 754存储的，要么就是按这个存储的但是内部为了数据库的性能等或其他的优化对数据进行了处理。这里我这里更倾向于第二种，毕竟IEEE 754是一种国际标准，没有理由不遵守。