表格table的td单元格中,文字长了往往会撑开单元格,但是如果table都不够宽了,就换行了好像(不要较真其他情况,我只说会换行的情况)。换行后的表格显得乱糟糟,不太好看,我不喜欢这样的换行。当然可以通过对每列td都设置宽度,那样太麻烦了,并且有时没法预计td中的文字会有多长,没法给固定宽度。

为了让表格里文字不换行(预计也不会太长的字符串),可以给表格里td添加一个nowrap属性,如 <td nowrap>文字内容</td> 这样。

但是如果给每个td都加上nowrap属性,貌似太繁琐并且占用空间和流量。于是乎,我找css的实现方法,不擅长此术,尝试了n多个样式后,找到white-space: nowrap; 貌似跟直接给td加nowrap差不多,那么就可以像下面这样定义样式,即可实现td里不换行,字符串长了就撑宽表格宽度。

<html>
<head>
    <style type="text/css">
        td
        {
            white-space: nowrap;
        }
    </style>
</head>

TD不换行 nowrap属性的更多相关文章

  1. table的 noWrap 属性不换行

    nowrap是什么意思? HTML中td元素的nowrap属性表示禁止单元格中的文字自动换行. 但使用时要注意的是,td元素noWrap属性的行为与td元素的width属性有关. td元素中nowra ...

  2. css文本换行相关属性及解释

    本文摘自 http://www.wufangbo.com/css-qiang-zhi-huan-hang/ 强制换行与强制不换行用到的属性 我们一般控制换行所用到的CSS属性一共有三个:word-wr ...

  3. HTML <td> 标签的 colspan 属性

    HTML <td> 标签的 colspan 属性 实例 表格单元横跨两列的表格: 浏览器支持 所以浏览器都支持 colspan 属性. 没有浏览器支持 colspan="0&qu ...

  4. td 不换行 隐藏显示多余的部分(转)

    转自:http://sha-tians.iteye.com/blog/1996162 table中td固定宽度后overflow:hidden不生效的问题 博客分类: html/css/js   前两 ...

  5. CSS 实现自动换行、强制换行、强制不换行的属性

    实现效果 1.自动换行: word-wrap:break-word; word-break:normal; 2.强制换行: word-break:break-all;       按字符截断换行 /* ...

  6. CSS 不换行 white-space 属性详解

    实例 规定段落中的文本不进行换行: p { white-space: nowrap } 可能的值 值 描述 normal 默认.空白会被浏览器忽略. pre 空白会被浏览器保留.其行为方式类似 HTM ...

  7. HTML <td> 标签的 rowspan 属性

    rowspan 属性规定单元格可横跨的行数. colspan  属性规定单元格可横跨的列数.

  8. HTML <td> 标签的 width 属性

    <table border="1" width="100%"> <tr> <th>Month</th> < ...

  9. table 中 文字长度大于td宽度,导致文字换行 解决方案

    1.TD不换行 nowrap属性 表格table的td单元格中,文字长了往往会撑开单元格,但是如果table都不够宽了,就换行了好像(不要较真其他情况,我只说会换行的情况).换行后的表格显得乱糟糟,不 ...

随机推荐

  1. 20165219 预备作业3 Linux安装及学习

    20165219 预备作业3 Linux安装及学习 安装虚拟机 在安装的过程中遇到了不少的问题,在同学的帮助下都得到了解决.比如在新建虚拟机的时候没有64位这个选项,后来知道需要开启虚拟化,然后是安装 ...

  2. Educational Codeforces Round 62 (Rated for Div. 2)E(染色DP,构造,思维,组合数学)

    #include<bits/stdc++.h>using namespace std;const long long mod=998244353;long long f[200007][2 ...

  3. redis源码分析(3)sds

    sds是redis中用来处理字符串的数据结构.sds的定义在sds.h中: typedef char *sds; 简洁明了!简明扼要!(X,玩我呢是吧!这特么不就是c中的字符串么?!).像redis这 ...

  4. 如何用python批量翻译文本?

    首先,看一下百度翻译的官方api文档. http://api.fanyi.baidu.com/api/trans/product/apidoc # coding=utf-8 #authority:bi ...

  5. SHELL编程之case与函数

    一.case语句概述 使用case语句改写if多分支可以使脚本结构更加清晰.层次分明 针对变量不同取值,执行不同的命令序列 case语句结构如下: case 变量值  in 模式1) 命令序列1 ;; ...

  6. screen虚拟终端

    screen命令相当于后台执行(虚拟终端) 用法:在一些要执行很久的操作,比如我有个文件有10个G,要传输一天左右,你如果是直接传输,万一你的连接断了.是不是意味着你的操作白费的呢,这时我们可以打开一 ...

  7. Tomcat 配置文件的解析

    转载:https://www.cnblogs.com/sunshine-1/p/8990044.html https://www.cnblogs.com/kismetv/p/7228274.html ...

  8. 【转】IntelliJ IDEA下自动生成Hibernate映射文件以及实体类

    1.构建项目并添加项目结构配置以及配置初始参数 1.1.如图将基本的架子搭建好     1.2.点击File,弹出的菜单中点击Project Structure:     1.3.点击左侧的Modul ...

  9. 浏览器端 禁止 html 使用后退 或者替换后退功能..

    知乎大佬的代码: 作者:独夜行 链接:https://www.zhihu.com/question/40511430/answer/166467343 来源:知乎 著作权归作者所有.商业转载请联系作者 ...

  10. [SP1825] Free tour II

    /* ----------------------- [题解] https://www.luogu.org/blog/IRving1-1/solution-sp1825 --------------- ...