[B! サイト作成] three_beeのブックマーク

three_bee id:three_bee

サイト作成に関するthree_beeのブックマーク (2)

[CSS]ヘッダやコンテンツを区切るラインを斜めに実装するCSSやSVGのテクニック総まとめ
長方形ではないヘッダやコンテンツが最近増えてきました。その一つとしてヘッダの下、コンテンツを区切るラインを斜めにすることで、簡単にデザインの印象を変えることができます。一見シンプルに見えますが、実装するには慎重を要します。ラインを斜めに実装するCSSやSVGのテクニックをコードのシンプルさ、コンテンツの生成、対応ブラウザ、パフォーマンスの面から実装に適した方法を詳しく紹介します。 Ultimate Guide to Non-Rectangular Headers 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。斜めのラインをCSSやSVGで作成する方法斜めのラインをCSSのボーダーで作成斜めのラインをCSSのグラデーションで作成斜めのラインをCSSのシェイプで作成斜めのラインをSVGの背景で作成斜めのラインをSVGの
three_bee 2017/02/03
css

Programming

CSS3

サンプル

斜め

SVG

コーディング

まとめ

サイト作成

ライン
リンク
デキるデザイナーはみんな使ってる！背景にすぐ使えるすごいデザインテクニックのまとめ
画像や文字などを配置する時、背景をどのようにするかでデザインは劇的に変わります。 Webや紙のデザインに効果があり、すぐに使える背景のすごいデザインテクニックを紹介します。 Ultimate Guide to Designing With Backgrounds 以下、各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。背景のデザインとはベタ一色の背景高いコントラストのベタ一色の背景テクスチャの背景グラデーションの背景写真をつかった背景形をつかった背景透明の背景ブラーを適用した背景カラーをオーバーレイさせた背景文字のスペースがある背景パターンの背景イラストの背景空白スペースをつかった背景グリッドをつかった背景背景のデザインとは背景はグラフィックデザインを築く基礎となるものです。テクスチャとカラーはデザインに奥行
three_bee 2016/07/21
background

あとで読む

デザイン

design

webdesign

テクニック

背景

web

サイト作成

カラー
リンク
1