タグ付けされた質問 「less」

レス私は（使用していることをコンパイラOrangeBitsとドットなし1.3.0.5は）積極的に翻訳しています body { width: calc(100% - 250px - 1.5em); } に body { width: calc(-151.5%); } これは明らかに望ましくありません。Lessコンパイラーに信号を送って、コンパイル中に属性を本質的に無視する方法があるかどうか疑問に思っています。Lessのドキュメントと両方のコンパイラのドキュメントを検索しましたが、何も見つかりませんでした。 LessまたはLessコンパイラはこれをサポートしていますか？ そうでない場合、CSSエクステンダーはありますか？

336 css  compilation  less  css-calc 

休業。この質問は意見に基づいています。現在、回答を受け付けていません。 この質問を改善してみませんか？この投稿を編集して、事実と引用で回答できるように質問を更新してください。 6年前休業。 この質問を改善する 私はLESSを使用してBootstrap 2.0.3で作業しています。大幅にカスタマイズしたいのですが、ライブラリへの変更は頻繁に行われるため、可能な限りソースを変更しないようにしたいと考えています。私はLESSを初めて使用するので、コンパイルが完全にどのように機能するかわかりません。LESSまたはLESSベースのフレームワークを使用するためのベストプラクティスは何ですか？

285 twitter-bootstrap  less 

.cssファイルを.lessファイルにインポートできますか？ lessにはかなり慣れているので、すべての開発に使用しています。私は次のような構造を定期的に使用しています。 @import "normalize"; //styles here @import "mixins"; @import "media-queries"; @import "print"; すべてのインポートは他の.lessファイルであり、すべて正常に機能します。 私の現在の問題は次のとおりです。次のように、.cssファイルで使用されるスタイルを参照する.lessに.cssファイルをインポートします。 @import "../style.css"; .small { font-size:60%; .type; } // other styles here .cssファイルには呼び出されるクラス.typeが含まれていますが、.lessファイルをコンパイルしようとするとエラーが発生しますNameError: .type is undefined .lessファイルは.cssファイルをインポートせず、他の.lessファイルのみをインポートしますか？それとも私はそれを間違って参照していますか...？！

228 css  import  less 

LESSを使用すると、色変数の彩度または色合いを変更できることがわかります。これは次のようになります。 background: lighten(@blue, 20%); ただし、色のアルファ不透明度を変更したいのですが。できればこのように： background: alpha(@blue, 20%); LESSでこれを行う簡単な方法はありますか？

171 css  variables  less  opacity  alpha 

私は次のコードを持っています： @color : #d14836; .stripes span { -webkit-background-size: 30px 30px; -moz-background-size: 30px 30px; background-size: 30px 30px; background-image: -webkit-gradient(linear, left top, right bottom, color-stop(.25, rgba(209, 72, 54, 1)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(209, 72, 54, 1)), color-stop(.75, rgba(209, 72, 54, 1)), color-stop(.75, transparent), to(transparent)); に変換@colorする必要がありrgba(209, 72, 54, 1)ます。 したがってrgba(209, 72, …

131 css  less 

これは無理だと思いますが、道があればお願いしたいと思いました。アイデアは私がウェブリソースフォルダへのパスの変数を持っているということです： @root: "../img/"; @file: "test.css"; @url: @root@file; .px { background-image: url(@url); } 結果としてこれが得られます： .px { background-image: url("../img/" "test.css"); } しかし、私は文字列を次のように1つの文字列に結合したいと思います。 .px { background-image: url("../img/test.css"); } Lessで文字列を連結することは可能ですか？

129 css  path  web  less  concat 

とにかく、LESSの出力に直接の子セレクター（>）を適用させる方法はありますか？ 私のスタイルでは、以下のようなものを書きたいです： .panel { ... > .control { ... } } そしてLESSに次のようなものを生成させます： .panel > .control { ... }

112 css  css-selectors  less 

