フォントのCSS初期設定を62.5%にしてremの計算を簡単に解決する方法 - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
PostCSSでCSSの中の画像URLのcache busteringを行う方法 - Qiita
でもこのままだと、例えば画像の配信で何かしらのキャッシュが設定されていた場合（Cache-ControlのHTTPヘッダーなど）に、画像を変更してもキャッシュが使用されてすぐに変更をクライアント側に反映できない。 そこでcache busteringを行う。URLの末尾に何かしらのクエリーストリングなどを付けて別のURLにすることで、ブラウザーのキャッシュを回避する方法だ。 上のように変更すれば、新しい画像がブラウザーに読み込まれるようになる。 でも画像の変更があるたびにいちいちCSSをいじるのは面倒なので、自動化したい。そこでPostCSSのプラグインであるPostCSS Cachebusterを使ってみる。 導入は簡単に yarn add -D postcss-cachebuster なり npm install --save-dev postcss-cachebuster なりで。
sassでsyntax errorがでたよ - Qiita
Sass::SyntaxError in Messages#index Showing/User/Username/space/application.html.haml whereline #6raised: invalid CSS after"... height32px"::expected"{,was sassで構文エラー出まして、どこの構文かなぁと思っていたら どうやら、インデントが少しづれていたみたい。。。 なので、height等のインデントを揃えてあげると、うまく動いたよ〜〜。 やったね！ Register as a new user and use Qiita more conveniently You get articles that match your needsYou can efficiently read back useful informationWhat
これからはcssはSassで書こう。 - Qiita
Sassってなんだろう。 ・Sass「Syntactically Awesome StyleSheet」 Syntactically ＝ 構文的に Awesome ＝ イケてる StyleSheet ＝ スタイルシート とどのつまり、すごいCSSということでしょうか。ロゴもかっこいい。 詳しく調べてみた ・CSSを拡張したメタ言語 メタ言語とは「ある言語について何らかの記述をするための言語」のこと。 つまりSassの場合は「CSSに対して機能を拡張した言語」ということになります。 CSSをより効率的に書けるようにした言語ということになります。 ・Sass はプログラムっぽく CSS を書く プログラムっぽく書くことでコーディング効率やソースコードの保守性が上がる。 Sassは、関数や変数の処理を行うために「プリプロセッサー」と呼ばれたりもするみたいです。 Sassには書き方が2種類ある！
elm-css で PostCSS も使える CSS in Elm - Qiita
(筆者は今では積極的にはこの手法を使っていません。詳しくは追記をご覧ください。) elm-cssライブラリのCSS生成機能とelm-css-webpack-loaderを用いることで、CSS in Elm のさまざまな恩恵にあずかれます。 はじめに なぜ CSS in Elm が必要か CSS in JS という言葉が、React界隈で使われるようになっていくらか経ちました。 CSS in JS は、本来 CSS で記述するスタイルを JavaScript で書いてしまうことで、名前空間やネスト構造が使えない不便なCSSから解放されることを目的にしています。 Elm で CSS in JS (Elm) を採用することで、従来のCSSによるスタイルにおける以下の問題を解決できます。 a. スタイルの記述が Elm コンポーネントとは別のファイルになって、配布しづらい b. CSS に名前空間
【webpack2対応】俺が作り上げたSCSSのビルド環境を晒す【リントもあるよ】 - Qiita
はじめに もともと業務でscssを使うための環境を作ってたのですが、ちょっと後輩に丸投げしてた目を離した隙にwebpack周りも色々と状況が変わっていたので、これを機に色々調べ直して設定し直したりしました。 やりたかったこと webpackでscssをビルドする jsで出力されるのは困るのでcssで出力する ベンダープレフィックスは自動でつけてほしい -mozとか書きたくない リントチェック欲しいなぁ... まぁ、これはwebpackじゃなくていいか webpack2でのscssのビルド パッケージインストール まずは必要なパッケージを入れましょう。 今回scssのビルドに使ったパッケージは autoprefixer css-loader extract-text-webpack-plugin node-sass postcss-loader precss sass-loader styl
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
vueのnuxxでsassを使用する場合に[Make sure 'options.resources' is String or Array of Strings]とエラーがでる場合 - Qiita![vueのnuxxでsassを使用する場合に[Make sure 'options.resources' is String or Array of Strings]とエラーがでる場合 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/2a2733aea4f938e1693d8625a9fd110bd807dda4/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFtYXpvbmF3cy5jb20lMkYwJTJGMTk2NjElMkZwcm9maWxlLWltYWdlcyUyRjE0NzM2ODI3ODI_aXhsaWI9cmItNC4wLjAmYXI9MSUzQTEmZml0PWNyb3AmbWFzaz1lbGxpcHNlJmZtPXBuZzMyJnM9MTI1YjYzNGU3NDVlYjYyMDI2NDkxNzE3MTkzYjY0MTE%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253D6e2208d2f6888db6fb1ab14523449e50%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9dnVlJUUzJTgxJUFFbnV4eCVFMyU4MSVBN3Nhc3MlRTMlODIlOTIlRTQlQkQlQkYlRTclOTQlQTglRTMlODElOTklRTMlODIlOEIlRTUlQTAlQjQlRTUlOTAlODglRTMlODElQUIlNUJNYWtlJTIwc3VyZSUyMCUyN29wdGlvbnMucmVzb3VyY2VzJTI3JTIwaXMlMjBTdHJpbmclMjBvciUyMEFycmF5JTIwb2YlMjBTdHJpbmdzJTVEJUUyJTgwJUE2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LXBhZD0wJnM9N2M0YjhhZTk1MWU5NjYyMGQyMzg3NDY1MThmNTAwNTc%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBjaG9vc2VyJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LXBhZD0wJnM9ODNlNTI0OTQzYzQxZmI1OTcyOThhYTdjNzE4MzViMzc%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3D66920f50bb1e7b17f6f9e6cd3d9d73e6)
Mac High Sierra に compass をサクッとインストールする方法 - Qiita
hamlにfontawesomeを入れ込む（擬似要素も） - Qiita
Ruby Sass is deprecated and will be unmaintained as of 26 March 2019. - Qiita
Nuxt.js + TypeScript + Sass でプロジェクトをスタートする - Qiita
flexbox 子要素も横に配置されてしまうのはなんで？
Railsでbootstrap_sassを使おう - Qiita
npm-scriptでPostCSS - Qiita
Webpackを使ってSassをビルドする - Qiita
Rails5.1.3でsassとjsの管理をSprocketsからWebpackerに移行した - Qiita
webpack 4入門：PostCSS(AutoPrefixerやcssnano)を使う方法 - Qiita
gulpでSASSを自動コンパイルする - Qiita
Sassでメディアクエリを効率的に管理するマップとmixin - Qiita
SCSSの変数と、CSS3のcalc()を併用するには - Qiita
