未调整之前:客户信息显示不全

调整后实现效果:

补充CSS知识:

一、强制换行
word-break: break-all; 只对英文起作用,以字母作为换行依据。 word-wrap: break-word; 只对英文起作用,以单词作为换行依据。 white-space: pre-wrap; 只对中文起作用,强制换行。 word-break:break-all 和 word-wrap:break-word 都是能使其容器如DIV的内容自动换行,它们的区别在于: 、word-break:break-all
假设div宽度为450px,它的内容就会到450px自动换行,如果该行末端有个很长的英文单词,它会把单词截断,一部分保持在行尾,另一部分换到下一行。 、word-wrap:break-word
例子与上面一样,但区别就是它会把整个单词看成一个整体,如果该行末端宽度不够显示整个单词,它会自动把整个单词放到下一行,而不会把单词截断掉。 二、禁止换行 white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
white-space:nowrap; 是禁止换行。
overflow:hidden; 是让多出的内容隐藏起来,否则多出的内容会撑破容器。
text-overflow:ellipsis; 让多出的内容以省略号...来表达。但是这个属性主要用于IE等浏览器,Opera浏览器用-o-text-overflow:ellipsis; 而Firefox浏览器没有这个功能,多出的内容只能隐藏起来。

补充:http://blog.csdn.net/shangs2010/article/details/7075164

odoo开发笔记:前端显示强制换行的更多相关文章

  1. odoo开发笔记--前端搜索视图--按照时间条件筛选

    odoo在日常使用中,常会有这样的需要,比如,某个列表按照 日 .周.月.年来过滤搜索. 效果: 那么如何实现呢,如下是一段不同写法的样例代码,提供参考. <!--某模型 搜索视图--> ...

  2. odoo开发笔记 -- 前端开发相关

    https://www.cnblogs.com/lyzg/p/5634565.html http://dmyz.org/archives/598 https://www.jianshu.com/p/6 ...

  3. C#的百度地图开发(四)前端显示与定位

    原文:C#的百度地图开发(四)前端显示与定位 有了这些定位信息,那要如何在前端的页面上显示出来呢?这需要用到百度地图的JavaScript的API.下面是示例代码. 前端代码 <%@ Page  ...

  4. odoo开发笔记 -- div标签代替odoo button写法

    odoo开发笔记 -- div标签代替odoo button写法 并调用自定义js <footer> <div id="confirm_request_cloud_repo ...

  5. odoo开发笔记 -- 搜索视图继承扩展

    odoo开发笔记 -- 搜索视图继承扩展

  6. odoo开发笔记 -- 后台日志输出及分析

    odoo开发笔记 -- 后台日志输出及分析 附:日志分析软件

  7. odoo开发笔记--一个模块显示两个一级菜单

    场景描述: 在已启动开发的模块中,odoo顶部一级菜单只有一个“会员管理”,需求是:在同一级顶部菜单,增加新菜单“产品管理”.举例如图:       处理方式: 按照odoo的机制,实现这种效果,可以 ...

  8. odoo开发笔记 -- tree视图按指定字段group_by分组显示

    注意点: view视图文件中的搜索视图要放在action视图的前边. 在action视图中,要写search_view_id, 还有context, search_default_group_by_字 ...

  9. odoo开发笔记 -- 传递上下文实现列表视图按照指定条件过滤显示

    按钮传递上下文: <xpath expr="//div[@name='dec_work_sheet_id']" position="after"> ...

随机推荐

  1. 使用express框架和mongoose在MongoDB更新数据

    update方法  modelName.update({需要替换的内容},{“$set”:{新的内容}},function(err,doc){}); User.update({userName:&qu ...

  2. openstack网络基本概念(转)

    OpenStack的Neutron能够管理OpenStack环境中的虚拟 网络基础设施(VNI).和物理网络基础设施(PNI). OpenStack的Neutron同意租户创建虚拟网络拓扑结构.包括的 ...

  3. idea创建maven项目报错,Error initializing: org.codehaus.plexus.velocity.DefaultVelocityComponent@56da52a7 java.lang.NoClassDefFoundError: org/apache/commons/lang/StringUtils

    学着使用idea,想创建个maven项目,但是出师不利,立马报错,贼尴尬,错误信息如下: D:\Develop\JDK\bin\java.exe -Dmaven.multiModuleProjectD ...

  4. Codeforces Round #540 (Div. 3)--1118D2 - Coffee and Coursework (Hard Version)

    https://codeforces.com/contest/1118/problem/D2 和easy version的主要区别是,数据增加了. easy version采用的是线性查找,效率低 在 ...

  5. java基础-day15

    第01天 java面向对象 今日内容介绍 u 包和权限修饰符 u 内部类 第1章   包和权限修饰符 1.1      包的概述 java的包,其实就是我们电脑系统中的文件夹,包里存放的是类文件. 当 ...

  6. 关于QT应用在XP系统上兼容运行的问题

    修改兼容XP: 1. 项目属性->配置属性->平台工具集:Visual Studio 2013 - Windows XP (v120_xp) 2. C/C++ 属性-> 代码生成-& ...

  7. js-设置时间,获取几天后的时间

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  8. iOS开发—音乐的播放

    iOS开发—音乐的播放 一.简单说明 音乐播放用到一个叫做AVAudioPlayer的类,这个类可以用于播放手机本地的音乐文件. 注意: (1)该类(AVAudioPlayer)只能用于播放本地音频. ...

  9. ios 百度地图,火星坐标,地球坐标互转

    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 3 ...

  10. [LintCode] Permutations

    http://www.lintcode.com/en/problem/permutations/# Given a list of numbers, return all possible permu ...