PhotoShop デザインスペースを使ってみよう〜PhotoshopCC2015.1
注意：PhotoshopCC2017からデザインスペースは（プレビュー）は使用できなくなっています。Xdを使ってねということでしょうか、XdのWindows版はまだ出てないけど。。あまり振り回されないでCS６活用している方が賢いかも。
...
PhotoShop 
HTML&CSS Webサイトの縦書き
2015年には主力ブラウザでは縦書きに対応してきています。縦書きの需要も高くなることが考えられます。まだまだ細かいところでは課題が多いですが、基本的な事はマスターしておきましょう。
横書きを縦書きに変更するCSS3プロパティ「writ...
jQuery data-**属性とdata()の使い方〜jQuery
data()を利用するとグローバル変数のようにデータを保存することができます。HTML5から利用できるdata-**属性はこのdata()とは別ものですが、data()で操作することも可能です。data-**属性をdata()で操作すると色...
jQuery replaceWith()の使い方〜jQuery
replaceWith()はある要素を指定されたHTMLやDOMエレメントで置き換えるものとリファレンスでは説明されていますが、少しわかりにくいので解説します。
ざっくりとみると、html()と働きが似ています。
html()は指定した...
HTML&CSS レスポンシブイメージについて
2015年ではレスポンシブサイトに対応させるために無駄にサイズの大きい画像を用意していました。
それぞれのデバイスの画面幅サイズで画像を切り分けられると都合がよくなります。そのような要望に対応した画像表示の仕組みがレスポンシブイメージです...
HTML&CSS Flexboxを使ったECサイト向けパーツ
ECサイトなどで見かける商品別のブロックをFlexboxを使って作成するサンプルです。
参考にしたのはこちらのページです。Some Inspiration for Pricing Tables
折角Flexboxを使っているので、少し応...
HTML&CSS display:flexの基本的な使い方〜脱フロートレイアウト
Flexboxを使うとfloatでの面倒なレイアウト作成から解放されます。概ねのブラウザも対応していますし、問題のIE8以下のバージョンも急速にその終焉を迎えました。Flexboxレイアウトを積極的に採用する時が来たように思います。
Fl...
Tips Git〜コミットのコメント内容を変更したい時
Gitでコミットしたけれども、コミットの内容を変更したい時の方法です。
SourceTreeでの操作方法ですが、簡単そうでどこを操作したら良いのかわかりにくいです。
操作方法
上にあるコミットボタンをクリックします。
コミットオ...
HTML&CSS CSSでカラムの作成方法〜floatとdisplay:tableの活用
CSSを使ってカラムを作成する復習です。
自分なりにいろいろなカラムを作るパターンを作成しておくとよいです。
フロートを使った固定レイアウトのカラム
固定レイアウトのカラムはPC用のレイアウトでかつて多く使用されたパターンです。幅...
PhotoShop 水滴の作り方〜Photoshop
水滴の作り方のTipsです。
作成前写真
完成画像
作成手順
対象写真を読み込んだ後に、新規レイヤーを作成します。
描画色は黒にして、ブラシツールで水滴の形を作ります。
ブラシの形ははっきりした丸...