CSS3関連の記事一覧



asahi.comが登場して20周年記念で、開設当時の様子を再現したページが公開されています。

トップページでリンクしているニュース記事は2015年8月10日の最新のものだが、ページデザインは横480ピクセルに収まるサイズで作られており、背景色はシルバー(bgcolor="#c0c0c0")で、「HTML 3.0をベースにデザインしています。Netscape 1.x の使用を推奨します。」との注意書きもある。

Netscape 1.xでの閲覧を推奨、20周年の「asahi.com」トップページが開設当時のデザインに -INTERNET Watch(Netscape 1.xでの閲覧を推奨、20周年の「asahi.com」トップページが開設当時のデザインに -INTERNET Watch)

20150822-BlinkタグをCSS3で再現-02

画像出典:Asahi NewsPaper Index(Asahi.com)


懐かしいですね。灰色の背景とか、バナーの感じとか、微妙に英語とか。



●昔よく使われていた文字を点滅させるタグ「blink」

このNetscape 1.0ネタではないですが、テキストを点滅させるblinkタグが昔のウェブブラウザーにあって、ホームページでよく使われていました。

こういうものですね。(アニメーションGIFです)

20150822-BlinkタグをCSS3で再現-01

何か懐かしさを感じる表現ですね。

最近のブラウザーではこのblinkタグに対応していないものがほとんどですが、これを新しい技術(CSS3)を使って再現してみます。

記事の続きを読む




20120425-CSS-Nite-in-Niigata-Vol3-01

4月21日に「CSS Nite in NIIGATA, Vol.3 with Microsoft」に参加してきました。

今回のテーマは「HTML5」ということで、これからのウェブで重要になる技術だと思い参加してみました。

Twitterで実況もやっていましたが、それも合わせながら、簡単なレポートを書いてみたいと思います。

記事の続きを読む



Glass City by jaxxon


CSS3のbox-shadowのプロパティを見ていて、実用性はあまりなさそうだけど、こういうこともできるんだなぁという発見をしました。

あまりにも小ネタ過ぎて忘れそうなので記事にしておきます(笑)。


Photoshopでベベルのオブジェクトを作ることがありますよね。
ボタンを作る際に以前は多用されていた気がします。(最近はかなり減りましたかね…)
20120329-ベベル-02


Photoshopのこのオブジェクトは幅と高さがともに200px、角の丸みは20pxのベクトルシェイプ(ベクトルマスク)で作成されています。
記事の続きを読む



Something wonderful arrived in the mail today. by simplebitsdan


最近、ウェブデザインで角丸が使える機会が増えてきたのでちょこちょこ指定して使っています(Internet ExplorerがあるのでjQueryも利用しています)。


そんな中、うかさんのツイートで以下のページのリンクが流れてきたので見てみたら、なんかテーブルの角丸で色々ご苦労されている感じでした。



これを読んでいたら角丸のテーブルを使うのが面倒になったのですが、Adobe InDesign使いならそんなことはありませんよね!

ってタイトルだけでオチがわかった人はこの後は読まなくても良いです(笑)。


さてInDesign使いがCSS3で角丸のテーブルを作るにはどうするのでしょうか。
記事の続きを読む



20110805-dtptransit-00

DTP関係の新しい情報発信をしてくれている「DTP Transit」ですが、サイトを見ていたらおもしろいことに気が付いたのでシェア。


ああ、こういうアイデアもあるのか〜と思いました。


まず該当のページを開きます。

20110805-dtptransit-01



何かお気づきですか?


記事の続きを読む



ブログ著者

名前:(Google+のプロフィール)

ケータイ好き。ガジェットが好きでiPhoneやらAndroidなどを所有。Surface Pro 2も持っている。

お仕事は印刷会社で営業・広報活動・DTPオペなどをしています。要は何でも屋さんです。最近は印刷関連より、自社のウェブサイトを制作するお仕事がほとんど。使用しているCMSはMovable Type。

ブログ著者について

サイト内検索