无涯教程网

仅使用 css 的换行符(如
)

发布于06月07日

在纯css中，也就是不添加额外的html标记的情况下，是否有可能生成<br>这样的换行符？我希望在<h4>元素之后换行，但不是在以下元素之前:

HTML

<li>
  Text, text, text, text, text. <h4>Sub header</h4>
  Text, text, text, text, text.
</li>

CSS

h4 {
  display: inline;
}

我发现了很多这样的问题，但总是有像"use display: block;"这样的答案，这是我做不到的，因为<h4>必须保持在同一条线上.

推荐答案

它的工作原理是这样的:

h4 {
    display:inline;
}
h4:after {
    content:"\a";
    white-space: pre;
}

示例:http://jsfiddle.net/Bb2d7/

诀窍来自这里:https://stackoverflow.com/a/66000/509752(更多解释)

Css相关问答推荐

以百分比形式输入的css宽度属性不会生效

Primeng Angular更改p-dialog背景 colored颜色

如何在 VS Code 中获得 JavaFX CSS 属性的自动完成功能？

使用 mixin 在 SCSS 中进行媒体查询

CSS 仅过渡背景 colored颜色

为什么这个绝对定位的：：after 伪元素会崩溃，除非父级有过滤器？

如何在流线型多页面应用程序中在表情符号和页面名称之间留出一些空白

整个列的 CSS Grid Margin Top

预期失败时使用toHaveStyle进行测试

AngularJS Graphs & Charts - 实线和虚线的混合

基于内容显示(show)/隐藏(hide)同级div

在 vuetify 中跨 `default.vue` 和 `index.vue` 维护网格系统

使用css水平+垂直翻转/镜像图像

包装器内两个跨度之一上的文本溢出省略号

使用 CSS3 生成重复的六边形图案

在CSS中将文本和 Select 框对齐到相同的宽度？

通过javascript删除或禁用浏览器的焦点边框

如何从标题中删除粗体？

使用：focus 设置外部 div 的样式？

在 CSS 中使用多个 @font-face 规则

实用课程推荐

相关教程推荐