【第2弾】少しのコードで実装可能な20のCSS小技集 | Webクリエイターボックス

2016/02/01 826 users 実装 Webクリエイターボックス CSS小技集 コード タタ

はるか6年前に書いた記事「 少しのコードで実装可能な20のCSS小技集 」の第二弾です！（スパンながっ）簡単なコードで素敵な効果が得られる小技をダダっと紹介してみます。前回に引き続き、初心者さんからベテランさんまで参考にしてみてください！ 目次 画像を丸く表示 1本線のテーブル 1本線の水平線 線色を指定しなくても文字色と同一色になる 複数の背景画像 背景画像のサイズ Webフォントを使う 画像を... 続きを読む

美しいグラデーションをCSSで実装！配色に使える便利ツールや実例も！ | Webクリエイターボックス

2015/03/02 515 users CSS 配色 実例 実装 美しいグラデーション

背景に動画を使ったWebサイトや、大きな背景画像を使ったWebサイトに続き、最近は画面全体にきれいなグラデーションカラーを用いたサイトを見かける機会が増えてきました。そこで今回はグラデーションカラーをCSSで実装する基本的な方法から、画像に重ねる応用、配色選びに使えるサイト、実例集などを紹介します！ CSSでグラデーションを実装 グラデーションは background プロパティーに linear... 続きを読む

大きな背景画像を使った魅力的なWebサイトを作ろう | Webクリエイターボックス

2014/09/10 546 users Webクリエイターボックス 迫力 背景 少しハードル メリット

以前このブログで背景に動画を使ったWebサイトの作り方を紹介しましたが、やはり動画を準備するのは少しハードルが高いと感じる人もいますよね。そこで今回は導入しやすく印象に残りやすい、大きな背景画像を用いたWebサイトの作り方を紹介します！ 背景に大きな画像を使うメリット・デメリット 大きな背景画像のメリットは、なんといってもその迫力です。言葉を使わずとも、そのWebサイトを通じて伝えたいイメージをス... 続きを読む

[CSS]背景画像をブラウザいっぱいに表示するシンプルな最新テクニック | コリス

2014/07/02 514 users コリス GitHub CSS 一行 スニペット

背景画像をブラウザいっぱいに表示するスタイルシートのシンプルなテクニックを紹介します。 デスクトップだけでなく、スマフォやタブレットにも対応、しかもたった一行なのでスニペットに加えておくと便利です。 Responsive Full Background Image Using CSS Responsive Full Background Image Using CSS -GitHub デモ コンセ... 続きを読む

iOS 7で「必要ない / 不便」という声が多そうな機能6選（と、その設定を変更する方法） : ライフハッカー［日本版］

2013/09/21 608 users ライフハッカー デバイス 例外 iOS 7 オフ

新しいバージョンのOSがリリースされると、ちょっとした問題や使いにくい点が生じることは多々あります。iOS 7も例外ではありません。今回は、特に使いにくそうな新機能6つをピックアップし、その変更方法を紹介します。 1．視差効果をオフにする iOS 7ではデバイスを傾けると背景画像も少しスクロールするという「視差効果」が採用されています。クールな仕掛けですが、そこまで便利というわけではありません。特... 続きを読む

hr要素のデザインサンプル 12 | NxWorld

2013/09/12 698 users 罫線 備忘録 NxWorld 見栄え CSS

hr要素は罫線を表示させるもので、話題を変える時の目印となる区切り線などとして用いられます。どのブラウザでも完璧に同じ見栄えをとなると背景画像とかがやはり手っ取り早いし無難なんですが、やろうと思えばCSSだけでも結構いろいろとできるので、備忘録兼ねてhr要素をスタイリングしたものをまとめてみました。 以下で紹介しているものは、ブラウザによっては（特にCSS3を用いているもの）ちゃんと表示されません... 続きを読む

無料で商用利用可能な背景画像を提供する「背景倉庫」 - GIGAZINE

2011/11/25 680 users GIGAZINE 義務 カンパ 背景 http

「使用に当たっての制限や、報告の義務などは一切ありません。個人使用・商業目的使用への制限もありません」「かんばって描いたけど、もう自分には使う当てがないかもしれない、よければ誰かに使ってほしい、汎用性の高そうな背景を扱うサイトです」ということで、いろいろな背景画像を提供しているのが「背景倉庫」です。 背景倉庫 http://da-yama.secret.jp/index.html 各種背景画像はZ... 続きを読む

継ぎ目のないシームレスな背景画像の無料素材とジェネレーターのまとめ | コリス

2011/05/18 727 users コリス ジェネレーター 継ぎ目 まとめ 無料素材

Archive by month 2011年5月 (27) 2011年4月 (45) 2011年3月 (33) 2011年2月 (43) 2011年1月 (40) 2010年12月 (48) 2010年11月 (52) 2010年10月 (54) 2010年9月 (47) 2010年8月 (59) 2010年7月 (49) 2010年6月 (43) 2010年5月 (35) 2010年4月 (48... 続きを読む

ディスプレイのサイズに合わせて画面いっぱいに背景画像を表示するCSSやjQueryプラグインいろいろ

2010/11/12 792 users CSS jQueryプラグイン ディスプレイ jQuery

ディスプレイ（ブラウザ）のサイズ、画面いっぱいに背景画像を拡大表示するCSSやjQuery プラグインをいくつか試してみたのでレビューをまとめてみました。CSSだけでフルスクリーンで背景表示ができるものや、jQueryのプラグインを使ったものなどいくつかご紹介します。ディスプレイサイズ（ブラウザサイズ）いっぱいに背景画像を表示する方法はいくつかありますが、最近見つけたjQueryのプラグインを試し... 続きを読む

背景画像をつくるのに便利なサイト12選 - IDEA*IDEA ～ 百式管理人のライフハックブログ ～

2009/01/18 950 users IDEA ジェネレータ 既出 Tartan Designer

ちょうど必要だったので簡単にエントリーしておきます。背景画像に使えるジェネレータいろいろです。既出のものもありますが、よくまとまっていたのでそのままご紹介。 Striped Backgrounds ストライプ柄を作れます。ランダム生成もしてくれますよ。 Tartan Designer - Tartan Maker タータンチェック柄をつくるときに便利。 Tiled backgrounds desi... 続きを読む

デザイナーが知っておくべき背景画像のリソースサイト集:phpspot開発日誌

2009/01/08 619 users Speckyboy ジェネレーター phpspot開発日誌

36 Must Have Backgrounds and Patterns Resources for all Designers : Speckyboy - Web Design, Web Development and Graphic Design Resources デザイナーが知っておくべき背景画像のリソースサイト集。 背景画像のダウンロードやWEB上で動作するジェネレーターがまとまってい... 続きを読む