inline-block的升级float:浮动
<!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:浮动的更多相关文章
- 20190402-display展现、float浮动
目录 1.display展现 dispaly:"none | block | inline | inline-block | list-item | run-in(主流浏览器不支持) | t ...
- 清除float浮动造成影响的几种解决方案
1. “清除浮动” ??准确的描述应该是“清除浮动造成的影响” 学习浮动推荐的视频教程<CSS深入理解之float浮动> 2.如何清除浮动造成的影响??? 栗子 块级div元素包含一个内 ...
- CSS3——分组和嵌套 尺寸 display显示 position定位 overflow float浮动
分组和嵌套 分组选择器 ——————> 嵌套选择器 能适用于选择器内部的选择器的样式 p{ }: 为所有 p 元素指定一个样式. .marked{ }: 为所有 class="m ...
- 边框,元素居中,盒子模型,margin,display,overflow,textarea,float,浮动停止条件,清除浮动影响,margin-top的bug,清除默认样式
边框 solid实线 dotted虚线 dashed点线 盒子在页面中实际的宽高都是5部分组成 宽=borderleft+paddingleft+width+paddingright+borderri ...
- css之float(浮动)的特性
详解CSS float属性 float本身不脱离文档流,但是和 position:absolute;搭配使用会脱离文档流 阅读目录 基础知识 float的详细细节 float特殊情况 clear属性 ...
- 给li设置float浮动属性之后,无法撑开外层ul的问题。(原址:http://www.cnblogs.com/cielzhao/p/5781462.html)
最近在项目中有好几次遇到这个问题,感觉是浮动引起的,虽然用<div style="clear:both"></div>解决了,但自己不是特别明白,又在网上查 ...
- float浮动问题:会造成父级元素高度坍塌;
float浮动问题:会造成父级元素高度坍塌: 解决办法:清除浮动:clear:both; 给父元素高度:height(不是很可取) 给父元素:display:inline-black:(问题:marg ...
- 解决float浮动带来的父元素高度没有的问题---清除浮动
float的特性 : 1:使元素block块级化: 2:破坏性造成的紧密排列特性. 基于以上的特性,使得我们通常把浮动用来布局,带来的问题是,容易出问题,重用性不行,ie6-的版本下很多问题,因为它是 ...
- float浮动深入理解
[CSS深入理解之float浮动]听课总结 (http://www.imooc.com/learn/121) 1.float的原本作用:为了实现文字环绕 2.float的包裹性和破坏性: 包裹性: ...
- 对css float 浮动的学习心得
css float浮动详解 @(css float)[hasLayout|clear float|妙瞳] css float的定义和用法 float 属性定义元素在哪个方向浮动.以往这个属性总应用于图 ...
随机推荐
- nmon的安装与使用
nmon的安装与使用 1.下载 nmon:http://nmon.sourceforge.net/pmwiki.php?n=Site.Download nmonanalyser http://www. ...
- MFC中将编辑框文本转换成整数,从而实现两个整数相加。
在头文件中,定义三个控件变量,如m_data1,m_data2,m_sum; void Cuse_demo_dllDlg::OnBnClickedButton1(){ CString data1; C ...
- git基本命令--远程
git clone: # clone到 <本地目录名> $ git clone <版本库的网址> <本地目录名> # 克隆版本库的时候,所使用的远程主机自动被Git ...
- 图像相似度计算之哈希值方法OpenCV实现
http://blog.csdn.net/fengbingchun/article/details/42153261 图像相似度计算之哈希值方法OpenCV实现 2014-12-25 21:27 29 ...
- linux CTRL+Z
关于 linux 系统中使用ctrl+Z 的使用 (1) CTRL+Z停止进程并放入后台 (2) jobs 显示当前暂停的进程 (3) bg %N 使第N个任务在后台运行(%前有空格) ,N 为任务号 ...
- 萝卜德森的sublime笔记中文翻译版
我已经使用subliem编辑器版本2接近2个月了,并且我在其中找到了一堆有用的技巧.我发觉应该写下这些技巧,为那些对此感兴趣的人们.我会尽力的详细描述,那些看起来像魔法一样的东西,因为很多非常“酷”的 ...
- Inno Setup入门(五)——添加readme文件
这个实现起来很简单,就是在[files]段中的某个预先作为readme的文件后面添加标志位isreadme: [setup] ;全局设置,本段必须 AppName=Test AppVerName=TE ...
- label自适应
//label自适应 self.label = [UILabel new]; self.label.font = [UIFont systemFontOfSize:14]; NSString *tit ...
- ListView控件的Insert、Edit和Delete功能(第一部分)
摘自:http://blog.ashchan.com/archive/2007/08/28/listview-control-insert-edit-amp-delete-part-1aspx/ Li ...
- python2.x 使用protobuf
1.在windows下配置protobuf 1.1 下载对应的包,包含两个:protoc.exe和源码文件(protoc也可以自己生成) 下载地址1 --- google code最近在迁移,也许以后 ...