タグ

Chromeとdemoに関するthree_beeのブックマーク (2)

  • Sassを使ったコーディングの強い味方に!便利なextend&mixin集を作ってみた | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    こんにちは、ぺちこです。 先日水族館に行ったら「ペンギン12種模型セット」なるものをショップで発見し、危うく買うところでした。 Suicaペンギンのモデルはおそらくアデリーペンギンですが、私が愛してやまないのはジェンツーペンギンです。どうでもいいですね。(興味をもった人はみんな友達) さて、以前にデザイナーのせいとくんが Sassの導入方法と Sassの基テクニックについてまとめてくれていましたが、今回はそれらを踏まえて、コーディングに役立つextend&mixin集を作ってみました! 日々ちょこちょこと作っては使いまわして・・を繰り返しており、あると便利なものは先にまとめておけば楽ではないかと、やっと気付きました。 サンプルで作ったhtmlとscssファイルを一式ダウンロードできるようにしていますので、そのまま使っても良し、各自(各社)毎のコーディングルールに合せて改良しても良し、要ら

    Sassを使ったコーディングの強い味方に!便利なextend&mixin集を作ってみた | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • hr要素のデザインサンプル 12 - NxWorld

    hr要素は罫線を表示させるもので、話題を変えるときの目印となる区切り線などとして用いられます。 どのブラウザでも完璧に同じ見栄えをとなると背景画像とかがやはり手っ取り早いし無難なんですが、やろうと思えばCSSだけでも結構いろいろとできるので、備忘録兼ねてhr要素をスタイリングしたものをまとめてみました。 ここで紹介しているものは、ブラウザによっては(特にCSS3を用いているもの)ちゃんと表示されません。 また、多用する人も多いと思う破線や点線もブラウザによっては多少見栄えが違ったりするので、使用する際はあらかじめ注意が必要になります。 はじめに ここで紹介しているものは、すべてHTMLは<hr />のみです。 また、それぞれのhr要素にはデフォルトスタイルとしてあらかじめ下記のようなスタイルを指定してあります。

    hr要素のデザインサンプル 12 - NxWorld
  • 1