我们在用css float的时候，如何让文本水平居中真的很麻烦，

[float]使div（或者其他标签）的宽度自适应其内容，但它却有个弊端：无法居中。
[display:inline-block]也有同样的特性，并且可以居中，但连续几个这样的东东，之间却会出现空格。

第一种方案：

<html>

    <body style="text-align:center">

        <div style="margin:0 auto;">

          <div style="float:left">123243</div>

          <div style="float:left">6576876</div>

          <div style="float:left">2433665</div>

        </div>

    </body>

</html>

　第二种方案（推荐）

<html>

    <body style="text-align:center">

        <div style="display:inline-block; *display:inline; zoom:1;">

          <div style="float:left">123243</div>

          <div style="float:left">6576876</div>

          <div style="float:left">2433665</div>

        </div>

    </body>

</html>

float后怎么居中的更多相关文章

  1. 子div设置float后导致父div无法自动撑开的问题

    子div设置float后会导致父div无法自动撑开 原因:内部的DIV因为float:left之后,就丢失了clear:both和display:block的样式,所以外部的DIV不会被撑开. 以下是 ...

  2. 前端页面div float 后高度 height 自适应的问题

    最近在画项目页面的时候遇到了一个左侧div一旦加上float:left 属性后,设置其高度height:100% 不起作用,后来网上查了半天也没有找到很好的解决方案,只在csdn里发现了这个马上记录下 ...

  3. UIScrollView中图片放大后不居中，或居中后移动有偏差解决办法

    转自:http://blog.sina.com.cn/s/blog_6ae8b50d0100yret.html 问题的描述如下:要显示一张图片,也只需要显示一张图片,该图片可能很大,也可能很小,但是要 ...

  4. HTML+CSS教程（六）浮动-float+定位-position+居中问题

    一.浮动(float)1.文档流:是指盒子按照 html 标签编写的顺序依次从上到下,从左到右排列,块元素占一行,行内元素在一行之内从左到右排列,先写的先排列,后写的排在后面,每个盒子都占据自己的位置 ...

  5. 子Div使用Float后如何撑开父Div

    如果想要撑开父元素可以采用以下方法: 方法一: 父元素设置overflow以及zoom,样式如下: 1 <style> 2   #div1{border:1px solid red;ove ...

  6. CSS: 解决Div float后，父Div无法高度自适应的问题

    在用CSS+DIV的布局中,常常会发现,当一个DIV float之后,假设他的高度超过了其父DIV的高度时,其父DIV的高度并不会对应的进行调整.要解决问题(也叫做闭合(清除)浮动),我们有四种办法: ...

  7. 学习笔记----float后不与前面元素同行解决办法。

    <li>文本<span> 16-08-17</span></li> 当非float的元素和float的元素在一起的时候(如上代码), 如果非float元 ...

  8. 子div设置float后会导致父div无法自动撑开

    本文是从简书复制的, markdown语法可能有些出入, 想看"正版"和更多内容请关注 简书: 小贤笔记 注: 文章部分转载 彩泉 - 博客园 原因:内部的DIV因为float:l ...

  9. 已知float后几位,谋几位保留

    设变量n为float类型,m为int类型,则以下能实现将n中的数值保留小数点后两位,第三位进行四舍五入运算的表达式____. #include "common.h" #includ ...

随机推荐

  1. Elasticsearch 2014年10月简报

    1. Elasticsearch Updates 1.1 公布了Kibana 4 Beta 1 和Beta 1.1 Kibana 4不管是在界面的布局,使用配置方法,还是底层绘制图表的方式都与Kiba ...

  2. apue学习笔记（第三章 文件I/O）

    本章开始讨论UNIX系统,先说明可用的文件I/O函数---打开文件.读写文件等 UNIX系统中的大多数文件I/O只需用到5个函数:open.read.write.lseek以及close open函数 ...

  3. ABP框架EF6链接Oracle数据库手动迁移

    环境:VS2017 + ABP官方模板(不含Zero) +Oracle 11Gx64DB  + Oracle 11Gx32Client(PLSQL工具访问) 一.Abp项目的下载以及运行 1.创建ab ...

  4. 微软认知服务：QnA Maker使用示例

    简介 QnA Maker 从用户提供的内容(包括 FAQ URL.文档和编辑内容)中提取所有可能存在的问答对:利用易于使用的界面编辑.删除和添加问答对,然后将知识库作为 API 终结点进行发布:QnA ...

  5. 源代码分析：onAttach, onMeasure, onLayout, onDraw 的顺序。

    从前文<源代码解析:dialog, popupwindow, 和activity 的第一个view是怎么来的?>中知道了activity第一个view或者说根view或者说mDecorVi ...

  6. bzoj 2458: [BeiJing2011]最小三角形 题解

    [前言]话说好久没有写题解了.到暑假了反而忙.o(╯□╰)o [原题] 2458: [BeiJing2011]最小三角形 Time Limit: 10 Sec  Memory Limit: 128 M ...

  7. How to Use HTML5 FUll Screen API（怎样使用HTML5全屏接口）

    原文链接:http://www.sitepoint.com/use-html5-full-screen-api/ 假设你不太喜欢变化太快的东西,那么web开发可能不适合你. 我曾在2012年末有写过F ...

  8. Python基础之初识递归

    初识递归 递归的定义: 在一个函数里再调用这个函数本身,这种魔性的使用函数的方式就叫做递归. 递归的最大深度--997 递归函数不受外力的阻止会一直执行下去,python为了杜绝此类现象,强制将递归层 ...

  9. 转载了个js代码

    document.selection.createRange方法 document.selection.createRange() 根据当前文字选择返回 TextRange 对象,或根据控件选择返回 ...

  10. 织梦DedeCMS自定义表单提交成功后返回当前页面的教程

    织梦的自定义表单制作的留言,报名等功能,提交成功后会自动返回到首页,那么如何让它返回到当前页面呢? 方法如下: 打开plus/diy.php文件 找到 showmsg($bkmsg, $goto); ...