BloggerGoogle のウェブログ公開ツールを使って、テキスト、写真、動画を共有できます。
TRANS - 英語圏から学ぶ、body要素に対するfont-size指定方法のまとめ
YUI Fonts CSSのfont-sizeで悩み始めてから、font-sizeってどういうのがいいのだろう、と考えていました。そこで、英語圏ではどういうふうに指定しているのが多いのだろうと、いろんな記事を読み漁ってみました。いろいろなやり方はあるにせよ、5つくらいのパターンに分けられるんじゃないかなと思うので、まとめておきます。 font-size: 100%; 主に、body要素に用いられるもの。font-sizeを100%で指定しておいて、font-sizeの指定はユーザの好き好みに合わせるというもの。ユーザビリティに配慮したり、ユーザスタイルシートを生かして読んでほしい場合はこの指定が多いようです。 font-size: 100.01%; 最近ちょくちょく見掛ける、body要素に対して100.01%を指定するというもの。これは、Re: WSG Setting Up Font Si
MOONGIFT: » 必見！CSSを使って複数の画像を一つに「CSS Sprite Generator」:オープンソースを毎日紹介
Googleの表示速度の速さの秘密に、コネクションを極力減らすということがある。それが複数の画像を一つにまとめてしまい、CSSのポジションをずらすことで表示するという手法だ。これを使うと画像のダウンロードは一回で済むのでコネクションが少なくて済む。 実際、検索結果のGoogleロゴを見ると、複数の画像が混ざった結果なのに気づくはずだ。これをやるのは非常に面倒に感じるだろう。だが、小さなアイコンなどはこういう手法をとればサイトの負荷軽減、高速化につながる。それを手軽に実現できるのがこのソフトウェアだ。 今回紹介するオープンソース・ソフトウェアはCSS Sprite Generator、CSSによる画像分割補助ソフトウェアだ。 CSS Sprite Generatorは複数の画像をZipで固めてアップロードすると、その画像を連結し、さらに表示するためのCSSを生成してくれる。これを使えばまさに
使えるCSSメニューいろいろ:phpspot開発日誌
使えるCSSメニューいろいろ 1. Advanced CSS Navigation Menu Example まず、ホバー時以外は文字をぼやかせるCSSメニュー。 次のようにマウスホバー時は文字がクッキリするメニューのサンプルです。 JavaScript レスで実装できるので JavaScript なしがいいという方にはオススメ。 ただし、動かないブラウザもあるようなので注意が必要ですね。 2. Suckerfish Dropdowns - Perciformes! 次にCSSとJSで階層メニュー。やはりこのＵＩは直感的に操作できますね。 類似：CSSのみでクールな階層メニュー作成サンプル、CSSベースの階層メニュー作成ライブラリ 他にも色々と掲載されています メニュー関連エントリ PHP＆CSSで動的にドロップダウンメニュー作成 ドラッグ＆ドロップで描画して好きなHTMLレイアウトを作成
いまさらHTML,CSS入門講座
方向アイコンと新規ウィンドウで開くアイコン 140色 カラーコード / カラーネーム FFFTPの使い方 相対単位と絶対単位 絶対パスと相対パス Google アナリティクスに登録 Google アナリティクスとウェブマスターツールの関連付け Wi-Fi Nexus7(2012)の設定例 Wi-Fi iPhone5の設定例 かめぞうブログで使えるHTMLタグ Windows 10 フォルダに格納されているファイルの順番を自由に並び替えできるようにする。 Windows 10のコンテキストメニュー（右クリックメニュー）に「プレビュー」を追加し、Windows フォト ビューアーを起動する方法 管理人の運営サイト、ブログ、SNS等 RAWで撮ろう Life with a camera Life with a camera 2 facebook おすすめサイト 風と樹と空とフリー素材 W3C R
Blog: Learning-Life.Net
by Koichi Yoshizaki※ 若干追記しました（2006年5月9日）．変更点はこちらをご覧ください． 現在，xhtml1.0とcss1を用いてeラーニング教材を作成する際の，自分なりのスケルトンファイルを作成しています．その際に下付き文字と上付き文字を表現するXHTMLタグであるsubとsupについて調べたことをメモしておきます． 【subとsupは非推奨なのか？】 xhtmlは情報のstructureを，cssはpresentationを記述するということは良く知られています．このためsubタグとsupタグを使って良いのかが気になります．実際，web上ではこれらのタグは非推奨と言う記述や，これらを用いずにspanタグにvertical-align属性を用いた上/下付きを説明しているwebページを見かけます．これに対してw3cが定める標準を見ると，XHTML1.0ではもちろん
CSS 切り替えスイッチ用スクリプト修正
以前紹介した、「CSS レイアウト切り替えスイッチ」、及び 「12 のレイアウトを切替可能なテンプレート」 ですが、特定の状況でスクリプトエラーが発生して正常に... 以前紹介した、「CSS レイアウト切り替えスイッチ」、及び 「12 のレイアウトを切替可能なテンプレート」 ですが、特定の状況でスクリプトエラーが発生して正常に動作しないとの指摘を受けましたので、ちょこっと修正しました。 原因は CSS の切り替え用スクリプトとして使用していた 「styleswitcher.js」 で、(X)HTML ソース内に、rev 属性を指定した link 要素が記述されていると 「Error: a.getAttribute("rel") has no properties」 のようなエラーが帰ってきて終了という状態になっていました。 でちょっと見直してみたんですが、styleswitcher.js
Best Web Gallery - CSS & Flash Design Inspiration
Blog The Blog StarterVN:R_N [1.9.17_1161]Rating: 5.0/5 (1 vote cast) Portfolio Jenny JohannessonVN:F [1.9.17_1161]please wait...Rating: 3.6/5 (8 votes cast) Best of Adult Swim Singles 2016VN:F [1.9.17_1161]please wait...Rating: 4.1/5 (9 votes cast) Portfolio Alexandre RochetVN:F [1.9.17_1161]please wait...Rating: 3.8/5 (5 votes cast) CSS Converse: DiamondsVN:F [1.9.17_1161]please wait...Rating: 3.
FreeCSSTemplates.org is now FCT.co
FreeCSSTemplates.org has been rebranded to FCT. Therefore, our new domain will be FCT.co while our previous domain FreeCSSTemplates.org will always be kept redirected here. What happened to FreeCSSTemplates.org? As the domain FreeCSSTemplates.org was dedicated to just “Free CSS Templates“, we decided to expand our brand name by keeping the domain name short but with more topics to cover. That mean
MOONGIFT: » CSSを最適化「CSSTidy」: オープンソースを毎日紹介
最近のWebサイトはテーブル組ではなくCSSで構築することが多い。その分、ブラウザ互換性を確保するのが大変な場合も多いが、文書構造的にも分かりやすいものが出来上がる。 それもあって、CSSが肥大化する傾向が見られる。余計なプロパティや値の設定がないか、ツールを使ってチェックしてみよう。 今回紹介するオープンソース・ソフトウェアはCSSTidy、CSSを最適化するソフトウェアだ。 CSSTidyはCSSの最適化処理を行うソフトウェアで、正当性を評価する訳ではないようなので注意されたい。重複するプロパティや、値の指定方法などをチェックし、サイズが極力小さくなるように指摘してくれる。 サイズが小さくなることで、ロード時間が短くなり、トラフィックコストも軽減されるというのが狙いだ。コメントや余計な半角スペースなども削除されるので、圧縮ツールとしての役割もある。 CSSTidyはC++版とPHP版と
MOONGIFT: » Webサイトを手軽にクールに「GreyBox」:オープンソースを毎日紹介
最近のWebサイトでは画面遷移をなくし、Ajax化するのが好まれる。とは言え、既存のサービスに対して実装するのはそうそう単純ではない。それにAjaxを使った場合、PVの計測が難しく、メディア等では取り入れづらい。 だが、これを使えば簡単にそれっぽい実装ができそうだ。 今回紹介するオープンソース・ソフトウェアはGreyBox、Webページにも対応したCSSポップアップウィンドウだ。 GreyBoxは最近良く見かける、画像をクリックすると同じページ上でポップアップするライブラリになる。特徴的なのは、画像のみならずWebページでもポップアップしてくれる点だ。 既存のAタグに対して情報を埋め込めば、それだけでクリックすると背景をグレーアウトし、クールなポップアップを表示してくれる。これならばお問い合わせフォームや、詳細検索等のフォームでも使えそうだ。 大きさを指定したり、フルスクリーンでの表示もで
BlockquoteタグをCSSで綺麗に整形したサンプル集:phpspot開発日誌
Blockquote Examples by CSS-Tricks Blockquotes are html elements that are meant to designate when a particular section of text is being taken from another website or other source. BlockquoteタグをCSSで綺麗に整形したサンプル集が数種類公開されています。 Blockquoteは引用なんかに用いられますが、引用っぽくなるものがそろってます。 それほど見栄えのするものばかりではありませんが、このCSSサンプルを参考に画像を変更してカッコよく引用部分を整形してみてはいかがでしょう。 関連エントリ CSS開発に使える「Free CSS Toolbox」 CSSでスクロールバーのデザインをする際に非常に便利なWEB
使っていないCSSをWEBから簡単チェック「CSS Redundancy Checker」:phpspot開発日誌
CSS Redundancy Checker 使っていないCSSをWEBから簡単チェック「CSS Redundancy Checker」。 使っていないCSSのセレクタをあぶりだして、CSSのダイエットをすることが可能なツールです。 まず、(Step1)スタイルシートのURL を入力し、その後、(Step2)にスタイルシートを用いたページすべてを入力します。 そして、(Step3)「Check」ボタンを押せば、チェックを行ってくれます。 すると次のように、使用していないセレクタが一括して表示されます。 CSSのサイズが肥大化して困っているという方に便利なツールですね。 関連エントリ JavaScriptとCSSの両方を圧縮できる「YUI Compressor 2.0」リリース CSSデバッギングツール１０選
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
101CSS技術の続き（part2）＋CSS関連エントリおまけ*ホームページを作る人のネタ帳
ちょっと便利なCSS Tips いろいろ - DesignWalker
http://e0166nt.com/blog-entry-372.html
Free Layouts.com | Websites
CSSMENUMAKER.COM