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

调整后实现效果:

补充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. Tomcat架构解析(一)-----Tomcat总体架构

    Tomcat是非常常用的应用服务器,了解Tomcat的总体架构以及实现细节,对于理解整个java web也是有非常大的帮助. 一.Server   1.最简单的服务器结构 最简单的服务器结构如图所示: ...

  2. ELASTIC SEARCH 性能调优

    ELASTICSEARCH 性能调优建议 创建索引调优 1.在创建索引的使用使用批量的方式导入到ES. 2.使用多线程的方式导入数据库. 3.增加默认刷新时间. 默认的刷新时间是1秒钟,这样会产生太多 ...

  3. Le Chapitre VIII

    J'appris bien vite à mieux connaître cette fleur. Il y avait toujours eu, sur la planète du petit pr ...

  4. 1.7.6方法stop()与java.lang.threadDeath异常

    调用stop方法时会抛出java.lang.ThreadDeath异常,但一般情况下这个异常不需要显示的捕捉 package com.cky.thread; /** * Created by edis ...

  5. (转)MyEclipse10下创建web项目并发布到Tomcat

    转自:http://blog.sina.com.cn/s/blog_699d3f1b01012spf.html   MyEclipse10下创建web项目并发布到Tomcat 1.软件安装(不作详细描 ...

  6. FatMouse's Speed (hdu 1160)

          #include <iostream> #include <cstdio> #include <cstring> #include <algori ...

  7. Apache Flink 漫谈系列

    阿里云讲Flink的,还是蛮不错 https://yq.aliyun.com/articles/666043?spm=a2c4e.11153940.blogcont679659.23.9fae56e7 ...

  8. h5canvas绘制loading页面

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

  9. Python自动化开发 - 面向对象(一)

    本节内容 1.编程范式 面向过程编程 面向对象编程 2.面向对象编程介绍 类的语法 类与实例内存分配 构造方法 自定义方法 3.面向对象特性 一.编程范式 编程是程序员 用特定的语法+数据结构+算法组 ...

  10. Python自动化开发 - 字符串, 列表, 元组, 字典和和文件操作

    一.字符串 特性:字符串本身不可修改,除非字符串变量重新赋值.Python3中所有字符串都是Unicode字符串,支持中文. >>> name  = "Jonathan&q ...