简单语句实现DIV+CSS分两列(多列)布局显示

<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>

转载请注明出处:http://blog.csdn.net/itmyhome1990/article/details/19756399

ul和li实现分两列(多列)布局显示的更多相关文章

  1. ul、li分列显示

    目的很简单:有一个 ul>li 列表,默认为单列显示,把它变为两列显示. 方法1,使用DIV+CSS代码: <style type="text/css"> .my ...

  2. ul中li分列显示

    让ul中li分列显示,用li显示两列如下(要显视多列的自己想办法,哈哈): 2列 <ul> <li style="display:block;float:left;widt ...

  3. [HTML]去除li前面的小黑点,和ul、LI部分属性

    [转] 对于很多人用div来做网站时,总会用到,但在显示效果时前面总是会有一个小黑点,这个令很多人头痛,但又找不到要源,其它我们可以用以下方法来清除.[HTML]去除li前面的小黑点,和ul.LI部分 ...

  4. ul、li模仿ios的TableView实现城市选择

    最近项目一个接着一个,之前说的精创环的项目还没做完,今天说先把那个放一下,先做访客系统,销售会见客户之后可以对客户进行一个跟踪记录,原型图也给了,今日头条的频道自定义页面一样. 如果是在IOS上让我来 ...

  5. ul、li实现横向导航按钮

    好久没写博客了,主要是懒得呼气都不想呼,上周分给我一个新的任务,就是自己新建一个系统,快速极限开发,虽然之前自己也做过小的系统,但毕竟是自己做,随着自己的心意做,没有做其他的限制等,现在呢是给公司做, ...

  6. CSS中的ul与li样式详解

    CSS中的ul与li样式详解ul和li列表是使用CSS布局页面时常用的元素.在CSS中,有专门控制列表表现的属性,常用的有list-style-type属性.list-style-image属性.li ...

  7. CSS中的ul与li样式详解 list-type

    转自新浪博客http://blog.sina.com.cn/u/2539885750 ul和li列表是使用CSS布局页面时常用的元素.在CSS中,有专门控制列表表现的属性,常用的有list-style ...

  8. CSS学习笔记(5)--导航ul,li浮动问题

    为什么只给li设置浮动,没有给ul设置浮动,ul后的元素div也会跟着浮动?   添加评论 分享   默认排序按时间排序 3 个回答   张思远 程序员 2 人赞同 代码是不是这样的啊?<ul& ...

  9. 解决ul的li横向排列换行的问题

    1. 问题现象 先看下面的html结构: <div> <ul> <li><img src='./img/1.jpg'></li> <l ...

随机推荐

  1. 【Stackoverflow好问题】java在,如何推断阵列Array是否包括指定的值

    问题 java中,怎样推断数组Array是否包括指定的值 精华回答 1. Arrays.asList(...).contains(...) 2. 使用 Apache Commons Lang包中的Ar ...

  2. NEFUOJ 500 二分法+最大流量

    http://acm.nefu.edu.cn/JudgeOnline/problemshow.php?problem_id=500 description 在这个信息化的时代.网购成为了最流行的购物方 ...

  3. Oracle Data Provider for .NET now on NuGet

    Oracle Data Provider for .NET now on NuGet 时间 2015-03-02 22:30:00  Oracle Bloggers原文  http://cshay.b ...

  4. linux open

    一直记住不打开文件时候的mode,今天发现原来可以直接用0644这样的八进制数字代替,好开森 #include <stdio.h> #include <sys/types.h> ...

  5. NotePad++ for PHP

    原文:NotePad++ for PHP 一.安装设置 1.首先根据你的系统下载相应的安装文件.http://notepad-plus-plus.org/ Notepad++插件:http://sou ...

  6. MVC验证11-对复杂类型使用jQuery异步验证

    原文:MVC验证11-对复杂类型使用jQuery异步验证 本篇体验使用"jQuery结合Html.BeginForm()"对复杂类型属性进行异步验证.与本篇相关的"兄弟篇 ...

  7. XAMPP on Mac 组态 Virual Host

    首先,在hosts文件中添加virtual host域名.方向127.0.0.1 我一般使用的命名约定dev-domainname.com sudo nano /private/etc/hosts # ...

  8. Pki原则

    核心提示: 公开密钥和公开密钥证明书,产生的私钥client要么server证书.加密的公共密钥才能解密私钥文件只.私钥只能解密公开的加密文件.公众认为,它是开放的.所有的人都能够得到它.私人还表明, ...

  9. window批量-6 rem

    行动: 凝视命令,加大对批量处理相应的描述性信息 格公式: rem [comment] demo: bat @echo off pause rem 这是对pause的解释 echo xxx pause ...

  10. [译]Java 设计模式之桥接

    (文章翻译自Java Design Pattern: Bridge) 简单来说,桥梁设计模式是一个两层的抽象. 桥接模式就是从一个抽象中实现中解耦以便两个都可以独立的改变.桥接使用封装聚合而且使用继承 ...