2014-07

HTML&CSS

ビューポートとは 〜HTML

ビューポートについて スマートフォンのブラウザではViewportという仮想ウインドウサイズが設定されています。 もう少しわかりやすい言葉で説明すると、スマートフォンの画面は本来の解像度で表示するのではなく、仮想の解像度で表示を行います...
PhotoShop

ドットパターンの作成〜Photoshop

photoshopを新規作成します。 「幅」を「4px」、「高さ」を「4px」とします。カンバスカラーは「透明」を選択し 「描画色」を白にします。カンバスは小さいので最大に拡大します。 鉛筆ツールの直径を1px、硬さを100%にし...
PhotoShop

ボタンの作成〜Photoshop

「長方形ツール」または「角丸長方形ツール」で矩形を描きます。 その際、線は無し(CS6以上)、塗りは単色(何でもよい)にしておきます。 レイヤースタイル追加ボタンをクリックして「グラデーションオーバーレイ」を選択 グラデーショ...
JavaScript

正規表現の基礎

正規表現とは 正規表現(regular expression)とは文字パターンを表現する方法です。 つまり、文章の中のある文字列を検索したいときなど役に立ちます。 今回はJavaScript(jQuery)で正規表現を活用する説明...
jQuery

Topへ戻るボタンの作成〜jQuery

長いページでは必須のTopへ戻るボタンですね。 スクロールするとTopボタンが出現し、クリックすると緩やかにTopに戻ります。 この動きはCSSとjQueryで実現できます。easingなどを好みで脚色してください。 Topへ戻る...
HTML&CSS

ノードの表示と非表示〜CSS

ある要素の表示と非表示の方法をまとめました。 visibilityプロパティ ボックスの表示(visible)と非表示(hidden)を指定するにはvisibilityプロパティを使用します。 visibilityプロパティで...
HTML&CSS

absoluteで複数の画像を重ねる

p要素の中に複数の画像をimgタグで挿入します。 通常なら横並びに画像が並ぶはずです。 ここでimg要素にposition : absoluteを設定します。 位置は特に指定をしません。 そうするとimgで挿入した画像がきれいに重な...
jQuery

要素の追加〜jQuery

jQueryのprepend,append,before,afterのそれぞれのメソッドの違いを確認しておきます。 prependはHTML要素内の先頭に挿入します。 appendはHTML要素内の最後に挿入します。 ...
jQuery

jQueryの記述の基本を覚える

マウスクリックした時のイベントの作成の基本形です。 $( );で全体を囲む 1の中に関数を宣言 function(){ } 2の関数の中に$( ’セレクター’).イベン...
HTML&CSS

nth-child(n)とnth-of-type(n)の違い〜CSS3

CSS3から追加されたn番目の子要素を指定できるnth-child(n)とnth-of-type(n)の違いです。 nth-child(n)は、ある親要素の全ての子要素の中のn番目の子要素を表します。 nth-of-type(n)はある...
スポンサーリンク
タイトルとURLをコピーしました