我可以防止div块中的文本溢出吗?
我可以防止div块中的文本溢出吗?
如果你想div中的溢出文本自动换行,而不是隐藏或滚动条,使用
word-wrap: break-word
属性。
你可以试试:
<div id="myDiv"> stuff </div> #myDiv { overflow:hidden; }
查看溢出属性的文档以获取更多信息。
您可以使用CSS属性文本溢出截断长文本。
<div id="greetings"> Hello universe! </div> #greetings { width: 100px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; // This is where the magic happens }
参考: http : //makandracards.com/makandra/5883-use-css-text-overflow-to-truncate-long-texts
你可以用CSS控制它,有几个选项:
- 隐藏 – >所有文本溢出将被隐藏。
- 可见 – >让文本溢出可见。
- 滚动 – >把滚动条,如果文本溢出
希望能帮助到你。
还有另一个CSS属性:
white-space : normal;
空白属性控制文本如何处理它应用到的元素。
div { /* This is the default, you don't need to explicitly declare it unless overriding another declaration */ white-space: normal; }
简单地使用这个:
white-space: pre-wrap; /* CSS3 */ white-space: -moz-pre-wrap; /* Firefox */ white-space: -pre-wrap; /* Opera <7 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* IE */
尝试添加这个类来解决这个问题:
.ellipsis { text-overflow: ellipsis; /* Required for text-overflow to do anything */ white-space: nowrap; overflow: hidden; }
在此链接中进一步解释http://css-tricks.com/almanac/properties/t/text-overflow/
overflow: scroll
? 或自动。 在style属性中。
.NonOverflow { width: 200px; /* Need the width for this to work */ overflow: hidden; } <div class="NonOverflow"> Long Text </div>
你可以在CSS中设置最小宽度,例如:
.someClass{min-width: 980px;}
它不会中断,但你仍然有滚动条来处理。
是。 你可以使用CSS – 你可以使用一堆值
http://www.w3schools.com/Css/pr_pos_overflow.asp
inkedmm是正确的,这可能是你想要的行为,但你应该确定是否是这样的情况。
如果你的div在CSS中有一个设定的高度,将导致它溢出的div。
你可以给div一个最小高度,如果你需要在div上保持最小的高度。
最小高度在IE6中不起作用,如果你有一个IE6特定的样式表,你可以给它一个IE6的常规高度。 根据IE6中的内容在IE6中改变高度。