1、方式一：

　　通过div的float属性，定义宽度，然后定义float属性和width的属性，实现多个div在一行显示；

2、方式二：

通过div的display的属性，至少进行2成div的display设置成table，子div设置成table-cell以及width的宽度；方法不同设置的效果也不一样；

利用display的时候，也需要注意vertical-align:middle; 竖直居中；

多个div 一行显示的处理方式的更多相关文章

  1. css：多个div在同一行显示

    使用float:left,也可以使用display : inline-block,可以使多个div在同一行显示. 示例如下: <div class="search_row"& ...

  2. div中显示页面

    在css中显示页面,在页面布局中很多时候都要在一个div 里显示某些页面.在这里写下我用到的一种方式. <script type="text/javascript"> ...

  3. 影响div背景色显示的问题

    说来惭愧,走上程序猿这条不归路已经一年了,却连自己的博客都没有.看到道上有脸面的大神博客都做得贼漂亮~~于是,按捺不住了~~ 今天终于开通了博客园博客,正式开始我的博客人生啦!!!~~吼吼~~ 废话少 ...

  4. 如何利用CSS代码使图片和文字在同一行显示且对齐

    对于初学css的新手朋友来说,经常会遇到这样一个问题,当文字和图片出现在同一行或者同一个div里面的时候,在浏览器中运行出来的显示效果往往是在不同的行,那么,我们怎么才能利用CSS代码使图片和文字在同 ...

  5. All about Div内显示滚动桥

    Div内显示滚动桥看似是一个简单的前端问题,然而实际会发现还是有挺多需要注意的, 本文尝试对div内显示滚动桥的各种主要实现及一些难题进行研究. 横向滚动桥 横向滚动桥比较简单,无需设置宽度,直接ov ...

  6. CSS控制图片和文字在同一行显示且对齐的3种方法

    CSS控制图片和文字在同一行显示且对齐的3种方法 在 HTML 代码中,有时会需要在文字旁边加上一个图标. 默认情况,是图片置顶对齐,文字置底对齐,所以通常图片高,文字低,不能水平居中对齐. 常见方法 ...

  7. html中怎么样让div并排显示

    html中的div默认是流式显示,每个div会占用一整行 <html> <head> <meta http-equiv="Content-Type" ...

  8. CSS3属性之text-overflow:ellipsis,指定多行文本中任意一行显示...

    对于text-overflow:ellipsis,文本超出部分显示...,但要实现这个效果,却有一些必备条件,如下: div{ overflow:hidden; white-space:nowrap; ...

  9. 简简单单，jquery中，使用checkbox控制div的显示与隐藏

    今天开发代码时,发现好久不用jquery就生疏了. 所以作这个记录, 使用checkbox控制div的显示与隐藏. 一,html代码处: <input type="checkbox&q ...

随机推荐

  1. Struts2标签简介

    Struts2标签简介 Struts2标签的优势 标签库简化了用户对标签的使用 结合OGNL使用,对于集合.对象的访问功能非常强大 提供可扩展的主题.模板支持,极大简化了视图页面的编写 不依赖任何表现 ...

  2. gnl总结（#,%,$）

    Ognl表达式struts标签“%,#,$” 1.什么是Ognl? OGNL(Object-Graphic Navigation Language),对象图道行语言.是一种可以方便操作对象属性的开源表 ...

  3. java 打包过程及如何使用第三方jar包

    地址:http://wenku.baidu.com/view/44a1bbed81c758f5f61f6779.html或者 http://wenku.it168.com/d_000575231.sh ...

  4. 导出Excel之Epplus使用教程4（其他设置）

    导出Excel之Epplus使用教程1(基本介绍) 导出Excel之Epplus使用教程2(样式设置) 导出Excel之Epplus使用教程3(图表设置) 导出Excel之Epplus使用教程4(其他 ...

  5. 前端框架react研究

    摘要: 最近公司要做一个嵌套在app中的应用,考虑着用Facebook的react来开发view,所以就研究了下.下面是我在开发中遇到的坑,希望能给你帮助. 项目地址:https://github.c ...

  6. 模板插件aTpl

    摘要: 前面给大家分享了一款js模板插件,后来经过完善推荐给大家.该插件支持ie5+,chrome等浏览器以及移动端浏览器,支持for和if语法,以及表达式. 项目地址:https://github. ...

  7. unity3d 日志捕捉

    public class Test : MonoBehaviour { public string output = ""; public string stack = " ...

  8. 修改Capfile，在正式环境不再使用migration修改数据库

    原因是这样的,运维不开放正式环境数据库的alter权限,所以每次都要给他们把sql语句发过去, 由他们来操作. https://github.com/capistrano/rails Require ...

  9. Lucas的数论(math)

    Lucas的数论(math) 题目描述 去年的今日,Lucas仍然是一个热爱数学的孩子.(现在已经变成业界毒瘤了> <) 在整理以前的试题时,他发现了这么一道题目:求\(\sum\limi ...

  10. PHPNG (next generation)

    PHPNG (next generation) This page gives short information about development state of a new PHP branc ...