[B! CSS3] tyukeのブックマーク

CSS3の勉強になるかも！？画像を使わないボタンの作成手順

CSS3を使うと画像のようなボタンも簡単に作れます。よくあるタイプのボタンですが、できあがりのコードだけだと勉強にならないので、作り方を順番に紹介していきます。今回、ChomeとFirefoxで動作確認しています。IEだとグラデーションが使えないので、同じボタンがたくさんあるように見えます。スマホサイト用なんかだと十分実用的だと思います。

tyuke 2012/04/06

あ、これわかりやすい

リンク

Daftar Serta Masuk Saat ini Di Situs Slots Online Terpilih Ojekslot

Daftar Serta Masuk Saat ini Di Situs Slots Online Terpilih Ojekslot Seperti yang kita pahami waktu ini ada sangat banyak permainan slot online paling sederhana yang dapat dimainkan dalam sekejap hanya cukup masuk di sana saja ojekslot terunggul. Di sini dapat ada sangat banyak bermacam permainan luar biasa yang pastinya dapat anda temukan dengan ringan. Beraneka permainan terbaik di sini dapat and

tyuke 2012/01/10

あとで見る

リンク

本の虫: Chromeがいつの間にか縦書きを実装し始めていた

注意：ここに示したCSSは、実用的な目的には、まだ使ってはならない。何故ならば、-webkitベンダープレフィクスを使っているからである。。これは、webkitの実装がまだ完全ではないことを意味する。 Chrome（というよりもwebkit）がいつの間にか、縦書きを実装し始めていた。つまり、CSS3のwriting-modeプロパティのvertical-rlとvertical-lrをサポートしているのである。まだ、ベンダープレフィクスが必要なので、完全な実装ではないのかもしれないが、少なくとも、ある程度は動くようだ。例えば、以下の様なマークアップが、 <p style=" writing-mode : vertical-rl ; -webkit-writing-mode : vertical-rl ; font-family : '@ＭＳ明朝' ; font-size : 16pt ;

tyuke 2011/03/19

リンク

【スマホ集中連載第4回】 "HTML5とCSS3で何ができる？" 〜メリット・デメリットを徹底研究！ : LINE Corporation ディレクターブログ

※この記事はChromeで見るのがおすすめです。こんにちは。新規開発グループディレクター兼マークアップエンジニアの浜です。スマホ連載の第4回目は、HTML5とCSS3という実装寄りの内容になります。とは言っても難しいコードはあまり出てきません。「HTML5とCSS3で何ができるのか」という事をメインに、知っておくと、構成書を作る時のアイディアベースになったりデザイナー・マークアップエンジニア（コーダー）と打ち合わせをする際に話しやすくなる内容をお送りします。記事のアウトラインは以下です。そもそも、HTML5とCSS3ってもう使えるの？ HTML5とCSS3を使うメリットは？ HTML5とCSS3で何ができるの？そもそも、HTML5とCSS3ってもう使えるの？使えます。（※ここから先は、その根拠について説明します。必要ない方は、次の章に飛んでしまっても構いません）現在のスマ

tyuke 2011/03/11

あとで読むか

リンク

CSSでアイコンをデザイン

ものすごく大雑把に言うと今まで画像編集ソフトでやっていた、角を丸くするとか背景をグラデーションにするなどという作業をCSSでやってしまおうというお話。もちろんCSSでできないことは多くあるので万能というわけではないが、できることに限って言えば数行のCSSコードでスクリーンショットのような効果を柔軟に適用することができる。 Demo: Design icon with CSS ul li a { display: block; width: 32px; height: 32px; background-image: url("icons-w.png"); background-repeat: no-repeat; text-indent: -10000px; } 各アイコンになるa要素へのスタイルは以上のような単純なものがベースになる。icons-w.pngがアイコンの前景をつなげたスプライ