タグ

cssとsassに関するjytechのブックマーク (2)

  • よりよいCSSを書くための、CSS / Sass (SCSS) 30のルールとその理由

    Webエンジニアを始めて丸2年が経ちました。 複数プロジェクトを進める中で、CSSコーディングを行うときの「こうしておくと便利」「このほうが管理しやすい」といった知見が溜まってきたのでまとめます。 はじめに 長くなってしまった細かい説明はところどころ折りたたんでいます。概要だけで理解できたら飛ばしていただき、詳しい話が気になったら開いて読んでください。 これらは「自分がよく取り入れている手法」であって、必ずしもどのプロジェクトにも当てはまるものではないと思います。 各項目について、自分がその判断に至った 「理由」 を説明していますので、 理由を読んだ上で自分のプロジェクトに取り入れるか判断いただくと良いと思います。 この記事は、すでにCSSコーディングをしていてアイデアがほしい人に向けた記事で、 CSSをこれから学び始めるような 初学者向けではない ことご了承ください。 一般的と思われるキ

    よりよいCSSを書くための、CSS / Sass (SCSS) 30のルールとその理由
  • Sassの関数を使ってみる

    個人的に使いそうなものを中心に、Sassの関数をいくつか試してみます。 色関連 rgb($red, $green, $blue) RGB値から色を作成します。 .sample { color: rgb(100, 100, 100); } CSS .sample { color: #646464; } rgba($red, $green, $blue, $alpha) RGBA値から色を作成します。 rgba($color, $alpha) のようにして16進数のRGB値でも指定可能。 .sample { color: rgba(100, 100, 100, 0.8); background-color: rgba(#ff0000, 0.8); } CSS .sample { color: rgba(100, 100, 100, 0.8); background-color: rgba(25

    Sassの関数を使ってみる
  • 1