方法一:

一般情况,默认的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. 理解 Linux 网络栈(1):Linux 网络协议栈简单总结 图

    http://www.cnblogs.com/sammyliu/p/5225623.html

  2. hadoop处理Excel通话记录

    前面我们所写mr程序的输入都是文本文件,但真正工作中我们难免会碰到需要处理其它格式的情况,下面以处理excel数据为例 1.项目需求 有刘超与家庭成员之间的通话记录一份,存储在Excel文件中,如下面 ...

  3. 亲测linux上安装mysql

    1.rpm -ivh MySQL-server-5.6.19-linux_glibc2.5.x86_64.rpm(这是复制过来的,用Tab键自动补齐吧)2.rpm -ivh MySQL-client- ...

  4. eclipse代码注释的设置

    http://blog.csdn.net/shiyuezhong/article/details/8450578 1. eclipse用户名的设置: 在eclipse的安装路径下,打开eclipse. ...

  5. ASP生成新会员编号

    Function MakeUserCode OpenDB() Randomize dim getid_rs,getid set getid_rs=rsobj do while true getid=^ ...

  6. iOS Instruments之Core Animation动画性能调优(工具复选框选项介绍)

    Core Animation工具用来监测Core Animation性能.它给我们提供了周期性的FPS,并且考虑到了发生在程序之外的动画(见图12.4) Core Animation工具提供了一系列复 ...

  7. SGU 172.eXam(二分图染色)

    时间限制:0.25s 空间限制:4M 题意: 将n(n<200)个点分成两个集合,给出m(m<=30000)对不能在一个集合的点对,判断能否分成满足要求的集合,输出其中一个集合和集合的总数 ...

  8. Ubuntu14.04安装AMD显卡驱动双屏显示器完全解决方案

    网上有很多方法,但是针对AMD显卡的方案不多,所以笔者今天想写一篇关于AMD显卡的教程. 首先,进入这个网址下载一些东东:http://support.amd.com/zh-cn/download/d ...

  9. 永久关闭防火墙和selinux

    临时关闭selinux: setenforce 0    //设置SELinux 成为permissive模式 彻底禁用selinux: 使用root用户,vim /etc/sysconfig/sel ...

  10. EasyUI 1.3之前DataGrid中动态选中、获取Checkbox

    这几天做项目,由于项目中用到的EasyUI版本过低,不能使用自带操作DataGrid中CheckBox的方法. 所以自己写了一个临时方案: 根据ID集合选中所属行的CheckBox: data={1, ...