css - 将相邻的内联 block 添加到任何内联内容

标签 css

我的目标是在文本 block 旁边提供类似“阅读更多”链接的内容。它是在内容发送到客户端之前自动添加的,包含它的 block 应该与前面的文本相邻,就好像它是这个文本的一部分一样。问题在于文本 block 内容是使用 TinyMCE 创作的,因此内容将被打包在各种标签(主要是段落标签)中 - 因此以下内容将被推送到下一行(或 block )。

因此,在经历解构服务器端文本 block 的内容以决定在何处以及如何附加另一个 block 的痛苦之前,我认为可能有一种方法可以使用纯 CSS 完成此操作。我有一种感觉这是不可能的,因为我认为它需要相邻的 block 来覆盖前一个 block 的属性,但话又说回来,我可能会错过所有这些 CSS/内联业务的一两件事。

我创建了一个 JSFiddle here

感谢您对此事的任何建设性意见!

最佳答案

请看这个 fiddle :http://jsfiddle.net/D2RnS/5/

p + p, .adjacentBlock { float : left; }

我只是向左浮动第二段和相邻的 block 。这样做记得还要对父容器应用某种 float 清除(您的示例中的 <div>)

关于css - 将相邻的内联 block 添加到任何内联内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11054360/

相关文章:

javascript - 如何在列表项上切换事件类?

javascript - 无法点击我网站上的任何链接

css - 根据目标对比度缩放颜色

html - 使用 CSS 和 HTML 内联显示

css - 下面溢出滚动div

css - 下拉列表在单个 HTML 页面中工作但在 Angular 组件中不工作

css - 为什么我的 SCSS @import 不工作?

html css float :right with img is not working fine

html - 尽管其中一部分已经有另一个链接,如何在整个图片上激活一个链接?

javascript - 添加 CSS 类以更改 HTML 元素的样式