1

CODA2 を使用して SCSS ファイルを作成し、SCOUT も使用して CSS にコンパイルしています。

私は SCSS を使い始めたばかりで、それはすばらしいと思います。もっと早く調べておくべきでした。とにかく、SCSS の各セットを CODA でコンパイルすると、style.css に、元の SCSS が作成された場所を示す一連のコメントが追加されます。

例えば

/* line 111, ../sass/_block-elements.scss */

また、ネスティングを行うとき、それが正しい方法かどうかはわかりませんが、少し長くなる可能性があると思います。

もう一度、私が手配したコードは次のとおりです。

section.callouts{
.wrapper{
    text-align: center;
    margin: $center;
    width:95%;
        .about, .menu, .contact, .timetable, .social{
            float: left;
            width: 230px;
            margin: 0 $callout-padding 0 $callout-padding;
                .callout-info{
                    background-color: $white;
                    @include rounded-bottom-left;
                    @include rounded-bottom-right;
                    padding: $small-padding;
                }

私は SCSS のロープを拾ったばかりなので、少し「生」のように見えます。

4

2 に答える 2

1

すべての本番 CSS は縮小する必要があります。これは、ユーザーに提供するコンパイル済みコードに空白や (理想的には) コメントがないことを意味します。

.scss必要に応じてファイルを構成Productionし、出荷の準備ができたら Scout アプリで環境を設定します。Sass は出力された CSS を縮小し、行番号のコメントを含めず、コメントを削除します//。

于 2013-01-25T01:14:42.957 に答える
0

SCSS のルールを次に示します。

ネスティング: ネスティングが行うことは、基本的に、ネスティングの深さと同じ数の単語をセレクターに作成することです。@extends とネストを混在させると、これらのセレクターは簡単に 30kb に達する可能性があります。誇張ではありません。私の会社は、すべての初心者が、HTML で見た構造であるという理由だけで、物事を入れ子にする狂ったようにネストすることに直面しました。

ネスティングを 3 レベルに維持し、中断し、より深くなった場合は新しいネスティング チェーンを開始するか、作業する新しいチャンクがあります。最初にグローバルを定義する必要があります。通常の CSS と同様に、ドロップ シャドウでボックスを赤くするためだけに同じコードを書き直す必要はありません。ミックスインを試してみてください！

Ps あなたは一度も質問したことがありません... あなたの投稿には疑問符が 1 つもありません :P

于 2013-04-09T15:11:50.857 に答える