<!DOCTYPE html>

 <html>

     <head>

         <meta charset="utf-8">

         <title></title>

         <style>

             img{

                 float: left;

             }

             p{

                 clear:left;

             }

         </style>

     </head>

     <body>

         <img src="img/logo.png" alt="" />

         <p>您身边的IT培训专家</p>

     </body>

 </html>

回顾:inline-block 特性： 1、块在一排显示 2、内联支持宽高 3、默认内容撑开宽度 4、标签之间的换行间隙被解析（问题） 5、ie6 ie7不支持块属性标签的inline-block（问题）

float:left | right | none | inherit; 文档流是文档中可显示对象在排列时所占用的位置。 浮动的定义：使元素脱离文档流，按照指定方向发生移动，遇到父级边界或者相邻的浮动元素停了下来。 clear:left | right | both | none | inherit；元素的某个方向上不能有浮动元素 clear:both; 在左右两侧均不允许浮动元素

float的特征：

1、块在一排显示 2、内联支持宽高 3、默认内容撑开宽度 4、脱离文档流 5、提升层级半层

inline-block的升级float：浮动的更多相关文章

  1. 20190402-display展现、float浮动

    目录 1.display展现 dispaly:"none | block | inline | inline-block | list-item | run-in(主流浏览器不支持) | t ...

  2. 清除float浮动造成影响的几种解决方案

    1. “清除浮动” ??准确的描述应该是“清除浮动造成的影响”  学习浮动推荐的视频教程<CSS深入理解之float浮动> 2.如何清除浮动造成的影响??? 栗子 块级div元素包含一个内 ...

  3. CSS3——分组和嵌套 尺寸 display显示 position定位 overflow float浮动

    分组和嵌套  分组选择器 ——————>   嵌套选择器 能适用于选择器内部的选择器的样式 p{ }: 为所有 p 元素指定一个样式. .marked{ }: 为所有 class="m ...

  4. 边框，元素居中，盒子模型，margin,display,overflow,textarea,float,浮动停止条件，清除浮动影响，margin-top的bug，清除默认样式

    边框 solid实线 dotted虚线 dashed点线 盒子在页面中实际的宽高都是5部分组成 宽=borderleft+paddingleft+width+paddingright+borderri ...

  5. css之float(浮动)的特性

    详解CSS float属性  float本身不脱离文档流,但是和 position:absolute;搭配使用会脱离文档流 阅读目录 基础知识 float的详细细节 float特殊情况 clear属性 ...

  6. 给li设置float浮动属性之后，无法撑开外层ul的问题。（原址：http://www.cnblogs.com/cielzhao/p/5781462.html）

    最近在项目中有好几次遇到这个问题,感觉是浮动引起的,虽然用<div style="clear:both"></div>解决了,但自己不是特别明白,又在网上查 ...

  7. float浮动问题：会造成父级元素高度坍塌；

    float浮动问题:会造成父级元素高度坍塌: 解决办法:清除浮动:clear:both; 给父元素高度:height(不是很可取) 给父元素:display:inline-black:(问题:marg ...

  8. 解决float浮动带来的父元素高度没有的问题---清除浮动

    float的特性 : 1:使元素block块级化: 2:破坏性造成的紧密排列特性. 基于以上的特性,使得我们通常把浮动用来布局,带来的问题是,容易出问题,重用性不行,ie6-的版本下很多问题,因为它是 ...

  9. float浮动深入理解

    [CSS深入理解之float浮动]听课总结 (http://www.imooc.com/learn/121)   1.float的原本作用:为了实现文字环绕 2.float的包裹性和破坏性: 包裹性: ...

  10. 对css float 浮动的学习心得

    css float浮动详解 @(css float)[hasLayout|clear float|妙瞳] css float的定义和用法 float 属性定义元素在哪个方向浮动.以往这个属性总应用于图 ...

随机推荐

  1. c语言-三字符组

    C 源程序源字符集在 7 位 ASCII 字符集中包含,但设置为 ISO 646-1983 固定的代码的超集. 三字符序列允许 C 程序编写使用 " 仅 ISO (国际标准组织的固定的代码. ...

  2. 常用的css

    产品鼠标经过加边框效果 .productsCol:hover { box-shadow: 0 0 0 3px #333333 inset; transition: all 0.2s ease 0s; ...

  3. NetBox v2.8下载使用指南

    2008-09-20 11:21:05|  分类: ASP|举报|字号 订阅     NetBox v2.8下载地址: http://down.chinaz.com/soft/13211.htm 安装 ...

  4. hdu_5742_It's All In The Mind

    题目链接:hdu_5742_It's All In The Mind 题意: 有一个部分的数列,让你找一个满足他给的三个条件的数列,使前两个数的和除这个数列的sum最大 题解: xjb贪心一下就行了. ...

  5. IE11中的F12无效的问题

    最近做的一个项目中,h5中的video标签IE11在有的机器上兼容,有的机器上不兼容,很是让人头疼.将IE卸载后重装又发现最新的IE11中F12开发者工具失效.面对F12失效的问题,具体解决办法如下: ...

  6. 控制器view的加载顺序initWithNibName >>> viewDidLoad >>> viewWillAppear >>> viewDidAppear

    -(void)viewWillAppear:(BOOL)animated { self.navigationController.navigationBarHidden=NO;// 邓超界:放在wil ...

  7. anyremote源码分析

    XTest   鼠标移动事件. XTestFakeMotionEvent 关于XTest的编程. http://lilydjwg.is-programmer.com/2011/9/21/using-x ...

  8. 笨方法学python--安装和准备

    1 下载并安装python http://python.org/download 下载python2.7. python2.7并不是python3.5的旧版本. python2现在应用较广,网上资料较 ...

  9. label自适应

    //label自适应 self.label = [UILabel new]; self.label.font = [UIFont systemFontOfSize:14]; NSString *tit ...

  10. Mysql转化blob为可读

    -- info 为列名 SELECT convert(info using latin1) FROM drupal755.system; SELECT convert(info using utf8) ...