只要控制了li的宽度,利用浮动就能实现
<style type="text/css"> 
.my ul { 
width: 210px; 
} 
.my li { 
width: 100px; /*如果显示三列 则width改为70px*/ 
float: left; 
display: block; 
} 
</style>

代码如下: 
<div class="my"> 
<ul> 
<li>那些花儿</li> 
<li>那些花儿</li> 
<li>那些花儿</li> 
<li>那些花儿</li> 
<li>那些花儿</li> 
<li>那些花儿</li> 
</ul> 
</div>

li分两列显示的更多相关文章

  1. 如何将文章列表用<li>分两列显示

    我们平时用ul或ol标签来罗列文章列表时默认是一列,为了美观起见,想把它们两列显示要如何操作呢?怎么用css定义它们? 其实相对比较简单,用几行css样式定义一下就够了,可以用div + css来控制 ...

  2. ul和li实现分两列(多列)布局显示

    简单语句实现DIV+CSS分两列(多列)布局显示 <style type="text/css"> .my ul { width: 210px; } .my li { w ...

  3. 两个表,一个表中的两列关联另一个表的id,如何将这个表中的两列显示为另一个表id对应的内容

    表A name user owner machine1 1 2 machine2 3 4 表B userid username 1 aaa 2 bbb 3 ccc 4 ddd 以上两个表,表A 设备的 ...

  4. CSS------如何让ul中的li分为两列甚至多列

    转载: http://blog.sina.com.cn/s/blog_7f13f92a0100rkfg.html 只需要复制ul和li中的style样式即可 如果需要自定义多少列,只需要修改li中的w ...

  5. ReportServices如何在一页中将报表分成两列显示

    创建两个数据集 DataSet1    DataSet2 DataSet1 SELECT   TOP                    (SELECT   (COUNT(*) + 1) / 2 A ...

  6. ul li一行两个显示

  7. Excel 两列单元格合并超级链接的VBA 写法

    Excel 单元格 分两列 (B列存放姓名, C列存放链接) 列如: 姓名 学号 博客地址 1309032022 李汉超 http://www.cnblogs.com/Vpygamalion/ 141 ...

  8. 代码: 两列图片瀑布流(一次后台取数据,图片懒加载。下拉后分批显示图片。图片高度未知,当图片onload后才显示容器)

    代码: 两列图片瀑布流(一次后台取数据,无ajax,图片懒加载.下拉后分批显示图片.图片高度未知,当图片onload后才显示容器) [思路]: 图片瀑布流,网上代码有多种实现方式,也有各类插件.没找到 ...

  9. el-form 每行显示两列,底部按钮居中

    需求: el-form 每行显示两列,底部按钮居中 问题: 以前的解决办法是: el-col, el-row.但是这里只有一个 el-form-item 的 label 数据是已知的,其余项都是循环得 ...

随机推荐

  1. 如何安装ipa文件(二)

    第一篇文章请看: http://www.cnblogs.com/BK-12345/p/6000124.html 写第二篇的目的是因为iTunes更新了,有一些东西发生了变化,应用没有了,其实还是存在的 ...

  2. linux之awk基础

    第一章 1.awk 简介 awk不仅仅时linux系统中的一个命令,而且是一种编程语言,可以用来处理数据和生成报告(excel).处理的数据可以是一个或多个文件,可以是来自标准输入,也可以通过管道获取 ...

  3. OpenGL学习(3)——Shader

    之前已经接触过Vertex Shader和Fragment Shader,这次学习如何编写Shader并封装成类. Shader源码主要有四部分: 版本声明 #version xxx core: 使用 ...

  4. 0.1 Maven相关知识(项目开发基础)

    一.Maven 1.1Maven是什么 Maven项目对象模型(POM),可以通过一小段描述信息来管理项目的构建,报告和文档的项目管理工具软件. Maven这个单词来自于意第绪语(犹太语),意为知识的 ...

  5. 转载别人的一篇关于git的文章

    转载网址:https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000

  6. OpenMPI源码剖析:网络通信原理(一)

    MPI中的网络通信的原理,需要解决以下几个问题: 1. MPI使用什么网络协议进行通信? 2.中央数据库是存储在哪一台机器上? 3.集群中如果有一台机器挂掉了是否会影响其他机器? 参考: https: ...

  7. 机器学习初入门01-numpy的基础用法

    一.numpy基础结构 1. numpy.genformtxt('路径名', delimiter = '分割符', dytype = 读取方式如str ):读取一个文件,返回一个numpy.ndarr ...

  8. 软件工程 BUAAMOOC项目Postmortem结果

    设想和目标 1.我们的软件要解决什么问题?是否定义的很清楚?是否对典型用户和典型场景有清晰的描述? 我们的软件是基于北航MOOC网站做的Android手机客户端,用于便捷的在学校里通过手机做到随时随地 ...

  9. Beta阶段冲刺-4

    一. 每日会议 1. 照片 2. 昨日完成工作 3. 今日完成工作 4. 工作中遇到的困难 杨晨露:热......算不算困难......? 戴志斌:找了好几种框架,改了不少 游舒婷:不能相信开发工具自 ...

  10. 关于vs2013进行单元测试

    安装vs的过程就不多说了,做为一个学计算机的学生十基本技能. 第一步建立新工程.使用c#语言, 第二步,建立一个类.输入要测试的代码 第三步 建立一个类 第四步  运行测试