我想要全部为空<p>
html 中的元素内部有换行符,并使用 css 来实现此效果。
详细信息:
p
两者下面的标签应具有相同的外观(跨浏览器和缩放级别)
p
的所有其他定制样式标签相同
p:empty {
/** How can I code here (or some other way css codes can achieve this) **/
}
<p><br></p>
<p></p>
背景:我想在prosemirror编辑器中显示编辑内容的预览,而编辑器不保留<br>
里面<p>
当将内容序列化为json
时并使其在从 json
渲染预览时看起来有所不同。请参阅:discuss.prosemirror
最佳答案
有多种方法可以做到这一点,以下是如何使用您自己的代码背后的相同逻辑,只需在内容后添加一个空格 Unicode 即可:
p:empty:after {
content: '\00a0';
}
p {
outline: 1px solid red;
}
<p><br></p>
<p></p>
演示:
console.log(document.getElementById("first").offsetHeight)
console.log(document.getElementById("second").offsetHeight)
p:empty:after {
content: '\00a0';
}
p {
outline: 1px solid red;
}
<p id="first"><br></p>
<p id="second"></p>
关于html - 如何使用css实现与目标元素内有 <br> 相同的效果?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62717299/