方法一:

一般情况,默认的div是写一个换一行,那么如何定义两个div横向排列而不换行呢?

div默认的display属性是block。所以每一个div都是新的一行,现在把display换成inline就不会换新行了。

<div style="display:inline;">aaa</div>
<div style="display:inline;">bbb</div>

方法二:

这里使用float:right属性。float做为CSS中的一个属性定义元素向哪个方向浮动。

float:right 文本或图像会移至父元素中的右侧。

注意有写情况float属性必须配合width使用,否则失效。

<td class="bg10">
  <div style="width:120px; float:right;">阅读次数:9999</div>
  <div style="width:200px; float:right;">发表日期:2009-09-10</div>
</td>

.bg10 {
background-image:url(../images/news_r6_c4.jpg);
height:24px;
line-height:24px;
color:#939393;
}

height:24px; 和 line-height:24px; 高度一致,文字垂直居中。

如何定义让两个div横向排列的更多相关文章

  1. HTML+CSS-如何定义让两个div横向排列

    方法一: 一般情况,默认的div是写一个换一行,那么如何定义两个div横向排列而不换行呢? div默认的display属性是block.所以每一个div都是新的一行,现在把display换成inlin ...

  2. 两个div横向排列,顶端对齐的方式。

    1.左右两个div都设置为float:left,如果右边div没有设置宽度,右边div的宽度会根据div里的内容自动调整. <!DOCTYPE html PUBLIC "-//W3C/ ...

  3. 如何让div横向排列

    方法一: 一般情况,默认的div是写一个换一行,那么如何定义两个div横向排列而不换行呢? div默认的display属性是block.所以每一个div都是新的一行,现在把display换成inlin ...

  4. div横向排列

    在网页布局中,常常有几个div横向排列的需求,此时,可以采用浮动的方式: 1.左右浮动: <div class="main"> <div class=" ...

  5. DIV横向排列_CSS如何让多个div盒子并排同行显示

    如何让多个div盒子并排同行div横向排列显示呢? 我们先设置3个div盒子对象,什么css样式都不设置看看效果.代码如下: 三个div盒子均独占一行显示 div盒子本身默认样式属性是独占一行,而解决 ...

  6. css实现内容不相同的左右两个div等高

    问题提出 现在有两个div左右排列,但是两个div的内容不相同,如何设置两个div的css做到在两个div等高排列呢? 下面是网上找的3种实现方法,觉得很有代表性,所以索性收藏起来. 方法一 通过父元 ...

  7. 横向排列两个多个div盒子的方法(CSS浮动清除float-clear/inline)/办法

    最近在做一个div css切割,昨晚发现了长期以来一直无记录下来的问题!关于兼容IE跟FF的float属性.趁现在还清醒赶紧记下笔记先:一.并排在一行的两个div样式有这种情况:ie或者ff下对于子d ...

  8. CSS + ul li 横向排列的两种方法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. 让几个横向排列的浮动子div居中显示的方法

    div设置成float之后,就无法使子div居中显示了,那么如何让几个横向排列的浮动的div居中显示呢,下面有个不错的方法,希望对大家有所帮助 div设置成float之后,在父div中设置text-a ...

随机推荐

  1. 改变Android按钮背景颜色的高效方法

    本文将介绍一种有效改变Android按钮颜色的方法. 按钮可以在状态改变时改变其颜色(例如按下,禁用,高亮显示).但是,这需要一一说明每个状态.这篇文章将提供你一个根据状态变化轻松改变按钮颜色的方法. ...

  2. CHAR 详解

    CHAR(20):20指的是表中的a字段能存储的最大字符个数 CREATE TABLE `a` ( `a` char(20) DEFAULT NULL) ENGINE=InnoDB DEFAULT C ...

  3. 《ICSharpCode快速解压缩帮助类》——即粘即用

    在项目中往往使用解压缩公共类,解压缩之后的文件占用空间小,也可进行加密,往往可以用于客户端上传附件,打包输出主程序等,其中的好处就不多说了,最近着手的项目中多次使用到了解压缩方法,现较流行的就是ICS ...

  4. jquery parseInt()的问题

    对于parseInt("01")到parseInt("07");都能得到正确的结果,但如果是parseInt("08") 或parseInt ...

  5. typeerror $.ajax is not a function

    在web开发中使用jQuery进行前端开发遇到这么个问题,纠结了很久终于解决了,下面说一下解决方法. 大家可以参照下面几种排查的方法. 1.首先检查是否引用jQuery的库. 2.页面如果使用的ifr ...

  6. html px em pt长度单位(像素 相对长度 点)知识(转)

    html px em pt单位区 一.PX\EM\PT单位介绍 px单位名称为像素,相对长度单位,像素(px)是相对于显示器屏幕分辨率而言的国内推荐:em单位名称为相对长度单位.相对于当前对象内文本的 ...

  7. What and where are the stack and heap?

    The stack is the memory set aside as scratch space for a thread of execution. When a function is cal ...

  8. iOS 百度地图监听地图状态

    百度地图提供了地图状态的对象BMKMapStatus ///此类表示地图状态信息 @interface BMKMapStatus : NSObject { float _fLevel; // 缩放比例 ...

  9. jQuery 获取并设置 CSS 类

    通过 jQuery,可以很容易地对 CSS 元素进行操作. 切换 CSS 类 jQuery 操作 CSS jQuery 拥有若干进行 CSS 操作的方法.我们将学习下面这些: addClass() - ...

  10. 115个Java面试题和答案——终极列表

    from http://www.importnew.com/10980.html#collection http://www.importnew.com/11028.html 下面的章节分为上下两篇, ...