CSS禁止文本自动换行代码

在这行文字的td或div属性中，加入

代码如下:

style="word-break : break-all;"

例子

 代码如下 复制代码

<!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=utf-8" />
<title>CSS 禁止自动换行</title>
<style type="text/css">
p {white-space:nowrap}
</style>
</head>
 
<body>
<p>这是禁止了自动换行的文本测试，这是禁止了自动换行的文本测试，这是禁止了自动换行的文本测试，这是禁止了自动换行的文本测试，这是禁止了自动换行的文本测试，这是禁止了自动换行的文本测试，这是禁止了自动换行的文本测试，这是禁止了自动换行的文本测试，这是禁止了自动换行的文本测试，<p>
</body>
</html>

效果如下午

 


下面这个例子可以实现文本只有在遇到空格或者是换行符的时候才能换行，比如：

 代码如下 复制代码

<style type="text/css">
div{width:300px;border:1px solid red;margin:10px;overflow:hidden;}
.nowrap{white-space:nowrap;}
</style>
<div class="nowrap">这是一段很长的文字，中间没有空格，也没有换行，它不会自动换行直到被截取掉</div>
<div>这是一段很长的文字，中间没有空格，也没有换行，但它会自动换行</div>

上面两个div里超宽的文字，第一个里面的被禁止换行，然后超宽的被截取了；第二个不做设置，于是自动换行了

时间： 2024-08-01 17:19:02

CSS禁止文本自动换行代码的相关文章

CSS:CSS控制文本自动换行

1.你定死表格的宽度,即给表格一个宽度值(是数值,不是百分比)   2.强制不换行 div{ //white-space:不换行;normal 默认;nowrap强制在同一行内显示所有文本,直到文本结束或者遭遇 br 对象 white-space:nowrap; } 自动换行 div{ word-wrap: break-word; //word-break设置强行换行;normal 亚洲语言和非亚洲语言的文本规则,允许在字内换行 word-break: normal; } 强制英文单词断行 di

css禁止鼠标选择文本代码

2.用css禁止鼠标选择文本  代码如下 复制代码 firefox浏览器: body{-moz-user-select:none;} webkit浏览器(chrome): body{-webkit-text-size-adjust:none} 关于IE还没有找到到相关的css办法

英文文本自动换行的css代码

<body style="direction: ltr;" leftmargin="2" topmargin="0" oncontextmenu="return false" ondragstart="return false" onselectstart="return false" onselect="document.selection.empty()"

JS禁止选中文本，复制文本的代码

JS禁止选中文本,复制文本的代码 IE下有onselectstart这个方法,通过设置这个方法可以禁止元素文本被选取.而firefox下没有这个方法,但可以通过css教程或一种变通的办法解决: if (typeof(element.onselectstart) != "undefined") {            // IE下禁止元素被选取            element.onselectstart = new Function("return false"

怎么让css不自动换行代码

浮动层加margin后换行的例子: 比如说有个DIV宽度为380px,它里面有一个菜单列表,每个宽度为60px,margin-right为20px.如果就按照下面的HTML结构来做的话,那么这个菜单列表能在这个DIV里一行显示完整吗? <div>      <div>mb5u1</div>      <div>mb5u2</div>      <div>mb5u3</div>      <div>mb5u4&l

js 限制文本框只能输入数字 汉字 字母与禁止输空格代码

1.文本框只能输入数字代码(小数点也不能输入)  代码如下 复制代码     <input onkeyup="this.value=this.value.replace(/D/g,'')" onafterpaste="this.value=this.value.replace(/D/g,'')"> 2.只能输入数字,能输小数点.  代码如下 复制代码     <input onkeyup="if(isNaN(value))execComm

文本超过div 自动换行代码

文本超过div 自动换行代码文本自动换行IE中解决方法: word-wrap:break-word; word-break:break-all; 注:在要换行的内容相应的单元格或者DIV里加入,如: <div style=word-wrap:break-word;></div>或<td style=word-wrap:break-word;></td> 文本自动换行FireFox中解决方法(脚本): <script type="text/ja

详细学习网页制作技术CSS的文本属性

css|网页 文本(Text)属性: 这里的属性将影响WEB文档中的文本显示情况. text-indent属性描述文本的缩进程度: 属性名称: 'text-indent'属性值: <length> | <percentage>初始值: 0适合对象: 容器元素是否继承: yes百分比备注: 根据父元素的宽度而定 下面的例子表明段落的缩进值为3em: P { text-indent: 3em } Alignment属性表明文本的对齐方式: 属性名称: 'alignment'属性值: l

html禁止文本框输入

 禁止文本框输入的几个常用标签input中有几个属性,分别是readonly.disabled.autocomplete,下面还是来看看这几个标签的使用. 一.html禁止input文本框输入 readonly 属性规定输入字段为只读.只读字段是不能修改的.不过,用户仍然可以使用tab键切换到该字段,还可以选中或拷贝其文本. <input readonly="readonly" value="xxxx"/> 加入type="text属性的代码编