预标记 - 文本溢出框
Mr_*_*s_D 5 html css tags text pre
我已将以下样式应用于该pre元素：
pre {
background-color: #FFFFCC;
border: 2px dashed #FF6666;
padding-top: 7px;
padding-bottom: 8px;
padding-left: 10px;
float: none;
padding-right: 10px;
margin: 10px;
}文本溢出框。当我应用该float:right属性时，盒子的行为符合预期，但在大屏幕中，其余部分自然地漂浮在盒子周围。不开心。EDIT2：我用float+clear做到了（但对于ie6）。我已经发布了关于新错误的另一个问题
我是 CSS 和 HTML 新手 - 我确信有一个简单的解决方案。请帮忙。:(
编辑：更接近标记：
pre {
background-color: #FFFFCC;
border: 2px dashed #FF6666;
padding-top: 7px;
padding-bottom: 8px;
padding-left: 10px;
padding-right: 10px;
margin: 10px;
white-space: pre-wrap;
}这个在 ie6 中完全按照我想要的方式显示 - 在 ff 3.5 中文本换行 - 我知道这应该是这样 - 但我怎样才能将 ie 行为传递给 ff ？
带有样式的预标记的图像white-space: pre;
ie6：https://i1032.photobucket.com/albums/a406/dardanov/ie6pre.jpg
FF 3.5：https://i1032.photobucket.com/albums/a406/dardanov/ff35pre.jpg
对于white-space: pre-wrap;firefox 来说，换行和 ie 保持不变。如何在 ff 中获得 ie 行为（代码框的自动扩展）？
EDIT2：参见下面的答案
我成功了（ff 3.5、opera 10、ie8 但不是 ie6（ie7 未测试））
我将不同的部分包装在 div 标签中，样式如下所示 - 在 ie6 中，div 以较小的宽度显示（当它们包含 h3 标签时），前置标签不受影响。在其他浏览器中，div 会随着页面缩小 - 而 pre 标签也不受影响。我遇到的另一个小问题是右边界没有显示在预标记中。我已经发布了关于这些的另一个问题
所以html的结构是：
<html>
<head></head>
<body>
<div>...</div> //this div is ok in ie
<div><h3>Title...</h3>...</div> //this div is shrunken
...
<div><h3>Title...</h3>...</div> //this div is shrunken
<pre></pre>
<div><h3>Title...</h3>...</div> //this div is shrunken
...
<div><h3>Title...</h3>...</div> //this div is shrunken
</body>
<html>
样式为：
pre {
background-color: #FFFFCC;
border: 2px dashed #FF6666;
padding-top: 7px;
padding-bottom: 8px;
padding-left: 10px;
margin: 10px;
float: left;
padding-right: 10px;
clear: both;
}
div {
float: left;
clear: both;
}
| 归档时间： |
|
| 查看次数： |
8894 次 |
| 最近记录： |