Jquery &引用;“自动换行”;保释金中的安利
我想将一些文本包装到我在LI中保存的下一行,包装需要动态完成,所以我希望使用CSS 我希望它看起来像这样:Jquery &引用;“自动换行”;保释金中的安利,jquery,html,css,Jquery,Html,Css,我想将一些文本包装到我在LI中保存的下一行,包装需要动态完成,所以我希望使用CSS 我希望它看起来像这样: <ul> <li> normal sized </li> <li> big massive long one that i'd like to wrap to the next line like below </li> <li> the result that i'd
<ul>
<li> normal sized </li>
<li> big massive long one that i'd like to wrap to the next line like below </li>
<li> the result that
i'd like to see </li>
</ul>
- 正常尺寸
- 大的,大的,大的,长的,我想包装到下一行,如下图所示
- 结果
我想看看
我不想要任何滚动条,我也不想让它离开页面,在CSS中设置UL或LI的宽度似乎对我不合适。有什么想法吗?我肯定我遗漏了一些琐碎的东西
谢谢
编辑:我尝试过这些解决方案,但运气不好——靠它们自己,效果很好。所以我必须得出结论,问题出在我使用的jQuery代码中的某个地方。(使用名为jqueryFileTree的插件)。代码会调出一个文件名,因此可能会出现断行的问题设置
ul
元素的宽度就可以了。我用你的基本例子试过了,它在FF3中有效,即5.5-8
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>test</title>
<style type="text/css" media="screen">
ul {
width: 80px;
}
</style>
</head>
<body>
<ul>
<li> normal sized </li>
<li> big massive long one that i'd like to wrap to the next line like below </li>
<li> the result that i'd like to see </li>
</ul>
</body>
</html>
测验
保险商实验室{
宽度:80px;
}
- 正常尺寸
- 大的,大的,大的,长的,我想包装到下一行,如下图所示
- 我想看到的结果
当文本到达视口末端(“浏览器中的查看区域”)或其指定宽度的元素末端时,文本将自行包装,而不应用CSS。这适用于所有元素,只要它们最初不是绝对位于视口之外
我必须说,我想知道您是如何使文本超出视图或UL/LI的宽度的。您是如何设置元素的宽度的 以下操作将不起作用:
<ul width="100">
<li>Normal Sized</li>
<li>Big massive long one that I'd like to wrap to the next line</li>
<li>The result I'd like to see</li>
</ul>
- 正常尺寸
- 大的,大的,大的,长的,我想包装到下一行
- 我想看看结果
您需要在CSS或标记的style属性中设置宽度:
<ul style="width: 100px;">
<li>Normal Sized</li>
<li>Big massive long one that I'd like to wrap to the next line</li>
<li>The result I'd like to see</li>
</ul>
- 正常尺寸
- 大的,大的,大的,长的,我想包装到下一行
- 我想看看结果
或者您可以创建css类,而不是为页面上的每个ul设置宽度:
<style type="text/css" media="screen">
.smallList {
width: 100px;
}
</style>
<ul class="smallList">
<li>Normal Sized</li>
<li>Big massive long one that I'd like to wrap to the next line</li>
<li>The result I'd like to see</li>
</ul>
.小名单{
宽度:100px;
}
- 正常尺寸
- 大的,大的,大的,长的,我想包装到下一行
- 我想看看结果
您能否提供更多的上下文来了解您正在经历的情况?浏览器,也许更多的代码?你的意思是也有缩进吗?这基本上是不可能的/不是x-browser/如果需要JS或额外的标记。我相信你的意思是.smallList而不是你风格中的#smallList。