块元素在文档流中默认垂直排列，所以这个三个div自上至下依次排开，如果希望块元素在页面中水平排列，可以使块元素脱离文档流。 使用float来使元素浮动，从而脱离文档流 可选值： 当为一个元素设置浮动以后（float属性是一个非none的值），元素会立即脱离文档流，元素脱离文档流以后，它下边的元素会立 ...
分类：
Web程序 时间：
2017-05-03 22:01:17
阅读次数：
222
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> .box{ position: relative; height: 300px; width: 500px; } .s1,.s2{ ...
分类：
Web程序 时间：
2017-04-25 13:38:38
阅读次数：
228
为什么要有浮动/浮动能干什么？ 浮动最开始出现的直接原因是为了实现图片环绕文字；但是呢？在历史进程中，浮动也将脚伸到了页面布局中，成为了页面布局的一个稳定得分手。 浮动是什么？ 浮动是css中一个非常重要的属性，元素通过设置float属性值为：left、right,可以使元素向左或向右浮动，直到它的 ...
分类：
Web程序 时间：
2017-04-23 18:05:21
阅读次数：
174
本文为转载 （出处：http://www.cnblogs.com/iyangyuan/archive/2013/03/27/2983813.html） 写在前面的话： 由于CSS内容比较多，小菜没有精力从头到尾讲一遍，只能有针对性的讲解。 如果读者理解CSS盒子模型，但对于浮动不理解，那么这篇文章可 ...
分类：
Web程序 时间：
2017-04-16 17:51:17
阅读次数：
165
1. 浮动 1. 特点： 1.不占原来的位置（脱标） 2.可以让块级元素在一行上显示 3.浮动可以把行内元素转化为行内块元素 2 清除浮动 清除浮动指的是清除浮动的影响 注意： 当子元素设置了浮动，父元素没有高度的时候，造成页面布局混乱。这种情况下进行清除浮动。 3 清除浮动的几种方式 1.使用cl ...
分类：
Web程序 时间：
2017-04-15 18:13:42
阅读次数：
182
上次我们一起研究了css浮动，这次我们一起学习一下浮动对排版造成的影响，以及清除浮动影响的方式。 首先，我们来看一下浮动对合资高度的影响： 在标准流中内容的高度可以撑起盒子的高度： 示例代码： 在浮动流中浮动元素内容的高不可以撑起盒子的高度： 示例代码： 下面我们看下浮动对布局造成的影响： 浮动的盒 ...
分类：
Web程序 时间：
2017-04-04 23:31:50
阅读次数：
340
如何清楚浮动（一）已知一个大的div容器，这个容器包含了两个子div容器，然后在这两个子div容器的后面再添加一个div(这个div表示清除浮动的div容器)，清楚浮动的div容器设置css样式为clear:both，此时，大的div标签的内部(左右两边/*css5*/)浮动就清除了。如果有一个大的div容..
分类：
Web程序 时间：
2017-03-28 22:15:47
阅读次数：
223
实际开发中：我们想要看到的效果是： 然而结果是： 这个时候，我们就要清除浮动带来的影响——父元素高度塌陷了。 清除浮动的办法有： 方法一：添加新的div，clear：both; 方法二：父级div定义 overflow: auto（注意：是父级div也就是这里的 div.outer） 方法三：方法 ...
分类：
Web程序 时间：
2017-03-28 18:55:23
阅读次数：
180
1.标准流就是浏览器默认布局的方式，也就是从上往下，从左向右的默认的排班布局的方式。 2.布局方式 2.1浮动的本质：解决图片与文字并排的格式问题。 *元素浮动后，会脱离标准流，影响其布局。 2.1.1未设置浮动前（before）： 2.1.2.设置浮动后（after） *浮动的元素会不占据标准流的 ...
分类：
Web程序 时间：
2017-03-19 22:08:47
阅读次数：
331
