[B! css] [8ページ] tanisukeのブックマーク

CSSを整形してくれる「Styleニート」:phpspot開発日誌

StyleNeat CSSを整形してくれる「Styleニート」、いや、StyleNeat です。ファイルアップロードや、そのまま記述によって最適化が可能です。出力オプションも色々選べます。同じようなツールも色々とありますが、デザインが綺麗なのと、名前がちょっと面白かったので紹介。関連エントリオンラインから使えるCSS最適化ツールオンラインCSS整形＆最適化＆圧縮ツール集

tanisuke 2009/03/29

リンク

[CSS]上級者向け、スタイルシートのテクニック集

スタイルシートで実装する実用的なものからちょっと変わったものまで、25のテクニックをDesizn Techから紹介します。 25 Advanced CSS Techniques 1. CSS Gradient Text and Background テキストや背景をグラデーション表示。

tanisuke 2009/03/27

リンク

http://www.designwalker.com/2009/03/form-design-2.html

tanisuke 2009/03/26

リンク

WEBデザイナーという肩書きを使う場合にあったらいいかもなスキルとWEBで見れる無料教材とリソース集:phpspot開発日誌

WEBデザイナーという肩書きを使う場合にあったらいいかもなスキルとWEBで見れる無料教材とリソース集 2009年03月23日- WEBデザイナーという肩書きを使う場合にあったらいいかもなスキルとWEBで見れる無料教材とリソース集。プログラマが１ヶ月でWEBデザイナーに転身する方法というエントリを見て、プログラマの方々のWEBデザインに関する関心の高さを見て書いてみます。 WEBデザイナーといっても色々な知識が必要で、かつ、最近はフリーのテンプレートも豊富にある中、どれだけ出来ればWEBデザイナーとして成り立つのだろう？という疑問がありましたので考えてみました。プログラマの方で、WEBデザインをやってみたい。また、全くの素人だけどWEBデザイナーを仕事にされたいという方の参考になれば幸いです。最低限の知識編 1. HTMLとレイアウト力まず、知っている人には物凄く当たり前の事ですが、

tanisuke 2009/03/24

リンク

同一色相配色のWebデザイン50 – creamu

「Webdesigner Depot」で、同一色相配色のWebデザインがまとまっています。以下にざっとご紹介。 ↑はAaron J. Shapiro。かっこいいですよね。 Stlye Division Henry Hoffman Citizen Fly Guy Designs Mint The Invoice Machine 「青・オレンジ・ブラウン・緑・紫・赤・無彩色」といったカテゴリーにわかれてたくさん紹介されていますね。その他は以下からどうぞ。 » 50 Monochromatic Website Designs サーバ移行中。FTPが全然終わらん。。。んー早く出かけたいのにな。

tanisuke 2009/03/21

リンク

画像をCSSだけでハイクオリティに縮小サムネイル化する方法:phpspot開発日誌

Tip: High quality CSS thumbnails in IE7 ・Devthought 画像をCSSだけでハイクオリティに縮小サムネイル化する方法が紹介されています。普通、IEで、img に対して、width, height 指定すると、画像が汚く縮小されちゃってましたが、CSSの指定をしちゃうとそれが解決されるということのようです。具体的には以下のCSS指定によってそれが可能みたいです。 img { -ms-interpolation-mode: bicubic; } デモページう〜ん、縮小してもとっても綺麗です。 FirefoxやChromeの場合は何も指定しなくても綺麗に縮小される、っていうのも知りませんでした。これは、サーバサイドでサムネイルを生成しなくて良くなる場面が出てきて開発者としては手間の削減になりますね。転送量を考えれば、サムネイルが完全に不要に

tanisuke 2009/03/21

リンク

技術系サイトに必需品！ソースコードは鮮やかに JavaScriptもPHPもHTMLもOK！「Syntax Highlighter」の使い方

