(X)HTML Referenceこれから (X)HTML をはじめて勉強する方向けのHTML4.01/XHTML1.0,1.1のリファレンスです。
便利なCSS3ツール6つ＋α:phpspot開発日誌
Six Useful CSS3 Tools | Tools 便利な６つのCSS3ツールがまとまったエントリを＋αでご紹介。 まだ覚えていないプロパティなんかもWYSIWYGやジェネレート等で簡単に理解＆覚えることが可能です。 CSS3 Button Maker CSS3なボタンメーカー。角丸やシャドウの指定が可能 CSS3 Generator CSS3を使ったスタイル効果をブラウザ上で簡単ジェネレート CSS3 Please! クロスブラウザ向けのradiusやshadow等を一括生成 CSS3 Gradient Generator CSS3のグラデーション生成ツール CSS3 Transforms WYSIWYGでCSS3のtransformプロパティを生成可能 CSS3 Selectors Test ブラウザのCSS3対応状況が分かるツール CSS3 Click Chart by Im
CSS3 Selectors Test, CSS3 .info
After starting the test-suite it will automatically run a large number of small tests which will determine if your browser is compatible with a large number of CSS selectors. If it is not compatible with a particular selector it is marked as such. You can click on each CSS selector to see the results, including a small example and explanation for each of tests. Because it is technically not possib
Jon Combe | Code | HTML clocks using JavaScript and CSS rotation
Warning: This isn't going to work in any currently available version of Internet Explorer* or many older browsers. The two clocks below are just HTML. There are no Adobe Flash files or my beloved <canvas> going on, just regular <div> and <img> tags. The way it works is by taking those images in an { overflow: hidden } <div> and rotating them, via JavaScript, using the proposed CSS transform proper
CSS3等を使ったサンプルや各種CSSリソース集:phpspot開発日誌
使えそうなCSS3等を使ったサンプルや各種CSSリソース集をまとめてみました。 CSS3に関しては対応ブラウザはまだ主流ではないとはいえ、CSS3等も徐々に学んでいきたいですね。 Text Blocks Over Image | CSS-Tricks 画像上にかっこよく文字を合成するチュートリアル →デモページ ZURB ? Super Awesome Buttons with CSS3 and RGBA css3の機能を使ってリッチなボタンを作成するチュートリアル Carsonified ? 30 Essential CSS3 Resources CSS3を学ぶのに使えるリソース集 CSS Gradients via Canvas | Weston Ruter Canvasを使ったCSSグラデーション作成 The Definitive Guide to Using Negative Ma
Creating a Keyboard With CSS and jQuery | Envato Tuts+
Sometimes it's just fun to play around with the programming languages we know and see what we can create. I thought it might be nice to create a little online keyboard with CSS, and then make it work with jQuery. The keyboard includes "action" keys (caps lock, shift, and delete) which dynamically changes the keyboard when clicked. I'll show you how to build it today and it could also be a good jQu
Pure CSS Timeline – Notebook | MattBango.com
I wanted to build a CSS timeline for the “About” section of my site while using some clean and simple markup. I wanted to avoid using images as much as possible, so I spent a few minutes prototyping some options and came up with a solution using unordered lists. The result is a simple and clean looking timeline with some very straight forward markup. In this article I’ll share my approach to crea
[CSS]スタイルシートを自動でIE6対応にするオンラインサービス -ie6fixer
手元のスタイルシートをフロートやネガティブマージンなどIE6のバグを回避する記述を自動生成するオンラインサービス「ie6fixer」を紹介します。 ie6fixer IE6に対応したスタイルシートを生成する方法は、以下の手順です。 「master stylesheet」の欄に、スタイルシートを入力。 「Give me my ie6 fixes」ボタンをクリック。 以上で、IE6のバグに対応したスタイルシートが生成。 IE6のバグに対応している箇所は、現在のところ下記の通りです。 「min-height」は、「height」に変更。 「float」は、「display:inline;」を追加。 「position:relative;」は、「zoom:1;」を追加。 ネガティブマージンは、「position:relative; zoom:1;」を追加。 「overflow:hidden;」は、
Table Layouts vs. Div Layouts: From Hell to… Hell? — Smashing Magazine
Over the last several years, developers have moved from table-based website structures to div-based structures. Hey, that’s great. But wait! Do developers know the reasons for moving to div-based structures, and do they know how to? Often it seems that people are moving away from table hell only to wind up in div hell. This article covers common problems with layout structure in web design. The fi
Best Website Builder Reviews & Guildes
My Website Builder Reviews & GuidesMy name is Lesley Haught, and this is my website for website builder reviews, testing, comparison, and guides. There are more than 200 different website builders and online platforms for self-launching websites in the world. You’d think creating your own website would be simple. The reality? Many of these platforms fall short. That’s why I put the top website bui
[CSS]外部スタイルシートの指定は@importとlinkでどちらがいいか
外部スタイルシートの指定は@importとlinkでどちらがいいかと、書籍「ハイパフォーマンスWebサイト ―高速サイトを実現する14のルール」の@importはパフォーマンスに悪影響を与えることについてのフォローアップを紹介します。 don't use @import 内容は、IEでは@importで外部スタイルシートを指定すると、パフォーマンスに悪影響を与えるので使用しないでください、というものです。 下記は、外部スタイルシートを@importとlinkを組み合わせて、それぞれのパフォーマンスを比較したもので、キャプチャはそのサイトのものと、参考に当環境でIE7/Fx3(XP)を検証したものです。 @import @import 2つの外部スタイルシートを@importで指定。 <textarea name="code" class="html" cols="60" rows="5">
テキストを動的にアンチエイリアスがかった綺麗な画像にする仕組み色々:phpspot開発日誌
Dynamic Text Replacement Solutions | Dezinerfolio テキストを動的にアンチエイリアスがかった綺麗な画像にする仕組みが色々とあるみたいです。 FlashやPHP、CSS、JavaScriptの要素をトリッキーに混ぜ合わせているところも見所です。 P+C DTR PHP+GDで綺麗なテキストを生成し、JavaScriptでbackground-image設定して表示します。 そもそもがテキストになっているので、HTMLもクリーンです。 見え方は以下のように、綺麗なテキスト 生成されたHTMLはh5要素として、次のようになっています。 <h5 style="background-image: url(image.php?text=You%27re+Look%27n+At+It&tag=h5);">You're Look'n At It</h
よいCSS開発を行うための８のＴＩＰＳ:phpspot開発日誌
8 methods to bring your front end coding to rockstar levels | StylizedWeb.com よいCSS開発を行うための８のＴＩＰＳとして、当たり前かなと思うことから、なるほどというものがあったので以下にご紹介。 ・IDやクラス名にはより意味のあるものをつけよう たとえば、boxとかwrapperとかcontainerとかは一般的ですね。 一般的なものをつけておけばそれが何なのかすぐに分かるし、協業の際にも便利。 全体のラッパー以外にも、headerとか、content とか footer とか固定で使っておくと一貫性が出ていい感じですね。 まあ当たり前の人には当たり前なテクニックかも。 ・閉じコメントをつけて構造を分かりやすく <div id="header" class="section"> <div id="header-
Free Online CSS Beautifier / Formatter - Styleneat
What does Styleneat do exactly? It organizes and standardizes your CSS - selectors, sub-selectors and properties - in a structure that makes it easier to define page areas and see how they relate to each other. So, for example, it turns this: #id1 { property: value; } #id1 .class1 { property: value; } #id1 .class1 a { property: value; property2: value2; property3: value3; } #id1 .class1 a span { p
WEBデザイナーという肩書きを使う場合にあったらいいかもなスキルとWEBで見れる無料教材とリソース集:phpspot開発日誌
WEBデザイナーという肩書きを使う場合にあったらいいかもなスキルとWEBで見れる無料教材とリソース集 2009年03月23日- WEBデザイナーという肩書きを使う場合にあったらいいかもなスキルとWEBで見れる無料教材とリソース集。 プログラマが１ヶ月でWEBデザイナーに転身する方法 というエントリを見て、プログラマの方々のWEBデザインに関する関心の高さを見て書いてみます。 WEBデザイナーといっても色々な知識が必要で、かつ、最近はフリーのテンプレートも豊富にある中、どれだけ出来ればWEBデザイナーとして成り立つのだろう？という疑問がありましたので考えてみました。プログラマの方で、WEBデザインをやってみたい。また、全くの素人だけどWEBデザイナーを仕事にされたいという方の参考になれば幸いです。 最低限の知識編 1. HTMLとレイアウト力 まず、知っている人には物凄く当たり前の事ですが、
14 Most Useful Web Design Cheat Sheets
One Ping Pingback: 18 Seriously Helpful Cheat Sheets for Easier Coding | Web Design Ledger 60 Comments Thanks! Just snagged me a couple cheat sheets. Merci !!! Thank you !! 🙂 thanks for a great post. you got the link of the Flash CS3 Cheat Sheet wrong.. These are some really useful resources and will hopefully save me a lot of headaches! Nice selection, I actually just thought it would be the sam
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
CSS セレクタに関するおさらい | WWW WATCH
CSS を扱う上でセレクタの存在はとっても重要です。特に CSS3 Selectors ではかなり複雑な条件分岐ができるようになっていますので、スマートな (X... CSS を扱う上でセレクタの存在はとっても重要です。特に CSS3 Selectors ではかなり複雑な条件分岐ができるようになっていますので、スマートな (X)HTML、CSS コーディングを行う上で、セレクタを理解しているとそうでないのでは生産性に差が出ます。 CSS3 は現在 Working Draft の段階ですので、まだ正式な勧告はなされていませんが、多くのモダンブラウザにおいてそのほとんどが先行実装されていることから、現状でも利用価値が高いといえます。 ということで、ここでは自分へのメモの意味も込めて、CSS3 で定義されているものも含めた各 CSS セレクタについてリファレンスしてみようと思います。 今回の解説
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
dwlog.net
Downloads - html5resetcss - Project Hosting on Google Code