向纯 html 文本添加填充

Question

我的网站上有一个小部件，它生成的内容如下所示：

<div class="wrapper">
    some title
    <p>some content</p>
</div>

我想给标题文本填充和 <p> 填充

我已经试过了：

.wrapper > * {padding:15px;}

但这不适用于纯文本。是否有某种纯文本选择器？

我还创建了一个 fiddle 来可视化它。

Answer 1

没有

除了一些非常有限的例外情况（如 :first-letter），CSS 只允许您 select 元素 .

如果你想让一个块有一个标题，那么它可能应该是一个标题（<h1> 等），这会给你一个 select 的元素。就此而言，该块可能更好地表示为 <section> 而不是 <div>.

Answer 2

如果我理解正确，认为你应该对你的包装应用填充，并从 <p>

中删除左右填充

.wrapper > p {
  padding:15px 0px; 
}

.wrapper {
  border:1px solid #ddd;
  padding:15px; 
}

Answer 3

让您的网络浏览器帮助您进行开发。

右键单击元素并select从上下文菜单中检查元素

在源代码中，就在元素上并从上下文菜单中 select 复制 select 或者粘贴您的 css

Adding padding to plain html text