table表格字母无法换行
在项目中,用到的table比较多,本来布局挺好的,后来在td内写入英文字母,整个布局就乱了,会撑的很宽,不换行,后来才知道:一般字母的话会被浏览器默认是一个字符串或者说一个单词,所以不会自动换行。
于是就需要进行设置,让表格自动换行:
1.在td中设置样式style为word-wrap:break-word;word-break:break-all;(一般只需设置word-break:break-all,但有时候需加word-wrap:break-word ),td设置这俩样式的时候,table不需要设置fixed;;
2.把表格的sytle的table-layout:fixed,就是表格固定宽度,就是表格既要自适应他外面的容器,也不要撑出去,然后设置td的word-wrap:break-word;换行即可,这样设置的话,tabel会平分成两部分,所设置的不同宽度就不起作用。
其他元素实现换行:
强制不换行
white-space:nowrap;
}
自动换行
word-wrap: break-word;
word-break: normal;
}
强制英文单词断行
word-break:break-all;
}
table表格字母无法换行的更多相关文章
- java:HTML(table表格,ul列表)和CSS(导入.css文件,三种定义颜色方式,三种样式选择器,a标签属性顺序,)
1.重点掌握: html: 1.form表单:input,checkbox,seelct,radio,button,submit 2.table表格:thead-->tr-->th;tbo ...
- [转]CSS如何设置html table表格边框样式
原文地址:http://www.divcss5.com/wenji/w503.shtml 对table设置css样式边框,分为几种情况: 1.只对table设置边框 2.对td设置边框 3.对tabl ...
- table表格超出部分显示省略号
做table表格时,某一列字数比较多,希望超出宽度的部分以省略号显示 设置table的布局 默认automatic 以表格内容显示相应宽度 改成fixed 以表格列宽显示内容 table{ ta ...
- 怎么设置table(表格)手机端自适应宽度
我们在wordpress文章页面经常会用到表格,有些是从其他网页或者文档复制粘贴过来的,在电脑设备网页上都能很好的展示,但是在移动设备上或者低分辨率设备上却经常撑破列宽,很是影响美观和客户体验.这里就 ...
- html5常用标签table表格布局
html5常用标签table表格布局 一.总结 一句话总结: 二.html5常用标签table表格布局 用表格显示信息调理清楚,使浏览者一目了然.表格在网页中还有协助布局的作用,可以把文字.图像等组织 ...
- JS组件系列——Bootstrap Table 表格行拖拽(二:多行拖拽)
前言:前天刚写了篇JS组件系列——Bootstrap Table 表格行拖拽,今天接到新的需要,需要在之前表格行拖拽的基础上能够同时拖拽选中的多行.博主用了半天时间研究了下,效果是出来了,但是感觉不尽 ...
- MiniUI动态添加table表格
本文将介绍一下,如何用Jquery MiniUi动态添加一行table表格 1.效果展示 ↓ 2.具体代码 <script type="text/javascript"> ...
- table表格宽度固定,同时td内容过长也不会被撑开
table表格宽度固定,同时td内容过长也不会被撑开,设置如下css: table{table-layout:fixed;word-break:break-all;}
- Bootstrap Table表格一直加载(load)不了数据-解决办法
bootstrap-table是一个基于Bootstrap风格的强大的表格插件神器,官网:http://bootstrap-table.wenzhixin.net.cn/zh-cn/ 这里列出遇到的一 ...
随机推荐
- javascript之闭包,递归,深拷贝
闭包 理解:a函数执行后return出b函数且b函数可以访问a函数的数据 好处:子函数存储在复函数内部,子函数执行完不会被自动销毁 坏处:占用内存比较大 ex: function bibao(){ v ...
- 洛谷 P4245 [模板]任意模数NTT —— 三模数NTT / 拆系数FFT(MTT)
题目:https://www.luogu.org/problemnew/show/P4245 用三模数NTT做,需要注意时间和细节: 注意各种地方要取模!传入 upt() 里面的数一定要不超过2倍 m ...
- Android四种启动模式
四种启动模式 standard(默认) singleTop singleTast singleInstance standard(默认) 系统默认的启动模式. Android是使用返回栈来管理活动的, ...
- bzoj1598
K短路 和超级钢琴之类的差不多 先反图跑最短路,从原点向外拓展,每个点最多拓展k次,否则不可能是k短路 #include<bits/stdc++.h> using namespace st ...
- mysql : mysql 5.6.13 免安装版配置
前言:真正用到mysql是在公司的第二个项目下,具体的一些在之前的博客文章(http://www.cnblogs.com/zhengzeze/p/5623440.html)中也提到了,其中涉及到,免安 ...
- 用JavaScript方式创建easyUI datagrid Column Group(列组)
代码如下: <script type="text/javascript"> var datagrid; $(function(){ $('#datagrid').dat ...
- Ubuntu下对与rtl8723be网卡频繁断网问题解决
linux下对于rtl系列的无线网卡,大多数网友都在吐槽,总是频繁的掉网,就此将自己在网上安装时的经验写下. 1.下载网卡驱动,其中包含rtl的大多数包 sudo apt-get install li ...
- 进击python第一篇:相遇
1.第一句Python代码 在 当前目录下创建 hello.py 文件,内容如下: print "hello,world!" 执行 hello.py 文件,即: python he ...
- uoj#418. 【集训队作业2018】三角形(线段树合并)
传送门 好迷啊--膜一下ljz 考虑每个操作,如果把操作按先后顺序放到序列上的话,操作一就是把\(w_i\)的石子放到某个节点,那么就是在序列末端加入\(w_i\),然后根据贪心肯定要把它所有儿子的石 ...
- [Xcode 实际操作]八、网络与多线程-(6)使用UIApplication对象打开地图
目录:[Swift]Xcode实际操作 本文将演示如何使用应用程序单例对象,打开地图的功能. 在项目导航区,打开视图控制器的代码文件[ViewController.swift] import UIKi ...