ul {
  white-space: nowrap;
}
li {
  display: inline-block;
}
 
 
white-space 属性设置如何处理元素内的空白。
normal 默认。空白会被浏览器忽略。
pre 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
nowrap 文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。
pre-wrap 保留空白符序列,但是正常地进行换行。 
pre-line 合并空白符序列,但是保留换行符。
inherit 规定应该从父元素继承 white-space 属性的值。

ul中li元素横向排列且不换行的更多相关文章

  1. 如何使ul中li元素横向排列且不换行

    外层div容器宽度固定,ul宽度随li(li宽度固定)的增加而撑开,但是当ul中li的宽度之和大于div时,ul没有撑开,而是li换行了,如何使li不换行? 解决方法:主要是外面容器设置为white- ...

  2. ul中li分列显示

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

  3. html中测试div、ul和li、table排列多个块

    前面有三篇博文测试了这三种方式,一.相关博文:LODOP问答部分链接.该文用的是div定位,用的是所有小div相对于大div进行定位,大的div设置relative定位,小的设置absolute相对于 ...

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

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

  5. Jquery和JS获取ul中li标签(转)

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

  6. Jquery和JS获取ul中li标签

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

  7. 用ul、li做横向导航

    /* ul li以横排显示 */ /* 所有class为menu的div中的ul样式 */ div.menu ul { list-style:none; /* 去掉ul前面的符号 */ margin: ...

  8. N个数组中所有元素的排列组合(笛卡尔积)算法

    (1)N个数组对象中所有元素排列组合算法 private List<List<Object>> combineAlg(List<Object[]> nArray) ...

  9. ul的li元素水平并居中的css

    ul{ text-align:center; } li{ display:inline } 这样li元素不需要float且可以居中 比较好样式如下 ul li { // float: left; pa ...

随机推荐

  1. php一个类引用另一个类的方法的写法

    default.php: <?php namespace SiteInfo{ class Site{ var $url; var $title; function setUrl($par){ $ ...

  2. UVA 12345 Dynamic len(set(a[LR]))

    题意:询问区间唯一元素个数,单点修改. 分析: 借助Unique snowflakes, Can you answer these queries II的思想,唯一性可以借助元素上一次出现的位置来判断 ...

  3. 剑指offer54 表示数值的字符串

    错误的代码: class Solution { public: bool isNumeric(char* string) { if(string == NULL) return false; if(* ...

  4. 原生Servlet 上传文件

    依赖jar <dependency> <groupId>commons-fileupload</groupId> <artifactId>commons ...

  5. 【书籍连载】《STM32 HAL 库开发实战指南—基于F7》-第一章

    从今天起,每天开始连载一章<STM32 HAL 库开发实战指南—基于F7>.欢迎各位阅读.点评.学习. 第1章  如何使用本书 1.1  本书的参考资料 本书参考资料为:<STM32 ...

  6. redis事务中的WATCH命令和基于CAS的乐观锁

    转自:http://blog.sina.com.cn/s/blog_ae8441630101cgy3.html 在Redis的事务中,WATCH命令可用于提供CAS(check-and-set)功能. ...

  7. EBS R12中FND凭证打印警告:OPP响应超时

    接近年关,最近年结忙的飞起,此为背景,今天运维那边反应日记账凭证打印报错,看了下后台请求发现请求有警告. 查看日志发现报了“并发:OPP响应超时”的警告,这个地方响应超时可能是配置文件中“并发:OPP ...

  8. 阿里云OSS图片上传plupload.js结合jq-weui 图片上传的插件

    项目中用到了oss上传,用的plupload,奈何样式上不敢恭维,特别是放在移动端上使用.于是自己把它移植到了jq weui的上传图片组件上. 更改:选择照片后确认即及时上传至oss服务器,不限制上传 ...

  9. C/C++程序基础 (十一)标准模板库

    标准模板库 标准模板库在标准函数库的定位 迭代器(类似指针)保证算法(常用算法)和容器(数据结构)的结合. vector的实现 底层实现是动态数组,所以支持随机访问. 内部是动态数组,随着insert ...

  10. 判断StringBuilder 是否为空

    if("".equals(stringbuilder.toString())) do..