1

<pre>今天在设计标签时遇到了一些问题。

<div class="content">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 
    <pre>
        .wrapper {
            width: 100%;
            color: $orange;
        }
    </pre> 
    Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>

pre {
    @include mono;
    color: $light-grey;
    background-color: $orange;
    padding-top: 1em;
    margin: 15px 0 15px 0;
    width: 585px;
    @include box-sizing(border-box);
}

SCSS 变量和 mixin 都是不言自明的。这是输出：

橙色盒子是<pre>，米色盒子是<div class="content">，外橙色盒子是<body>。

我不知道为什么会出现这种行为。根本没有应用填充。

谢谢你们的帮助！

4

1 回答 1

2

我认为您在 HTML 源文件中看到了空白……您需要在<pre>标记中回显您的代码片段之前（以一种聪明的方式）将其剥离。

小提琴演示：http: //jsfiddle.net/audetwebdesign/teYjW/

于 2013-07-31T15:16:14.510 回答