hxxk.jp - :before 擬似要素 / :after 擬似要素の活用例
記事データ 投稿者 望月真琴 投稿日時 2004-11-27T15:50+09:00 タグ CSS Firefox IE Opera Safari バグ 概要 hxxk.jp の場合は :before 擬似要素 / :after 擬似要素を随所に活用していますので、その例をいくつか紹介します。 リプライ 3 件のリプライがあります。 :before 擬似要素 / :after 擬似要素の使用例 :before、:afterってcontentプロパティ使って要素の前後にイメージやら文字やらを挿入するのにスゲェ便利だと思うのになぁ、って今仕事しながら思った。 同感です。 というか、 hxxk.jp の場合は随所に活用しており、 CSS の便利さを存分に噛み締めています。 私は e-luck さん ( Lucky bag::blog ) のアイデアのようなフッタ部分の更新には使っていません (
hxxk.jp - content プロパティに関するいくつかのメモ
content プロパティに関するいくつかのメモ http://hxxk.jp/2006/03/16/2359 前の記事 : Transitional DTD じゃダメなのかなあ 次の記事 : 春のツアーに出かけます 記事データ 投稿者 望月真琴 投稿日時 2006-03-16T23:59+09:00 タグ CSS hxxk IRC Safari アソシエイト バグ メモ 仕様 実践 Web Standards Design 概要 content プロパティに attr(X) 形式で HTML の属性値を指定する記述方法のメモと、 CSS3 のセレクタ関連の Last Call で示されている擬似要素の記述方法と、 Safari における content プロパティのバグや対応状況についてのメモ。 リプライ リプライはまだありません。 content プロパティに、任意の文字列と HTML
target="_blank" を使わないで新しいウィンドウでリンクを開く方法 - memo.xight.org
Summary target="_blank" を使わないで新しいウィンドウでリンクを開くための手法． Behaviour.js を利用すればより簡単，かつHTMLを汚さずに実装可能． Sample Source var myrules = { '.popup' : function(el){ var href = el.getAttribute('href'); if (href){ el.onclick = function(){ window.open(href); return false;} el.onkeypress = function(){ window.open(href); return false;} } } }; Behaviour.register(myrules); <script type="text/javascript" src="behaviour.js
設置ディレクトリと異なるページをホームにする│power source* » WP
いつも分かり易い文章で本当にお世話になっています :) 最近、私のサイトもURIのほうを少し変更したのですが、 （その際にもpower source*さんの説明がすごく役に立ちました） * 個別記事: http://bono.s201.xrea.com/年/月/記事ID-記事略称/ * カテゴリアーカイブ: http://bono.s201.xrea.com/category/カテゴリ略称/ * 日付別アーカイブ: http://bono.s201.xrea.com/date/年/月/日/ o 年別・月別の場合、個別記事の URI から記事ID以降を消しても OK。 http://bono.s201.xrea.com/年/, http://bono.s201.xrea.com/年/月/ * タグアーカイブ: http://bono.s201.xrea.com/tag/タグ名/
CSS drop shadow - webtoolkit.info
Technique to build flexible CSS drop shadows applied to arbitrary block elements. Most of the existing techniques for creating element shadows use images, this one doesn't. IT uses plain simple CSS. Have a look below. Technique to build flexible CSS drop shadows applied to arbitrary block elements. Most of the existing techniques for creating element shadows use images, this one doesn’t. IT uses p
World Wide Walker: 長い文字列の改行方法 - wbr, , css
長い文字列の改行方法 - wbr, ­, css Posted by yoosee on Web at 2005-01-04 23:42 JST1 wbr例えばかなり長いドメイン名や URL を、それに対してあまり広くない block 要素の中に入れたいとする。普通に入れると文字だけ枠からはみ出したり、ブラウザに横スクロールバーが出たりとあまり嬉しくない事が起こる。 そういった際に使う要素として <wbr> と言う NN や IE での拡張タグがあり、これを入れた場所での改行を許す、と言う効果があるらしい。但しこれは W3C の HTML/XHTML の仕様には無い拡張仕様、なのだが、現実には Gecko でも対応しているように見える。2 ­ - ソフトハイフンこの代りには、 ­ ないし ­ と言う特殊文字が使えるようだ。<!ENTITY shy CDAT
長～いURLによるカラム落ち、に対処する - Archiva
Make a note of it: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い！情報の正確性は自己責任で判断してください。 長いURL(半角英数字）を強制改行させるには、CSSで「word-break: break-all;」を指定すれば良い。これはIEの独自拡張で、IE5.0から対応しています。 通常のボックス要素の場合だと、Opera/firefoxではボックスを突き破りはしても、ボックスを拡張したりはしない。 幅が指定されたボックス要素を拡張してしまうのはIEのバグなので、通常は「word-break: break-all;」で大きな問題は無いです。（レイアウトが崩れない、て意味ね） ただし、table要素に詰まっていると、ややこしくなります。table要素は特殊なブロック要素で、中
[N] Macに"Switch"する人のためのソフトとTipsのまとめ
標準状態でもかなり使いやすいMacですが、いろいろとソフトを試してみたりしたくなるもの。人によってはもちろん、標準状態では足りないと思われる機能もあるでしょう。 “Switch”したばかりだと、どんなソフトをインストールして良いか分からない場合もあると思いますので、便利なソフトがお薦めされているネタフルのエントリーをまとめてみました。 また知っておくと役に立つTipsのエントリーもまとめています。 ソフトに関連するエントリーのまとめ ▼“Swicther”にお勧めのMacソフト12本 ▼最も美しいMacアプリケーションのトップ10 ▼オープンソースなMacアプリケーションのトップ10 ▼Web系エンジニアが”Switch”してお勧めする10 Mac Apps ▼WinユーザのためのMac講座「オンラインソフトを選ぶ」 ▼10 Mac Apps（ネタフル） ▼Mac用オープンソースソフトリス
![[N] Macに"Switch"する人のためのソフトとTipsのまとめ](https://cdn-ak-scissors.b.st-hatena.com/image/square/b006408dc8d9f6f5e8e677818a64fc3c79c421f9/height=288;version=1;width=512/https%3A%2F%2Fnetaful.jp%2Fwp-content%2Fuploads%2F2006%2F11%2F4756146740.09.MZZZZZZZ.jpg)
Thunderbird Help: 便利な使い方
【訳注: この Thunderbird Help (和訳) の内容は Thunderbird 1.0.x を対象として書かれており、Thunderbird 1.5 の状況とは異なる部分があります。現在、Thunderbird 1.5 向けに更新作業を進めておりますので、今しばらくお待ちください。】 このページには Thunderbird の様々なヒントや便利な使い方が載っています。これらのヒントの多くは、ハードドライブ上のテキストファイルを編集する必要があるものですので、ファイルやフォルダの基本的な扱い方に慣れていない場合はお勧めしません。これらのヒントは、2 つのカテゴリに分類した上で、重要度や人気度順に並べてあります。 目次 プログラムの外観 引用レベルによって色を変える ニュースグループ名を短縮形ではなく完全な名前で表示する メニューを Windows XP スタイルに変
【CSShack/ＣＳＳハック】いつie7リリースがあってもこれで大丈夫！なハック::::::STOPN' LISTEN::::::to the silence:::::::
免責事項：本サイトに含まれる情報は、一般的な情報提供のみを目的としています。情報はスペシャルベストによって提供され、当社は情報を最新かつ正確に保つよう努力しますが、いかなる目的においても、ウェブサイトまたはウェブサイトに含まれる情報、製品、サービス、関連グラフィックスに関する完全性、正確性、信頼性、適合性、利用可能性について、明示または黙示を問わずいかなる表明または保証も行いません。従って、これらの情報に依拠することは、あくまでもお客様ご自身の責任において行われるものとします。 当社は、当ウェブサイトのご利用に起因するいかなる損害についても責任を負いません。 本ウェブサイトから、スペシャルベストの管理下にない他のウェブサイトへリンクすることができます。当社は、それらのサイトの性質、内容および利用可能性を管理することはできません。リンクは必ずしも推奨するものではありませんし、リンク先で述べら
Lucky bag::blog: ピュア CSS なプレゼン用スライドショー
前回の「CSS3 の target 疑似クラスで脚注を動的に表示する」に引き続き、:target 疑似クラスを使ってスライドショーみたいなんを作ってみた。ひとつの HTML 文書なんだけど、画面が切り替わっていくかのように見せる。ピュア CSS とか言いつつも、前回同様、:target 疑似クラスに未対応な IE でも動くように JavaScript を使っている。純粋に CSS のみで動くのは、Firefox、Safari あたり。Opera は動かない。 ピュアCSS なプレゼン用スライドショー サンプル <div id="section-01" class="section"> <!-- 1ページ目 --> … </div> <div id="section-02" class="section"> <!-- 2ページ目 --> … </div> <div id="section-0
最速インターフェース研究会: Synergyの裏設定「switchDoubleTap」を知らない人が多すぎる
LANで繋がっているマシンのマウスとキーボードを共有してWindowsとMacをつなげたりといったことが出来るSynergyというツールがあるのですが、Synergyの設定ファイルに section: options switchDoubleTap = 250 end などとやると、デスクトップの端っこをコンコンと二回タップしたときだけ画面が切り替わるようになります。切り替える際に一手間増えることになりますが、そんなに頻繁に画面を切り替えるわけでもないのでさほど気になりません。WindowsのサーバーだとOptionsの中に項目があります。トラックボールを使うようになってから暇なときはボールを勢いよく転がして遊んでいるのですが、デスクトップが頻繁に切り替わってしまって鬱陶しいことになります。また、最近ではホイールを使うのでスクロールバーを使わないという人も多いかとは思いますが、スクロールバ
朝顔日記 - Firefox 1.5 から 2.0 へ移行した際に役に立つかもしれない設定とか
2006-10-25 ua firefox Firefox 2.0 リリース記念企画ということで、Firefox 1.5 から 2.0 ヘ移行したときにアレっと思うような変更点とか、便利な新機能を使うための Tips などを書いてみましょう。 タブの閉じるボタンが邪魔な場合は Firefox 2.0 からタブごとに「閉じるボタン」が装備されましたが、about:config などを使って browser.tabs.closeButtons の値を変更してやることで、この「閉じるボタン」を非表示にしたり、Firefox 1.5 までと同様、タブバーの端にひとつだけ表示するようにしたりすることができます。 about:config の使い方ですが、ロケーションバー（URLなどを入れるところ）に about:config と打ち込みます。次に、フィルタの欄に設定名を入れます。この場合、brows
【コラム】OS X ハッキング! 第179回 "pmset"でMacBookを「冷凍睡眠」させる (MYCOMジャーナル)
スニーカーに仕込んだセンサーで運動量を測定、iPodにリアルタイム表示する「Nike+iPod」が発表されました。もう終了しちゃいましたが、米国の人気TVドラマ「SEX AND THE CITY」のミランダ用小ネタ(デジタルガジェット好きな女性なんです)にピッタリかも。ところで、このTVドラマ、歴代のPowerBookが登場するので、機会があれば是非。 さて、今回はパワーマネジメント用のコマンド「pmset」について。システム環境設定の「省エネルギー」ペインの代替として機能する一方、ペインには省略されている各種スイッチも用意されているので、pmsetでなければ変更できない設定もある。特にMacBook/MacBook Proユーザは、知っておいて損はないはず。なお、本稿ではMacBook 1.83GHz/Mac OS X 10.4.6をテスト機として使用しているので、念のため。 pmset
Mini Pixel Icons
Over 320 mini pixel icons! All Free! These mini icons are designed at 14×14px with transparent background. They are specially designed for header or side navigation buttons. Feel free to use these icons for your site (personal or commerical). However, if you are using more than 10 different icons, you must give a link back to N.Design Studio. If you like these icons, please help me to spread out t
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IE6カラム落ちを防ぐ方法
woollywormer | SonyPlaza
サービス終了のお知らせ
Next Generation Color Filter Patterns Deliver Higher Quality Photos Under Low-Light Conditions
Adobe Flash Player - Downloads
