Sass

Sassは、プログラミング風のコードでCSSを生成できるスタイルシート言語です。 scss ファイルを、変換(コンパイル)してCSSファイルを作成します。

RSS

  • 受付中

    回答
    1

    flagSCSS使って入れ子でBEMルールに沿って書いた場合にうまくいかない時がある

    ハンバーガーメニューとかで、.isOpenedでスタイルを変えるときにハマりました。 ボタンに.isOpenedをつけて中のスタイル変えたいけど、 どうやって途中のtogglerまで戻れば良いのかわからない。 .navbar { &-toggler { &.isOpened { 〜 } &-bar {

    • 0評価
    • 326PV
    kumakuma112 kumakuma112 3時間前に コメント
  • 受付中

    回答
    1

    css設計について【BEM】

    お世話になります。 現在BEMを勉強しており練習のため下記を作成しましたが、なんだか冗長的になってしまいました。 下記コードををBEMを用いて記述したい場合、皆さんならどうされますでしょうか? ご意見いただきたいです。 <header class="header"> <h1 class="header__logo">ロゴが入ります。</h

    • 0評価
    • 166PV
    Lhankor_Mhy Lhankor_Mhy 2日前に コメント
  • 受付中

    回答
    0

    sassc-railsでの、Bootstrapのコンパイル(端数処理)がうまくいかない

    前提・実現したいこと Bootstrapを、CDN経由のからsassc-railsで処理したバージョンに切り替えようとしたのですが、1ピクセルずれるなど、見栄えが崩れてしまう箇所が多発してしまいました。 正しく動作するようにsassc-railsで処理したいです。 発生している問題・エラーメッセージ line-height: 1.42857と、小数5

    • 1評価
    • 47PV
    teratailが1週間前に アップデート
  • 解決済

    回答
    1

    nodejsのcompassを実行するとsassがcssにコンパイルできるのはどうしてでしょうか。

    仕組みがよくわかりません。 npm run watchやnpm run buildでコンパイルできるのはどうしてでしょうか。

    • 0評価
    • 375PV
    fewebuser fewebuser 2週間前に コメント
  • 受付中

    回答
    0

    webpack.config.jsのentryのところにcssとsassのファイルのパスを書いただけ...

    ふと疑問に思ったので質問しました。 よろしくお願いします。

    • 0評価
    • 159PV
    teratailが3週間前に アップデート
  • 解決済

    回答
    1

    文章の下線の長さについて

    ご質問失礼します。 下線の長さをいっぱいに伸ばしたいのですが、ご教示いただければ幸いです。 <section id="news" class="news"> <div class="container"> <div class="section-header">

    • 0評価
    • 71PV
    uzuki uzuki 3週間前に 質問を編集
  • 解決済

    回答
    1

    画像を重ねて表示させることについて

    ご質問失礼します。 地図の画像を重ねて上に表示させたいのですが、ご教示いただければ幸いです。 マイナスマージンとz-indexwを試したのですが、上手くいきません。 地図が青い画像の下に潜っているので、地図を上に表示させたいのです。 <section id="access" class="access"> <div cl

    • 0評価
    • 366PV
    uzuki uzuki 3週間前に 質問を編集
  • 解決済

    回答
    2

    SASS(CSS)から画像を読み込めない

    解決したいこと sassで画像が上手く読み込まれません。 .sorting background-image: url("images/sort_both.png") .sorting_asc background-image: url("images/sort_asc.png") .sorting_desc bac

    • 0評価
    • 143PV
    orange377 orange377 3週間前に コメント
  • 受付中

    回答
    1

    node.jsを用いたsassファイルのコンパイル

    node-sass sass/style.scss style.css でコンパイルできますよね? しかし、npm run buildでもコンパイルできると聞きました。 これは同じ仕組みでコンパイルされているのでしょうか。 どちらのコマンドでも問題ないのでしょうか。

    • 0評価
    • 68PV
    miyabi-sun miyabi-sun 4週間前に コメント
  • 受付中

    回答
    0

    WebpackでのSassコンパイルで「Invalid CSS after "module.expo...

    Webpackを介しSass(scss)のコンパイルをしようとすると 「Invalid CSS after "module.exports": expected "{", was '= "data:text/x-scss' in /Applications/MAMP/htdocs/〜〜〜パス名/style.scss」

    • 0評価
    • 347PV
    msysmsys msysmsys 1ヶ月前に 質問を編集
  • 解決済

    回答
    1

    gulpが(多分)インストールできたのに、gulp: command not foundと言われるの...

    前提・実現したいこと 過去のこちらの質問(https://teratail.com/questions/13378)についての質問になります。 同じ内容で困っておりまして、gulpをインストールできてるはずなのに、「gulp: command not found」なることを解決したい。 発生している問題・エラーメッセージ ベストアンサーでraccyさんが

    • 0評価
    • 82PV
    ayatori ayatori 1ヶ月前に ベストアンサー
  • 受付中

    回答
    1

    center-clockがきかない?

    前提・実現したいこと 夜遅くに失礼します。bootsrapのサイトをみてbootstrapを勉強しながらbootstrapをやっています。 center-blockでdivタグを中央に配置できるとききましたが、試してもできませんでした。jsをロードしてますが、そこではエラーは出ていません。どんなエラーで実行ができていないんですか? よろしくお願いします。

    • 0評価
    • 71PV
    s8_chu s8_chu 1ヶ月前に コメント
  • 解決済

    回答
    1

    Sassで複数行のmapを書きたい

    Sassで複数行のmapを書きたい Sassでmapを使うコードを書いています。 SCSSでは、下記のようにmapを使うことが出来ました。 $sizes: ( picture-01-width: 12px, picture-01-height: 20px, picture-02-width: 12px, picture-02-heig

    • 0評価
    • 118PV
    agnostic.-_ agnostic.-_ 1ヶ月前に コメント
  • 受付中

    回答
    1

    Sassの桁数ズレについて

    前提・実現したいこと デベロッパーツールで、Sassの桁数がズレて表示されます。 Chromeやfirefoxを最新バージョンにしたのですが駄目でした。 ずっとズレているため、いちいち要素を検索して使用しているので かなり不便で困っております。 どうぞよろしくお願いいたします。

    • 0評価
    • 68PV
    nome nome 1ヶ月前に コメント
  • 解決済

    回答
    1

    Sierra へ sass をインストールするには?

    前提・実現したいこと Mac Sierra 10.12.6 を使用しています。 Gulp で sass(scss)のコンパイルを行いたく、ターミナルより sass のインストールを試みたものの、 エラーによりインストールできません。 エラーの詳細 sudo gem install sassにて下記エラーが発生します。 YAML safe load

    • 0評価
    • 188PV
    simesava simesava 1ヶ月前に ベストアンサー
  • 受付中

    回答
    0

    Sassにて、@media queryをimportでまとめたいのですがうまくいきません…

    Sassで全体を書いたのち、レスポンシブを行おうとしています。 メインのsassフィルにて下記のように定義し、 //---------- media Query --------------// // デバイス定義 $type: sp tb pc; // media-query.scssをインポート @import "media_query"; //

    • 0評価
    • 107PV
    teratailが1ヶ月前に アップデート
  • 解決済

    回答
    1

    【gulp、javascript】gulpfile.js をスマートな記述にしたい+間違えてる部分を...

    こんにちは。 gulpについて勉強しております。 色々なサイトを参考に、下記gulpfile.jsファイルを作成しましたが、 こちらは正しいでしょうか?もっとスマートな書き方がありますでしょうか? (一応希望している処理は実行されます。) //変数の宣言 var gulp = require('gulp'); //gulpを呼び出し使えるように。 v

    • 0評価
    • 335PV
    miyabi-sun miyabi-sun 1ヶ月前に ベストアンサー
  • 受付中

    回答
    3

    scssが読み込まれない

    RailsでWEBアプリケーションを作り、rsils g controller home topでホーム画面を作成してルーティングをget "/" => "home#top"と書き、application.html.erb,application.css, top.html.erb、home.scssを一つずつ書いただけなのですがhome.scssが動作しま

    • 0評価
    • 376PV
    naoya.n naoya.n 1ヶ月前に コメント
  • 解決済

    回答
    1

    【Mac HIGH Serria】Sublimetext3でビルドするとshプロセスで高負荷になる

    前提・実現したいこと Sublimetextを使用し、Scssをcssにコンパイルしたい 発生している問題・エラーメッセージ Macbookair2011にてsublimetext3を使用し、compassでscssをbuildする 正常にcssファイルがコンパイルされる その後、Macが異常発熱&高回転でファンが回り出す アクティビティモニタで確認する

    • 0評価
    • 80PV
    ponta_ito ponta_ito 1ヶ月前に ベストアンサー
  • 受付中

    回答
    0

    SCSS(SASS)でCSSを出力した際に二重に出力される

    発生している問題・エラーメッセージ SCSSでCSSを出力した際に同じセレクタが二重に出力されるため、この事象を解消したいです。 現在、for文,mixinを利用してmarginを指定する汎用的なセレクタの作成をしているのですが、CSSに出力した際に同じセレクタが二重に出力されてしまいます。 //最初の出力 .u-mt1 { margin-top

    • 0評価
    • 518PV
    teratailが1ヶ月前に アップデート
1

タグ情報

  • あなたの順位

    -

  • タグ登録者数

    245

  • 総質問数

    177

  • 今週の質問数

    1

関連するタグ

Sassタグのよく見られている質問

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る