Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                

タグ

関連タグで絞り込む (4)

タグの絞り込みを解除

Sassに関するmirutoのブックマーク (5)

  • イマドキのコーダー環境構築2016

    CSS Nite LP47 Coder's High 2016 http://cssnite.jp/lp/lp47 「イマドキのコーダー環境構築」で発表したスライドです。 ※スライド上のURLリンクは効かないので、下部文字起こしから飛んでください。Read less

    イマドキのコーダー環境構築2016

  • Sass 3.3で追加された「&」の新機能と@at-rootまとめ解説

    Sass 3.3で追加された「&」の新機能と@at-rootまとめ解説 上村 光星 10月12日にSass 3.3.0.rc.1が出ました。まだリリース候補ですが、どのような機能が追加されるのかはChangelogにあります。今回は「&」と@at-rootについて解説します。 HTML+CSSの命名規則にBEM方法論、もしくはHTML+CSS向けに派生したMindBEMdingを取り入れる方が増えてきているようです（筆者は使っていませんが…）。「&」の新機能と@at-rootは、このBEMのためといっても過言ではありません。 Sass 3.2の「&」 「&」は親セレクタを参照する特別なキーワードとして、Sass 3.3よりも前からありましたが、擬似クラスや擬似要素、セレクタの連結など、用途が限られていました。 // Sass 3.3よりも前の「&」の用途の例 .foo { &:hover

    Sass 3.3で追加された「&」の新機能と@at-rootまとめ解説
    miruto
    miruto 2016/02/24
    リンク

  • CSS(Sass)でレーティング評価の星(★)を表現する方法 - Design Color

    仕上がりイメージ 表現したいのは以下のような５つ星のレーティング評価です。食べログやAppStoreなどのレビューでよく見かけますよね。星の数は0.5きざみで推移します。 このレーティング、スプライト画像で実装すると評価ごとにバージョンを量産する必要があったりと少し面倒です。しかも、やっぱり後から星の大きさや色を変えたい！なんてなった時にまた画像を作り直すのはさらに面倒。今回は、そんな手間を解決してくれたCSSでの実装方法を紹介します。 実装方法は以下の記事を参考にさせていただきました。本当にありがとうございます〜！こちらの記事では実際にスライダーを動かして星の数を操作することができるため、イメージがつかみやすいですよ！ CSS(Sass)での実装方法 以下が実装用のコードです！初めてCodepen使いました。便利ですね！ ※あとで説明しますが、管理が楽なのでSass形式で作っています。C

    CSS(Sass)でレーティング評価の星(★)を表現する方法 - Design Color

  • コーダーがおさえておきたいコーディングのツール8選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作

    こんにちは。LIGフィリピン支社代表のせいと(@seito_horiguchi)です。 昨今ではWebのフロント周りを取り巻く環境が激変しています。 Webサイト・アプリケーションが進化するに連れて構築も難しくなってきましたし、技術やツールもいろんなものが登場しました。 そこで今回は、フロントエンドエンジニアはもちろん、コーディングに携わる人なら誰でもおさえておきたい、今旬な技術やツールを紹介したいと思います。 コーディングに関わる人ならおさえておきたい必須のフロント技術＆ツール8選 1. タスクランナー フロントコーディングに関わるあらゆるタスクを自動化してくれる頼もしいツールです。Grunt,Gulpといったツールがコレにあたります。 JadeやSass,CoffeeScriptのコンパイル、画像圧縮、バリデーションチェック、webfontのアイコン化、スプライト画像生成、スタイル

    コーダーがおさえておきたいコーディングのツール8選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作

  • これからSassを始めたい人へ！導入手順をまとめてみた(Dreamweaver対応) | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作

    こんにちは。LIGフィリピン支社代表のせいとです。 全く関係ない話ですが、ポケットモンスター X・Yが発売されたそうですね。「金・銀、ブラック・ホワイトときたら、次はパステルカラー辺りが来るはずや！間違いない！」と思っていた僕の予想はまんまと外れました。まあそれはいいとして、 今回はSassについてちょっと語らせていただきます。Sassというと、「効率、コーディングスピードが超上がるらしい」とか、「LINE株式会社、株式会社DeNAとかも採用してるらしい」という話を聞きます。僕もSassについては勉強しているんですが、当初はわかりにくい部分もありました。 それは「そもそもSassが何なのかよくわからない。プログラミング言語？？」ってことと、「インストールが上手くいかない！コマンドプロンプト使い方わからない！Dreamweaver（以下DW）動かない！GUIソフトってなに！？」ってことです。

    これからSassを始めたい人へ！導入手順をまとめてみた(Dreamweaver対応) | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
  • 1

お知らせ

もっと読む

公式Twitter

  • @HatenaBookmark

    リリース、障害情報などのサービスのお知らせ

  • @hatebu

    最新の人気エントリーの配信

はてなブックマーク

公式Twitter

はてなのサービス

  • App Storeからダウンロード
  • Google Playで手に入れよう
Copyright © 2005-2025 Hatena. All Rights Reserved.