以前にLESS.jsを使用したことがあります。使いやすいです。 <link rel="stylesheet/less" href="main.less" type="text/css"> <script src="less.js" type="text/javascript"></script> SASS.jsを見ました。どうすれば同じように使用できますか？SASSファイルを解析して、HTMLですぐに使用できます。SASS.jsはNode.jsで使用するためのもののようですか？ var sass = require('sass') sass.render('... string of sass ...') // => '... string of css ...' sass.collect('... string of sass ...') // => { selectors: [...], variables: { ... }, mixins: { ... }}

112 css  sass  less 

を使用してfont-awesome 4.0.3アイコンをインストールしましたnpm install。 node-modulesから使用する必要がある場合、htmlファイルでどのように使用すればよいですか？ lessファイルを編集する必要がある場合、node-modulesで編集する必要がありますか？

111 css  node.js  less  npm  font-awesome 

Twitter Bootstrapを使用したいのですが、特定の要素でのみ使用するため、すべてのTwitter Bootstrapクラスに接頭辞を付ける方法を見つける必要があります。または、少ないミックスインを使用します。私はまだこれを経験していないので、これを行う方法がよくわかりません。以下は、スタイルを設定しようとしているHTMLの例です。 <div class="normal-styles"> <h1>dont style this with bootstrap</h1> <div class="bootstrap-styles"> <h1>use bootstrap</h1> </div> </div> この例では、Twitter Bootstrapは両方h1のスタイルを通常のスタイルにしますが、Twitter Bootstrapスタイルを適用する領域をより選択したいと思います。

106 twitter-bootstrap  less 

CSSを改善するためにLESSを使用しており、クラスをクラス内にネストしようとしています。かなり複雑な階層がありますが、何らかの理由で私の入れ子が機能しません。私はこれを持っています： .g { float: left; color: #323a13; .border(1px,#afc945); .gradient(#afc945, #c8da64); .common; span { .my-span; .border-dashed(1px,rgba(255,255,255,0.3)); } .posted { .my-posted; span { border: none; } } } 動作しません.g.posted。それは単に.gビットを示しています。私がこれをするならそれは大丈夫です： .g { float: left; color: #323a13; .border(1px,#afc945); .gradient(#afc945, #c8da64); .common; span { .my-span; .border-dashed(1px,rgba(255,255,255,0.3)); } } .g.posted { .my-posted; span { border: none; …

101 css  nested  less 

一部の要素の幅をパーセントからピクセルまで計算するため、LESSとcalc（）を使用してマイナス-10pxにします。それが可能だ？ div { span { width:calc(100% - 10px); } } CSS3を使用しているcalc()ため、機能しません。calc(100% - 10px) 例： 100％= 500px、つまり幅= 490px（500-10）の場合。 私はテストのためにデモを作りました：http : //jsfiddle.net/4DujZ/55/ だからパディングは言うでしょう：私がリサイズするときはいつも5（10px / 2）。 LESSで実行できますか？私はjQueryとマージンパディングなどの簡単なCSSで行う方法を知っています...しかし、私はLESSで機能的にしようとしますcalc()

100 css  less  pixel 

SASSには、@extendセレクターが別のセレクターのプロパティを継承できるという機能がありますが、（ミックスインのように）プロパティはコピーされません。 LESSにもこの機能がありますか？

93 css  sass  less  extend 

VS <= 2015では、less / sassファイルのコンパイルを処理するWebEssentials拡張機能を使用できますが、現在はVS2017をサポートしていません。ビルド時にless / sassをコンパイルできる同様の拡張機能をご存知ですか？

85 visual-studio  sass  less  visual-studio-2017  css-preprocessor 

いくつかのcss-class内で、lessを使用してさまざまな解像度のcss-stylesをラップすると便利です。 私は次のようなことをしたいと思います： footer { width: 100%; } .tablet { footer { width: 768px; } } .desktop { footer { width: 940px; } } 最後に、次のような結果になるはずです。 footer { width: 100%; } @media screen and (min-width: 768px) { footer { width: 768px; } } @media screen and (min-width: 992px) { footer { width: …

82 css  responsive-design  less  media-queries