用CSS阻止BR标签打破

Question

有没有办法只使用CSS停止<br>标记？

我试过br{display:none} whick的作品，但它也摆脱了我需要保留的两个单词之间的空间。

这仅适用于webkit（iPhone），因此任何CSS3盛会都可以。

我无法编辑CMS中的内容，因此不幸的是，删除标记不是我的选择。

谢谢！

Answer 1

根据此处的答案，这可以防止Chrome和IE中的<br>代码中断：

br {
    content: " ";
    display: none;
}

Answer 2

好的，经过一些游戏，我找到了一个我将与你分享的解决方案。看来可以用CSS

完全控制<br>标签

button br{content:" ";border:1px solid #fff;background:red;padding:50px;}/* whatever you like */

button br:after{content:" ";}

Html -

<button>the annoying<br/>tag is gone leaving a controlable space</button>

不确定这是如何跨浏览器，但它在Webkit和iPhone中工作，现在我只需要它。

Answer 3

这对我有用：

br {content: ""}
br:after {content: "\00a0"}

Answer 4

为什么不使用：

br {
    content: " "; /* Remove break */
    margin-right: 6px; /* Set space between text blocks */
}

Answer 5

正如博斯在OP的评论中提到的那样，这是不可能的。 <br/>是可见的（在这种情况下，它是一个回车符）或者在这种情况下你不能通过CSS控制它。

这里的根本问题是你正在使用错误的工具 - 你想要改变作为Javascript域的DOM的结构（至少在客户端）。

不需要Javascript或对CMS进行更改的替代方法是设置服务器来代理请求并在<br/>标记通过文档时删除它，但它似乎有点过分

Answer 6

content: " ";
padding-right: 5px; // ok, same as margin-right

Answer 7

见Ignore <br> with CSS?。 其中一个解决方案就是这个（我认为这是最好的解决方案）

br  {
    content: ' '
}
br:after {
    content: ' '
}