どう考えても無茶な「CSSプログラミング」が話題に
CSS3がいくらパワフルとはいえ、さすがにここまで凝ったものが作れるとは思いませんでした。 まずはChromeでこちらを遊んでみてください。 CSS3 OF THE DEAD - jsdo.it - share JavaScript, HTML5 and CSS まるでJSをバリバリ使ったゲーム、のように見えますが、実は「Only CSS」。上のSTOPボタンを押すとコードを確認することができます。 jsdo.itでCSSプログラミングが流行中！ ええ、どう考えても無茶なんです。CSSはプログラミング言語じゃないですからね。 CSSの機能を巧みに組み合わせて作成されています。 ということで、投稿作品のほんの一部を紹介したいと思います。 CSS PANIC CSSだけで作られたワニワニパニック。 このコードは海外のユーザーにも大きな反響を呼びました。
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
HTML/CSS/JS製の小さなスライドツール『kyubey』をつくったよ - ✘╹◡╹✘
説明 タイトルはほとんど釣りです。奇跡も魔法もありません。最近よく勉強会をしているという話を前回のエントリで少ししましたが、プレゼンするのにいちいちKeynoteやPowerPointを開いていては骨が折れるし、参加出来なかったメンバーが後からWeb上でスライドを見たいということもあるので、自分でHTMLで手早くスライドを作るためにツールを作りました。jQueryやその他ライブラリが頑張って働いてくれたのでJS部分は実質100行弱のコード量でした。*1 kyubeyはjQueryを利用して作った小さなスライドツールです。作ったばかりなので機能はほとんどありませんが、小さいが故にコードの理解や拡張がしやすいかと思います。Githubに公開しているので良ければお使いください。ちなみに下記サンプルとソースコードを見て頂ければ大体理解出来るかと思います。機能要望があれば今後拡張していくつもりです。
はてブで特定アカウントの RT を非表示にするユーザースタイル - lovely::memo
はてブと Twitter の連携で、RT されるとブックマークに表示されるようになり、拡散具合が目に見えて楽しい（こともある）のですが、bot の反応はいらないわー、と思ったのでまたまたユーザースタイルで対応。 @-moz-document url-prefix("http://b.hatena.ne.jp/") { div.tweets ul.retweet-tree li[data-twitter-screen-name="●●●"] { display : none !important; } } ●●● の部分に、非表示にしたい Twitter アカウントを入れてください。 これが こんな感じになります。
はてなスターのユーザー名をCSSだけで強引に表示 - os0x.blog
なんとなくブログの見た目を少しいじった(テスト前になると部屋を片付けたくなるアレ)。 シングルカラムだと横に間延びするのは前から気になってたので、max-widthを1000pxで設定して、あとフッターをシンプルに。 で、はてなスターってデフォルトだとマウスを乗せるまで誰のだかわからないのが気になってて、自分ではGreasemokey Scriptでユーザーのアイコンに置き換えてるんですが(hatena big profile star)、そういうことをしてない多くの人はが並んでいるだけで、わかりにくいなーと。 ってことで、装飾してやろうと思ったけど、CSSだけだとやはり厳しい。まあ、IEを考えなければ(IEだと普通の表示のまま)ってことで、afterとか使って強引にIDを表示してみた。 CSSはこんな感じ(ネガティブなtext-indentとoverflow:hiddenというよくあるバ
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
[hatena] はてブエントリーページに投稿された AA をより AA っぽく表示するユーザースタイル - lovely::memo
先に言っておきますが、ネタです。どこかで「ユーザースタイル書く人が云々」というコメントを見たので、Firefox でやってみました。 @-moz-document url-prefix("http://b.hatena.ne.jp/entry/") { div.tweets ul.retweet-tree li { margin : 0 5px 0 7px !important; line-height : 1.0 !important; } div.tweets ul.retweet-tree li span { font-family : "ＭＳ Ｐゴシック"; } } これで、 デフォルトでは↑こんな感じのが ↑こうなります。 Windows OS 以外の方は、フォント名を適当に変えてください。 スクリーンショットは、id:tezawaly さんの作品をお借りしています。ありがとうご
![[hatena] はてブエントリーページに投稿された AA をより AA っぽく表示するユーザースタイル - lovely::memo](https://cdn-ak-scissors.b.st-hatena.com/image/square/f950f5ea99fb39c4963d65e0cd1f2002f216a6ca/height=288;version=1;width=512/http%3A%2F%2Fimg.f.hatena.ne.jp%2Fimages%2Ffotolife%2Fl%2Flovely%2F20100907%2F20100907132150.png)
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
[CSS]スタイシートだけで実装するアクセシブルな折れ線グラフ
スクリプトやフラッシュを使用しないで、スタイルシートだけで実装する折れ線グラフをcss globeから紹介します。
IE8 RC1 - IE8でも px(ピクセル)指定フォントサイズが変更できない(標準準拠モードでも) - Hato-Style
2009年01月27日 （火） XHTML/CSS | ブラウザ Internet Explorer 8 RC1(Release Candidate 1)がリリースされていました。Windows Internet Explorer 8: Home page からダウンロードが可能です。 Windows XP,Windows Vista,Windows Server 2003,Windows Server 2008に対応しております。怖いのでVMWare FusionのWindows Vistaに試しに入れてみました。 気が付いたことが一つ。 IE8の標準準拠レンダリングモードだと、CSSの記述によってはフォントサイズが変更できない。とくにCSSでbody要素などにベースフォントサイズでpx指定(ピクセル指定)しているサイトは、フォントサイズが全く変更できない。従来通り固定されてしまう。この
IE6、Firefox3で色指定が逆になる - OKWAVE
Mac環境、HTMLとCSSでHPを作成しています。手書きです。 ブラウザチェックの為にウィンドウズを導入しチェックしました。 Mac環境のFirefox3.05、Safari3.2.1で確認すると、指定通りの文字色なのですが（CSSでの指定#ff0000で赤）、WindowsのIE6でチェックした所、１６進数の逆の色で表示されました（#ff0000で青）。 ずっと手書きでやってきたので、今までの経験上、自分の間違いなども同時に確認する為や、他のタグやクラスとの干渉を見る為に、CSSは色指定したその箇所のみを、HTMLは指定された文字やタグ（仮にここではh1タグとします）のみを新しいファイルに書いたりして試行を繰り返したのですが、どうやら間違いなく逆の色を表示しているようです。 そこで友人のPCで、同じIE6でチェックしてもらった所、同じページの同じソースを正しく表示されました（#ff00
Firefox だと沖縄県警サイトが悲惨になる件について - xenoma日記
Firefox で沖縄県警のサイトを見てみましょう。たぶん悲惨なことになっていると思います。縮小キャプチャを以下にあげておきます。 ▲左：Firefox3 右：IE7 (沖縄県警のサイトTOPのキャプチャ（部分・縮小）) IE など他のブラウザだとキレイに見えるのに、なぜ Fx では悲惨なことになるのでしょうか？ 原因の推測 スタイルシートの指定の仕方が原因かと思います。ソースを見てみます。 <link rel="stylesheet" href="css/import.css" type="text/css" media="print" /> <link rel="stylesheet" href="css/import.css" type="text/css" media="screen" /> このように同じファイル（import.css）を2度指定しています。指定されている imp
2007-07-19
CSSってのは、もっと殺伐としてるべきなんだよ。 テーブルレイアウトの紙媒体デザイナーと、いつ喧嘩が始まってもおかしくない、 刺すか刺されるか、そんな雰囲気がいいんじゃねえか。ネットイナゴは、すっこんでろ。 で、やっと普及したかと思ったら、モテ系エンジニアがWeb2.0とか言ってるんです。 そこでまたぶち切れですよ。 あのな、Web2.0なんてきょうび流行んねーんだよ。ボケが。 得意げな顔して何が、CSS Nite、だ。 お前は本当にWeb標準を促進したいのかと問いたい。問い詰めたい。小１時間問い詰めたい。 お前、Web標準って言いたいだけちゃうんかと。 ＜以下略＞ 尾石達也リスペクトでコピペを使ってみたかった。反省はしていない。 正直どうでもいい騒動なのですが、要約すると、クールでポップでオシャレでモテモテな紙媒体出身のDTPデザイナーがDreamweaverで作ったTABLEレイアウト
ブログペットを搭載してみました - メンドクサイケド…
で、 ブログペットの横にある小さな枠線を消したいんですけど＞教えてはてなダイアリー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
リンゴが好きでぃす♪2.0 - 画像を使わずにiPod nanoを描いてみた
スチーム速報 ＶＩＰ
https://az-store.nrym.org/archive/ima/cgi-bin/mt/2007/01/post_89.php
CSSコミュニティ22th
blog TK * Plus1
はてなアイデア