CSSのみで画像に違和感なく注釈を入れるサンプル:phpspot開発日誌CSS Image Maps, Redux - Flickr-like Technique? CSSのみで画像に違和感なく注釈を入れるサンプルが紹介されています。 次のサンプルを見れば、その利便性が分かるはずです。(JavaScriptは使っていません) 画像内の枠線にカーソルを合わせると説明表示
[CSS]スタイルシートの構造を把握しやすくするオンラインサービス -Styleneat
スタイルシートで使用しているセレクタの構造に合わせて、自動でインデントして整形するオンラインサービス「Styleneat」を紹介します。 Styleneat - CSS Organizer セットできるスタイルシートは、下記の３つに対応しています。 直接スタイルシートを入力して、インデント スタイルシートファイルをアップロードして、インデント スタイルシートのURLを指定して、インデント 記述の順番を変更することはないので、レイアウトの崩れは生じないとのことです。
ブラウザ間の問題をjavascriptで回避する8つのTips「8 Javascript solutions to common CSS problems」
TOP > WebDesign > ブラウザ間の問題をjavascriptで回避する8つのTips「8 Javascript solutions to common CSS problems」 WEBデザイナーやWEB開発者なら一度は苦悩するブラウザの違いによるレイアウトの問題や形式の問題。業務の上で一つの障壁ともなり得ない問題です。今日紹介するのはそんなブラウザ間の表示に対しての問題を解決してくれるjavascriptを集めたエントリー「8 Javascript solutions to common CSS problems」を紹介したいと思います。 透過pngによる背景の問題だったり、カラム間の高さの問題などなど、レイアウトに関して起こりうる問題を簡単なjavascriptで回避する方法を示しています。今日はその中からいくつかピックアップして紹介したいと思います。 詳しくは以
スタイルシートをすっきりと見やすくしてくれる『styleneat』 | 100SHIKI
シンプルで素敵なツールだったのでご紹介。 styleneatはCSSファイルを見やすく整形してくれるツールだ。 これを使えばセレクタの親子関係がインデントされて見やすくなる。複雑な階層構造もこれならわかりやすい。 またそれぞれのスタイルの属性をアルファベット順に並べたり、一行でまとめたり、といったオプションもある。 スタイルシートがごちゃごちゃしてきたなぁ、というときに試してみるのはいかがだろうか。
CSSで実現する様々テクニック集「35+ very Useful And Powerful CSS techniques」
WEBをデザインしていく上で欠かせないCSS。厄介な部分もありますが、アイデアとテクニックしだいで様々な表現を可能にしてくれます。今日紹介するのはそんなCSSのテクニックをあつめた「35+ very Useful And Powerful CSS techniques」です。 10. CSS Curves 様々なTipsが公開されていますが、今日はその中からいくつか気になったテクニックをピックアップして紹介したいと思います。 詳しくは以下 ■6. Magazine StyleDROP CAPS テキストベースで雑誌のように頭文字だけ大きく表示するテクニック ■8. Link List Block Hover リンクを領域でHober指定するテクニック ■23 . CSS3 Multi-Column Module 2段組みを可能にしてくれるCSSモジュール 上記の他にも様々なCSSのテクニッ
CSSで円形のグラデーションを作成する - builder by ZDNet Japan
膨大なアクセスを支える屋台骨 高い安定性とパフォーマンスを両立 ZOZOTOWNが選んだストレージ基盤を解説 エッジ市場の活性化へ 高まるIoTを中心としたエッジ分野への期待 OSS活用が新しい時代のビジネスを拓く ハイブリッドクラウド時代の救世主 企業ITを素早く進化させるためのAVS サービス開始から1年で大幅に機能がアップ オープンソース活用はあたりまえ！ そんな今だからこそ改めて考える 企業ITにおけるOSS活用のメリットとリスク これからの社内DX 真のDXのため、まずは社内のデジタル化を DXのファーストステップのヒント ビジネスの推進には必須！ ZDNet×マイクロソフトが贈る特別企画 今、必要な戦略的セキュリティとガバナンス 最新ストレージで変わるIT運用 仮想化テクノロジーとFlashArrayの組合せで 運用負荷軽減と高性能化を実現したDMM ID管理の基礎知識 新しい
Firebug :: Add-ons for Firefox
Firebug は、Web ページを閲覧中にクリック一つで使える豊富な開発ツールを Firefox に統合します。あなたはあらゆる Web ページの CSS、HTML、及び JavaScript をリアルタイムに編集、デバッグ、またはモニタすることが出来ます。 Firefox 専用 — 今すぐ Firefox をダウンロード
ハイクオリティなフリーHTML&CSSテンプレート集「101 High Quality CSS And XHTML Free Templates」
TOP > WebDesign > ハイクオリティなフリーHTML&CSSテンプレート集「101 High Quality CSS And XHTML Free Templates」 今やWEB制作で標準ともいえるCSSとXHTMLによるレイアウト。今日紹介するのはそのCSSとXHTMLによって作られた無料のテンプレートを集めたエントリー「101 High Quality CSS And XHTML Free Templates」です。 Preview | Download 様々な種類、ジャンル、デザインテイストのテンプレートが集められています。今日はその中から気になったテンプレートをピックアップして紹介したいと思います。 詳しくは以下 ■Genious Web XHTML And CSS Template ワイドを大胆に使ったテンプレート。迫力があります。 Preview | D
CSSでPDFやExcelなどのリンクに自動でアイコンを付ける方法 | CSS Lecture
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
画像をCSSだけでハイクオリティに縮小サムネイル化する方法:phpspot開発日誌
Tip: High quality CSS thumbnails in IE7 ・Devthought 画像をCSSだけでハイクオリティに縮小サムネイル化する方法が紹介されています。 普通、IEで、img に対して、width, height 指定すると、画像が汚く縮小されちゃってましたが、CSSの指定をしちゃうとそれが解決されるということのようです。 具体的には以下のCSS指定によってそれが可能みたいです。 img { -ms-interpolation-mode: bicubic; } デモページ う〜ん、縮小してもとっても綺麗です。 FirefoxやChromeの場合は何も指定しなくても綺麗に縮小される、っていうのも知りませんでした。 これは、サーバサイドでサムネイルを生成しなくて良くなる場面が出てきて開発者としては手間の削減になりますね。 転送量を考えれば、サムネイルが完全に不要に
HTMLエディタ比較 (フリーソフトウェア)
◆ お知らせ：2008年9月27日(土) 『ぴあの好きの集い 第9回演奏会』◆ 上野旧奏楽堂。入場無料。 私は、アルベニス晩年の傑作ラ・ベーガを演奏します フリーソフトウェアのタグ挿入型HTMLエディタの機能比較をまとめたページです。普通のエディタと共に優れたフリーウェアソフトが乱立するこの分野。有っても良さそうな比較記事を載せたページが意外に見付からないので、意を決して自分で比較し、箇条書きにまとめてみました。といっても、ほんのメモ程度です。私が日々のHP書きに使用する中で、使えるか使えないか、だけが採用不採用の基準です。不採用のソフトは、1つ2つの致命的な欠損機能を指摘するのみです。 なお、比較検討をしたサンプルソフトは、窓の杜、VectorのPickUpで紹介されていたタグ挿入型HTMLエディタのみです。それ以外のエディタは含んでいません(一部例外あり)。これ以外に優れたHTMLエデ
PSDファイルをCSSレイアウトのHTMLに変換してくれる『psd2css Online』 | 100SHIKI
PSDファイルをCSSレイアウトのHTMLに変換してくれる『psd2css Online』 March 13th, 2009 Posted in その他 Write comment 便利だか便利じゃないのだか判断に迷うところだが、意欲的な試みなのでご紹介。 psd2css OnlineはPSDファイルをCSSレイアウトのHTMLに変換してくれるというツールだ。 肝となるのはPSDファイル中のレイヤーである。このレイヤーを判別してCSSのブロックにしているようだ。 Photoshopなんかでまずレイアウトを組んでいる人はまぁ、試してみてもいいかもしれない。 ただ、いろいろと癖があるようなので（テキストを配置するには？とか）、このツールの使い方を習得するまでに時間がかかりそうだ。だったらCSSを学んだ方が・・・という気がしないでもない。 ただ、用途を限定すればそれなりに便利、という人もいるだろ
CSS技研：ロールオーバーボタンで吹き出しを表示する - builder by ZDNet Japan
カーソルを重ねたときに吹き出しを表示する 今回のサンプルではリンクを設定したボタンにカーソルを重ねると、ボタンの下に吹き出しを表示するように設定した。カーソルの動作によってボタンとは別の場所に何かを表示する場合、一般的にはJavaScriptを利用するが、ここではCSSだけで設定している。 a{ display: block; width: 120px; height: 30px; overflow: hidden; } span{ display: block; width: 193px; height: 112px; background-image: url(home.png); background-repeat: no-repeat; text-indent: -9999px; cursor: pointer; } #movie span{background-image: ur
IE6問題に対処する10のテクニック | エンタープライズ | マイコミジャーナル
SitePoint: New Articles, Fresh Thinking for Web Developers and Designers 既報のとおり、IE6のシェアは純減を続けている。2009年2月のNet Applications調査によればIE6のシェアはFirefox 3に抜かれて3位に落ちた。今後も下落の傾向は続くとみる向きが多い。しかし、依然として19%を越えるシェアはその次のシェアを獲得している4.5%弱のSafari 3.2を大きく上回る。IE8のリリースが控えている状況ではあるが、WebデベロッパやWebデザイナは依然としてIE6対応を継続しなければならない。 IE6固有の問題を回避する方法はいくつもあるが、それらテクニックをまとめたドキュメントがSitePoint: 10 Fixes That Solve IE6 Problemsとして公開されたので注目しておき
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[CSS]上級者向け、スタイルシートのテクニック集
[CSS]ジャケ写をセクシーにスタイリングするスタイルシート | コリス
[CSS]リンクの情報をサポートするスタイルシートのテクニック集
画像マウスオーバ時のborder表示テクニック – creamu
スチーム速報 ＶＩＰ
脱初心者をめざす人のためのホームページ作成講座