Webプログラミング/Webデザインのネタを扱うブログやWebサイトを運営していると、HTMLやCSSなどのソースコードを掲載することが多くあります。そんなときにぜひ活用したいのが、ソースコードを読みやすく表示してくれるJavaScriptライブラリです。今回は、そのうちの1つ、「Syntax Highlighter」の使い方を紹介しましょう。多くの言語の構文強調表示に対応した「Syntax Highlighter」 HTMLなど各種言語のソースコードをWebページの中で表示するのは、HTMLのpre要素を使えば簡単です。ただ、ソースコードをそのまま表示すると、見た目が分かりやすくはありません。そこで、タグなど言語の特定キーワードに色を付けて、他の部分よりも強調して表示することで見やすくしましょう。こういった「構文強調表示」を行なうJavaScriptは、いくつか公開されていますが、そ

tanisuke 2009/03/20

リンク

チュートリアルでここまでやる？というプロレベルのWEBレイアウト作成チュートリアル:phpspot開発日誌

チュートリアルでここまでやる？というプロレベルのWEBレイアウト作成チュートリアル 2009年03月17日- 150 Useful Adobe Photoshp Web Design Layout Tutorials and Techniques | 2experts Design - Web Design and Graphic Design Blog チュートリアルでここまでやる？というプロレベルのWEBレイアウト作成チュートリアル。プロレベルといっても様々ですが、そのなかでも優れたといえるレイアウトとデザインのチュートリアルが公開されています。真似することでそれなりのものを作るのは難しくなさそうです。 Create a Magic Night Themed Web Design from Scratch in Photoshop マジックをイメージした、少し怪しげなレイアウト。占

tanisuke 2009/03/17

リンク

[CSS]軽快に動作するタブコンテンツを実装するスタイルシート

クロスブラウザ対応の、軽快に動作するタブコンテンツを実装するスタイルシートをCSSplayから紹介します。 Cross browser tabbed pages with embedded links version 2 demo タブで表示される各パネルはリスト要素で実装されており、テキストや画像、リンク要素などを配置できます。タブの高さは、固定タイプと可変タイプの2種類あり、固定タイプではスクロールバーで領域内に表示します。また、デフォルトでタブ箇所のみの表示で、マウスをフォーカスするとパネルが表示されるタイプもあります。

tanisuke 2009/03/13

リンク

脱初心者をめざす人のためのホームページ作成講座

目次初級ちょっと詳しいHTMLとCSS ホームページ作成に必要なHTMLとCSSの正しい文法をやさしく説明します。誰でも見られるホームページのつくり方使いやすいページや環境に依存しないページの作り方を考えます。中級 HTML 4.01 リファレンス HTML 4.01のリファレンスです。HTML 4.01の全要素・属性の詳細な解説があります。 CSS 2.1のエッセンス CSS 2.1の仕様を説明します。CSSを原理から理解したい人のために。いろいろ参考リンク参考書籍迷惑メール対策 SEOをやめよう

tanisuke 2009/03/13

リンク

死ぬまでに見ておくべきCSSデザインサイト集まとめ - GIGAZINE

ということで、今まで数限りなくネットのあちこちで紹介されてきたCSSデザイン関連のサイトがリスト化されてまとめられたようです。これだけあれば当分はブログなどのデザインのネタに困ることはなさそう。インスピレーションを得るのに使うもよし、デザインの参考にするのもよし、知っておいて損はないものばかりです。リストは以下の通り。 CSS Beauty | CSS Design, News, Jobs, Community, Web Standards http://www.cssbeauty.com/ CSS Drive- Categorized CSS gallery and examples. http://www.cssdrive.com/ Stylegala - Web Design Publication http://www.stylegala.com/ CSS Mania http:

tanisuke 2009/03/13

リンク

かなり自由にスタイリッシュなボタンを作れるジェネレータ『Da Button Factory』 - 100SHIKI 〜世界のアイデアを日替わりで〜

似たようなツールはすでにあるし、日本語が通らないのでちょっとあれだが、わりと使いやすかったのでご紹介。 Da Button Factoryは今風というか、2.0風というかのスタイリッシュなボタンがさくっと作れるジェネレータである。設定項目はかなり豊富で、テキストに影をつけたり、背景に光の映り込みを入れたりすることができる。またサンプルでは「Appleっぽいボタン」「Gmailっぽいボタン」などがあり、それらをもとに作っていくことができる機能も便利だ。ウェブサービスを作る人だったら知っておいて損はないですな。