デザイン性に優れたCSSメニュー集:phpspot開発日誌
Hidden Pixels - Ultimate CSS Menus デザイン性に優れたCSSメニュー集。 これは、と思うようなかっこいいＣＳＳメニューが特集されていました。 Professional drop-down Professional dropline Space Drop Down Menu Flyout hybrid menu Professional drop-down - shadow menu Brooke Case Drop Down Tech Radar mouseover tabs つい押したくなるようなメニューですね。 参考にクールなメニューを作ってみましょう。 関連エントリ クールなナビゲーションメニューを作成するCSS＆HTMLサンプル アニメーションするドロップダウンメニュー作成ＪＳ「Sliding JavaScript Dropdown Menu」 J
プロっぽくて編集しやすいフリーのウェブサイト用テンプレート配布サイト「TemplateYes」 - GIGAZINE
最近はブログなどを使ったサイトが非常に多いのですが、やはりきちんと作り込まれたサイトも必要なわけで。だからといってゼロから作るのは大変。そこで使えるのが、あとから編集してカスタマイズしやすい商用利用可能なフリーのウェブサイト用テンプレート。元となるPSDファイルなども付属している場合があるので、それぞれのパーツをかなりカスタムすることが可能となっています。また、全部Flashでできたサイト用のテンプレートなどもあります。 ダウンロードは以下から。 Free Website Templates, Flash Templates, CSS Templates - TemplateYes.com まずは各ジャンルごとにサンプルを見てみましょう。 ・PSDファイルとフォントまで付属した通常のウェブサイト用テンプレート ダウンロードはここをクリック ダウンロードはここをクリック ダウンロードはここを
[JS]ブラウザの幅に合わせてレイアウトを最適化するスクリプト -Dynamic Layout
Dynamic Layoutは、ユーザーのブラウザの幅を認識し、それに適したスタイルシートでページのレイアウトを最適化するスクリプトです。 Dynamic Layout デモ Dynamic Holy Grail 1～3カラムのシンプルなレイアウト、ブラウザ幅600, 800, 1000に設定 Fortes ブラウザ幅600, 800, 1000, 1200, 1400に設定 fil-ter ブラウザ幅600, 1000に設定 Dynamic Layoutの設置方法は、body直下に外部ファイルとして指定します。 <textarea name="code" class="html" cols="60" rows="5"> <body> <script src="http://static.fortes.com/projects/dynamiclayout/dynamiclayout-1.0
フッターの背景をコンテンツが少ない時でも下まで表示させる
デジパのベトナムオフィシャルサイトがオープンしました。 さて、今回はこのデジパベトナムを組むのに辺り、最初は無理（もしくは相当厄介）だと思ってたことが思ったよりカンタンに出来たのでご紹介。 Movable Type 4のデフォルトテンプレートもそうですが、コンテンツの内容が少ない場合に、フッター部分は当然上に来てしまい、下がbodyに指定している背景色になってしまいます。 キャプチャみたいな感じです。 コレがイヤでフッターをページ下部に固定する方法とかを使う事もあるかと思いますが、アレはアレでコンテンツ部分が間延びしてしまう感じも無きにしも非ずだったりします。 と、言うか個人的には1サイトに1ページ有るか無いかも分からないような部分に労力を割きたくないのが正直なトコロなので、出来れば見逃して欲しい部分だったりします。 htmlとbody要素にheight: 100%指定して...みたいなの
印刷用デザインをきれいにまとめるための7つのポイント - TRANS [hatena]
印刷用デザインもWebサイトにとっては1つのデザインだと言えます。制約がある印刷用デザインをきれいにまとめるためのポイントを上げてみました。 印刷用デザインをどうするか。 当ブログで印刷用CSSをはじめて取り上げたのが2006年12月でした。また、2007年4月にも印刷用CSSをもっとよくするための4つのTipsという内容で取り上げました。 さて、今回取り上げるのは今までと違い、印刷用CSSのコーディングではなく、純粋に印刷用デザインはどのようなものがよいか、というものです。コーディングではなく、いかにデザインするか。 ちょうどアックゼロヨン・アワード2007の結果発表もあったことなので、その受賞作の印刷用デザインを参考にしました。また、ADP: 印刷用CSSの書き方（基本編）もかなり（むしろほとんど）参考にさせてもらいました。そのポイントを以下の7つにまとめました。 なお、文末にアックゼ
![印刷用デザインをきれいにまとめるための7つのポイント - TRANS [hatena]](https://cdn-ak-scissors.b.st-hatena.com/image/square/f625aab20ef8abfef513499376656cecc29a08ae/height=288;version=1;width=512/http%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fa%2Faratako0%2F20080518%2F20080518141449.png)
[CSS]よく使用するクラスをまとめたスタイルシート -Toolbox CSS
CSS-Tricksのエントリーから、異なるサイトにも利用が可能な、よく使用するクラスをまとめたスタイルシート「Toolbox CSS」を紹介します。 <textarea name="code" class="css" cols="60" rows="5"> .floatLeft { float: left; } .floatRight { float: right; } .clear { clear: both; } .layoutCenter { margin: 0 auto; } .textCenter { text-align: center; } .textRight { text-align: right; } .textLeft { text-align: left; } </textarea>
Vesess Web Design and Development Software Solutions Graphic and Print Design Sri Lanka
Hiveage is our Fintech venture. One of the first successful SaaS products to emerge from South Asia, Hiveage serves more than 65,000 small businesses worldwide with their online invoicing. Our latest product is Paylinks, which lets you create payment requests, share them through any channel, and accept payments using PayPal and Stripe. Visit Hiveage Visit Paylinks Get Paid Faster with the Free Inv
Googleドキュメントのデザインを自由に変更できるようになったので試す｜WEBマーケティングブログ
「CSSがいじれるようになった」とは言ってもあまり目新しさも感じないようにも。。。しかしサンプルを見せられた瞬間に「これは！」と感じざるを得ませ
ウノウラボ Unoh Labs: CSSによるデザインワークと相性のよいHTMLって？
yamazakiです。最近だいぶあたたかくなってきましたね。おかげで日中眠くて仕方ないわけですがいかがお過ごしでしょうか。 ウノウに入る以前も含めてそれなりに長いことHTMLとCSSを書いてきたわけですが、今回は試みに、「だいたいこういうところに気を使われたHTMLだと、CSSでのデザイン適用やレイアウトがやりやすいな」というこれまでの経験則を簡単ですがまとめてみたいと思います。 まあ、このあたりはCSS書く人とHTML書く人の間でちゃんとルールを決めておけばいいだけの話なので、そもそも何の役に立つのか疑問といえば疑問ですが（笑 たとえばユーザがCSSを書いてスキンを作れるようなサービスを作る際、どういったHTMLにするかを決める、みたいな時には少し参考になる、かもしれません。 ID、クラスを適切に割り振って、要素がCSS側から一意に特定できるように たとえばグローバルナビゲーションとカ
100個近いCSSギャラリーサイトをまとめて閲覧できる「GALLERY GALLERY」
CSSによってデザインされたサイトをまとめるサイトはかなり多く、それらすべてを網羅しようにもなかなか大変だったわけですが、そういったCSSギャラリーサイト自体をまとめたサイトが出現しました。その名は「GALLERY GALLERY」、さまざまな条件で並び替えることも可能で、100個近いサイトを見ることができます。 詳細は以下から。 GALLERY GALLERY http://www.triangling.net/gg/ この記事の執筆時点では98個のサイトが登録されており、それぞれのサイトについてRSSはあるか、タグによる分類はあるか、ユーザーによる投票は可能か、などの情報が簡潔にアイコンで示されています。 また、各種条件で並び替えることも可能となっているため、自分の入手したい情報をまとめたCSSギャラリーサイトを見つけることも簡単にできます。なかなかいい感じです。
CSS, JavaScript, ActionScript, PHP, SQL, ASPなどのチートシート集
WebTeckerのエントリーから、CSS, JavaScript, AJAX/JavaScript Frameworks, ActionScript, PHP, SQL, ASP, C# and VB.NET, C++などのチートシートを紹介します。 Programing Cheat Sheets ActionScriptのチートシート ActionScript Cheat Sheet Ajax/JavaScript Frameworks Prototype Cheat Sheet Scriptaculous Cheat Sheet(PDF) MooTools Cheat Sheet jQuery Cheat Sheet YUI Cheat Sheet
Flower Arranging School was constructed in part using CSSaddict - Flower Arranging School
Flower Arranging School was constructed in part by using CSSaddict Learn how to make floral arrangements in a relaxed and fun environment. These flower arranging courses are filled with useful information and easy to demonstrate by a qualified florist. Courses are suitable for absolute beginners, and at the end of the course you will take a beautiful arrangement to fill your home with beautiful fl
[CSS]HTMLを診断するスタイルシート -CSS Diagnostics
NealGrosskopf.comのエントリーから、HTML 4.01で非推奨とされる要素や空の要素、空の属性などをピックアップするスタイルシートの紹介です。 CSS Diagnostics - Find Depreciated Elements Using CSS CSS Diagnosticsは、meyerweb.comのCSS Tools: Diagnostic CSSの影響を受けて作成されたもので、非推奨の要素・属性、要素・属性が空の箇所などにボーダーを表示します。 Depreciated Elements：非推奨の要素 <textarea name="code" class="css" cols="60" rows="5"> applet, basefont, center, dir, font, isindex, menu, s, strike, u { border: 5px
HTML、XHTML、CSS、PHP、JavaScript、MODxを中心とした情報発信サイト - Phize on the Web Web
Phize on the WebはPhizeのポートフォリオ・資料・実験サイトです。 [おすすめツール] 愛用者だけが、この2年間でライバルたちに埋められない差をつけました。誰も教えたがらなかった最強のSEOサービス・キーワードツール。特別オファーを受けられる最後のチャンスです。 更新履歴 2010-04-17 phiEditedonプラグイン(1.1.2) 2010-04-17 SEO Strict URLsプラグイン(Phize版) 2010-01-13 ホーム 2009-10-21 DocLinkスニペット(1.0.2) 2009-09-02 ユーザーエージェント年表 2009-08-11 DateTimePickerプラグイン(1.1.0) 2009-03-18 Add Guides EX(1.0.0) 2009-03-17 カラムウィザード(1.0.0) 2008-10-30 M
新規でサイトを作る際のCSSを公開:::STOPN' LISTEN:::
免責事項：本サイトに含まれる情報は、一般的な情報提供のみを目的としています。情報はスペシャルベストによって提供され、当社は情報を最新かつ正確に保つよう努力しますが、いかなる目的においても、ウェブサイトまたはウェブサイトに含まれる情報、製品、サービス、関連グラフィックスに関する完全性、正確性、信頼性、適合性、利用可能性について、明示または黙示を問わずいかなる表明または保証も行いません。従って、これらの情報に依拠することは、あくまでもお客様ご自身の責任において行われるものとします。 当社は、当ウェブサイトのご利用に起因するいかなる損害についても責任を負いません。 本ウェブサイトから、スペシャルベストの管理下にない他のウェブサイトへリンクすることができます。当社は、それらのサイトの性質、内容および利用可能性を管理することはできません。リンクは必ずしも推奨するものではありませんし、リンク先で述べら
サービス提供終了のお知らせ
日頃より、Momoたろうインターネットクラブをご愛顧いただきまして誠にありがとうございます。 「ホームページサービス」のサービス提供は2015年11月30日をもちまして終了させていただきました。 これまで長らくご利用いただき、誠にありがとうございました。 今後も、皆様によりよいサービスをご提供させていただけるよう、サービス品質向上に努めて参りますので、何卒、ご理解いただけますようお願 い申し上げます。 ＜Momoたろうインターネットクラブをご契約のお客様へ＞ 後継サービスとして「userwebサービス」を提供させていただいております。 詳しくは、以下のリンクをご参照ください。 ▼「userwebサービス」のご案内 http://www.ejworks.info/userhp/mmtr/index.html 今後ともMomoたろうインターネットクラブをご愛顧いただけますようお願い申し上げます
CSS の「値」とは何か - IT戦記
この前 以下のようなエントリを書きました CSS の名前の整理 - IT戦記 今回は CSS における この「value（値）」という言葉の意味、そして曖昧さについて書きたいと思います。 6 つの値 CSS において「値」は曖昧な言葉です。 なので、「値」という言葉を使って CSS の説明をするのは非常に効率が悪かったりします。 たとえば、「ここの値って、 hogehoge の意味の値？」「いやいや、ここの fugafuga の意味の値が piyopiyo なんだよ」というように、まったく無駄な会話が繰り広げられるわけです。 ですので、今日からはちゃんと CSS の「値」をちゃんと説明できるように、「値」に以下の 5 つの名前を付けましょう。 Declared values Cascaded values Specified values Computed values Used valu
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
(X)HTML・CSSコーディングマニュアル
[CSS]50+のクリエイティブなスタイルシートのチュートリアル | コリス
[CSS]印刷用のCSSのフレームワーク -Hartija | コリス