アーカイブ

‘CSS’ カテゴリーのアーカイブ

html5メモ

2012 年 10 月 24 日 kawa コメントはありません

html5にてブロックタグの中に<img>タグを入れている場合、不自然な余白が下につく症状がでます。
<img>タグの「vertical-align」の初期値を「vertical-align: bottom;」にすると解決します。

カテゴリー: CSS, HTML5, iPhone/スマホ タグ:

段落を両端揃えにする

2010 年 12 月 15 日 kawa コメントはありません

text-align:justify;
text-justify:distribute;

カテゴリー: CSS タグ:

フリー画像素材

2010 年 12 月 10 日 kawa コメントはありません
カテゴリー: CSS, ウェブデザイン参考, 便利ツール タグ:

書体tips

2010 年 12 月 7 日 kawa コメントはありません

Windows標準のMS系フォントは25px以上からアンチエイリアスがかかります。
↓ウインドウズで確認してみてください。
http://www.mec-com.biz/kawa_test

カテゴリー: CSS タグ:

IE6でCSS3

2010 年 11 月 15 日 kawa コメントはありません

IE6/7/8のブラウザでも角丸やドロップシャドウが使えるCSS3
PIE.htcファイルをダウンロードして、
CSSにbehavior: url(ここに場所を入れる/PIE.htc);
を入れることでIEにも対応。

サンプルを作成してみました。
http://www.mec-com.biz/kawa_test

ファイルダウンロード(本家サイト)
http://css3pie.com/

参考サイト
http://coliss.com/articles/build-websites/operation/css/css3pie-decorations-for-ie.html

もしCSS3PIE(PIE.htc)が効かない場合は
パスか.htaccessの設置の有無を見直しましょう。
CSSにはCSSからPIE.htcへの相対パスではなく、
PIE.htcを使用しているファイルからPIE.htcへの相対パスをCSSに書き込む必要があります。
例 /jsディレクトリに置く場合 behavior: url(/js/PIE.htc);
また、サーバーの仕様によって動作しない場合があるので、
その場合は.htaccessにて以下の設定が必要になります。
AddType text/x-component .htc

カテゴリー: CSS タグ:

XHTML、CSSを学ぶために役立つサイト

2010 年 9 月 25 日 iri コメントはありません

以下のサイトをブックマーク登録しておいてください。

CSSレクチャー http://www.css-lecture.com/

原色大辞典 http://www.colordic.org/

カテゴリー: CSS タグ:

CSS3について

2010 年 8 月 23 日 kawa コメントはありません

CSS3の技術についてまとめられた記事を抜粋しました。
違いの良くわかる記事↓
画像を一切使わずにCSS3だけでドラえもんを描いてみた! 続きを読む…

カテゴリー: CSS タグ:

iPadだけにCSSを適用する方法

2010 年 7 月 27 日 kawa コメントはありません

厳密には、javascriptで振り分けるしかないようですね。
理由と、サンプルも含めて下記のサイトにありました。
http://gecko.hp2.jp/2010/05/17/%E3%80%90css%E3%80%91ipad%E3%81%A0%E3%81%91%E3%81%ABcss%E3%82%92%E9%81%A9%E7%94%A8%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95/

カテゴリー: CSS タグ:

フラッシュではない表現

2010 年 7 月 27 日 kawa コメントはありません

マウスオーバーはいろんな表現ができるイベントのひとつ
ipadでやってみたらプチプチ感覚で面白いかもしれません。
http://www.thinkgreenmeeting.com/
殻から豆が飛び出すような表現とか、遊べそうですね
http://tympanus.net/codrops/2010/01/17/css-and-jquery-tutorial-fancy-apple-style-icon-slide-out-navigation/

フラッシュでなくても面白い動きのスライドショーはいろいろできます
むしろ、jqueryの方が楽な場合もあります。
http://fredhq.com/projects/roundabout-shapes/

カテゴリー: CSS, ウェブデザイン参考 タグ:

css3

2010 年 7 月 26 日 kawa コメントはありません

CSS3 Click Chart by Impressive Webs
CSS3で何ができるか、どのように実装するかが一目で分かるサイト。

カテゴリー: CSS タグ: