日常我们为了让文字内容在一行内显示完，哪怕宽度不够也不能换行，我们可以使用white-space样式，但如果遇到了html br强制换行标签，无论是设置white-space与否都会被<br>强制换行。

昨天仿照娜姐做的标题滚动，自己照着那个js也写了一个，结果发现死活就是不滚动，今天早上发现原来还有一段CSS代码没有看到，这个css代码尤为重要、

其中就是有一个属性：

white-space:nowrap;

2、white-space参数：
normal : 　默认处理方式
nowrap : 　强制在同一行内显示所有文本，直到文本结束或者遭遇br标签对象才换行。DIVCSS5推荐使用white-space:nowrap强制不换行

文章来源：http://www.divcss5.com/rumen/r401.shtml

滚动代码如下附上：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>无标题文档</title>

<style type="text/css">

#scrollobj01,#scrollobj02 {

white-space: nowrap;

overflow: hidden;

width: 390px;

}

</style>

</head>

<body>

<div >

<div class="gdxw" style="width:510px; margin-top:3px;">

            <img src="data:images/gdxl_tp2.gif" width="115" height="22" style="float:left;" />

            <div id="scrollobj01" onmouseover="javascript:_stop01();" onmouseout="javascript:_start01();" style="float:left; width:390px; font-size:14px; font-family:'宋体'; color:#ff0214;">

                生活生活生活生活生活生活生活生活生活生活生活生活

                    <a href="${document.fileName}?id=${document.id}" target="_blank" style="color:#FF0214;"><b>${document.title}</b></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

                </#list>

            </div>

            <script language="javascript" type="text/javascript">

            <!--

            function scroll01(obj) {

                /*往左*/

                var tmp = (obj.scrollLeft)++;

                //当滚动条到达右边顶端时

                if (obj.scrollLeft == tmp) {

                    obj.innerHTML += obj.innerHTML;

                }

                //当滚动条滚动了初始内容的宽度时滚动条回到最左端

                if (obj.scrollLeft >= obj.firstChild.offsetWidth) {

                    obj.scrollLeft = 0;

                }

            }

            var _timer = setInterval("scroll01(document.getElementById('scrollobj01'))", 10);

            function _stop01() {

                if (_timer != null) {

                    clearInterval(_timer);

                }

            }

            function _start01() {

                _timer = setInterval("scroll01(document.getElementById('scrollobj01'))", 10);

            }

            //-->

            </script>

        </div>

        </div>

</body>

</html>

仔细看别人代码

white-space norma nowrap强制同一行内显示所有文本文字，让所有文字内容中一排显示不换行的更多相关文章

  1. 如何使文本溢出边界不换行强制在一行内显示？#test{width:150px;white-space:nowrap;}

    #test{width:150px;white-space:nowrap;}

  2. CSS强制文本在一行内显示若有多余字符则使用省略号表示

    这篇文章主要介绍了强制文本在一行内显示,多余字符使用省略号,设置或检索是否使用一个省略标记(...)标示对象内文本的溢出.对应的脚本特性为textOverflow 设置或检索是否使用一个省略标记(.. ...

  3. CSS控制文本在一行内显示，若有多余字符则使用省略号表示

    强制文本在一行内显示,多余字符使用省略号 text-overflow: ellipsis; overflow: hidden; white-space: nowrap;

  4. 用CSS让字体在一行内显示不换行（收藏）

    当一行文字超过DIV或者Table的宽度的时候,浏览器中默认是让它换行显示的,如果不想让他换行要怎么办呢? 用CSS让文字在一行内显示不换行的方法   一般的文字截断(适用于内联与块): .text- ...

  5. 用CSS让字体在一行内显示不换行

    青枫 , 2012/07/13 18:08 , css样式设计 , 评论(0) , 阅读(2189) , Via 本站原创 大 | 中 | 小  当一行文字超过DIV或者Table的宽度的时候,浏览器 ...

  6. CSS控制字体在一行内显示不换行

    当一行文字超过DIV或者Table的宽度的时候,浏览器中默认是让它换行显示的,如果不想让他换行要怎么办呢?用CSS让文字在一行内显示不换行的方法: 一般的文字截断(适用于内联与块): .text-ov ...

  7. CSS+DIV实现文字一行内显示，并且过多的文字以点来代替

    有些时候我们在使用CSS+DIV进行排版实现大量的文字的时候,为了页面的美观,这里需要将文字在div中一行显示,并且将过多的文字进行隐藏,以点号进行代替.当鼠标放上面的时候会以title的形式显示所有 ...

  8. dom4j解析xml报错:Nested exception: org.xml.sax.SAXParseException: White space is required between the processing instruction target and data.

    采用dom4j方式解析string类型的xml xml:        String string="<?xmlversion=\"1.0\" encoding=\ ...

  9. Python 让两个print()函数的输出打印在一行内

    1.两个连续的print()函数为什么在输出时内容会分行显示? 解:print()中有两个默认参数 sep 和 end,其中sep是代替分隔符,end是代替末尾的换行符,默认使用‘,’代替空格,且默认 ...

随机推荐

  1. Android导出jar包后的资源使用问题

    我们常常遇到一个需求,就是给别人使用我们project的时候,为了可以屏蔽代码,把代码封装成jar包提供给第三方使用,可是这样我们的资源文件怎么给对方用呢? 网上有非常多方法,实用ClassLoade ...

  2. android 怎样内置/预置/预编译文件(运行程序，应用程序，apk, jar, lib 等随意文件)到系统中

    方法一:  如果要内置的软件名称为iperf.exe 1. 将iperf.exe放到Codebase的随意一个文件夹下(该文件夹必须可以在搜索Android.mk时被搜索到),比方system/ipe ...

  3. [c#]如何在form的webbrowser控件中获得鼠标坐标

    如图这样,其实是要插入一个time的控件,这样才能使得坐标值会根据鼠标的移动而不停变化.time插件中写private void timer1_Tick(object sender, EventArg ...

  4. Interpreter Expression 解释器模式

    简介 Interpreter模式也叫解释器模式,是由GoF提出的23种设计模式中的一种.Interpreter是行为模式之一,它是一种特殊的设计模式,它建立一个解释器,对于特定的计算机程序设计语言,用 ...

  5. node.js常用的几个模块总结

    /** 一 util *      是 node 里面一个工具模块 ,node 里面几乎所有的模块 都会用到 在这个模块 *  功能: *      1 实现继承 这是主要功能 *      2 实现 ...

  6. 基于Bootstrap实现下图所示效果的页面，一个白底的带有两个菜单项、一个下拉菜单和一个登录表单的基本导航条

    <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8& ...

  7. css.day04

    1. box   盒子模型 <p>   <span>   <hr/>   <div> css+   div  p  span css+  xhtml b ...

  8. My.Ioc 代码示例——注册项的注销和更新

    当您需要从 Ioc 容器中注销/删除一个注册项的时候,您会怎么做呢? 有人曾经在 stackoverflow 上提问“如何从 Unity 中注销一个注册项”.对于这个问题,有人的回答是“有趣.你为什么 ...

  9. linux下系统定时任务配置----crontab（mysql定时备份）

    crontab命令用于设置周期性被执行的指令,与windows下的计划任务类似,当安装完成操作系统后,默认会安装此服务工具,并且会自动启动crond进程,crond进程每分钟会定期检查是否有要执行的任 ...

  10. PHP获取函数返回值的引用

    通过在函数前添加&可以获取函数返回值的引用,如:function &test(){return 10;}