グラフを作るためのCSSテクニック集 – creamu
CSSでグラフをデザインしたい。 そんなときにおすすめなのが、『8 CSS Techniques for Charting Data』。グラフを作るためのCSSテクニック集だ。 以下にいくつかご紹介。 ↑のキャプチャはCSS for Bar Graphs。 CSS Vertical Bar Graphs Creating a Graph Using Percentage Background Images Accessible Bar Chart その他のリストは以下から。 » 8 CSS Techniques for Charting Data グラフを作るためのCSSテクニック、チェックしてぜひ参考にしてみてはいかがだろうか。 「ミスト」を見たよ。めちゃこわかった。。クローバーフィールド並みでしたね。しかも後味がよくないな。。
ウノウラボ Unoh Labs: CSSを書くときに使っているツールの紹介
yamaokaです。 今回は、ぼくが普段CSSを書くときに使っているツールを紹介します。 Firebug 入手先: Firebug :: Firefox Add-ons Firebug posted by (C)フォト蔵 もはやJavaScriptの開発には欠かせなくなった感のあるFirebugですが、CSSを書くのにも使えます。 ボックス要素を調査（inspect）、CSSを書き換えてレイアウトを考える参考にしたり、 HTMLを書き換えてid属性やclass属性を書き換えて適用するスタイルを変更した場合の変化を試してみたりします。 IE Develper Toolbar 入手先: Download details: Internet Explorer Developer Toolbar IE Developer Toolbar posted by (C)フォト蔵 前述のFirebugと同
artcodeグループ - 2007 CSS Study Meeting
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
あなたは勘違いしてないか？ 真相究明！ CSS都市伝説 | Web担当者Forum
あなたは勘違いしてないか？ 真相究明！ CSS都市伝説 ウェブ制作の現場を襲う大きな変化 CSSの真の姿で巷に流れる誤解を解く！ 書店のウェブ関連コーナーに圧倒的な物量で並ぶCSS関連の書籍。ウェブ制作の現場でもCSSがトレンドになりつつあり、現場は大きく変化し始めている。では、ウェブマスターにとってCSSを採用することのメリットとはなにか。また、こうした変化の最中には、数々の「都市伝説」なるものが生まれてきているようだ。ここではCSSの正体と都市伝説について検証する。 森川眞行（シリコンカフェ）＋CreatorsNet CSSとは「表現言語」CSS正式な名称はカスケーディング・スタイル・シート。シンプルにスタイルシートと呼ばれることもある。 ウェブページを作成する際に記述するHTMLとはウェブページを作成するための構造言語で、文書の骨格を作るためのものだ。これに対してCSSは表現言語とい
YUI: CSS Grid Builder
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas sit amet metus. Nunc quam elit, posuere nec, auctor in, rhoncus quis, dui. Aliquam erat volutpat. Ut dignissim, massa sit amet dignissim cursus, quam lacus feugiat.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas sit amet metus. Nunc quam elit, posuere nec, auctor in, rhoncus quis, dui. Aliquam erat volutpat. Ut d
id名、class名の最近の自分の傾向
以前に「もう、class名やid名で悩まないんだからっ！！」というエントリーを書いたのだけど、自分がよう使うid名とclass名のまとめと、その辺の理由付けをしてみよーかなぁと思った。 後、idとclassの使い分け絡みもちょっと書くかも。 こーいう内容を書くと反応が怖かったりするけど、ソレもまた勉強なり。とか思って自分なりの今の考えを書いてみようと思います。 先に言っておきますが、コレから書く事が正解とかこう付けるべきって解釈はしない感じでお願いします。 コイツはこう考えてるんだ。くらいで読んでいただければ幸いです。えぇ。 全体を囲む際によく使うかなっていう系 #page idでコレをつける事が最近多いです。 wrapperとかwrapを使わないのは、脳内がサランラップに犯されているからっていうやる気の無い理由もありますが、「このサイトのこのページ。」なんだからpageがしっくり来たなぁ
携帯電話向けのCSS - 携帯電話向けコンテンツの書き方
フィーチャフォンで使う事の出来るカスケーディングスタイルシート(CSS)のセレクタ及びプロパティを解説します。 フィーチャフォンでのCSSのセレクタ・プロパティは、参考資料・オープンウェーヴ社が定めているCSSのプロパティに移転しました。 また、 フィーチャフォン用の CSS を書くに当たって CSS 非対応機種との兼ね合い も別文書・携帯電話向けの CSS を書くに当たってに移転しました。 CSS に関して基本的な事柄については、CSS 入門(HTML & CSS 入門)をご覧下さい。 また、各プロパティなどの詳細は CSS(カスケーディングスタイルシート)及び CSS リファレンスをご覧下さい。 フィーチャフォンでの CSS について。 WAP 2.0 での CSS。 EZ ウェブ及びソフトバンクのフィーチャフォンは、WAP 2.0 に準拠しているため、CSS を使う事が出来ます。 但
TRANS - 携帯用CSSを書く上で押さえておくべきポイント
先日、diggでVitamin Features » Make your site mobile friendlyというエントリーが上がってきてました。見てみると、非常にうまい具合に携帯向けのCSSやHTMLの書き方などが紹介されていました。僕も携帯向けCSSの書き方には興味があったので、勉強がてら重要なポイントを抜き出して、和訳してみました。 和訳文は次からスタートです。（上記サイトの「mobile」は携帯電話やPDAを含めたモバイル機器が正確な訳ですが、ここでは話を分かりやすくするために「mobile」を全て「携帯」と訳しています。） 基本からスタートしよう。 既に論理的でセマンティックなHTMLを構造化しているんだったら、携帯を含めたどのデバイスでもきれいに、使いやすく、アクセシブルになっています。携帯によっては、WAPに準拠しているかもしれないし、もしかしたらWAP2もいけるかもし
ウノウラボ Unoh Labs: CSSをデバッグしよう
こんにちは、Sashaです。CSSって、誰でも比較的簡単に始めることが出来るくせに、何年たってもつまらないバグにハマったりするものです。今日は、CSSをデバッグする手順を紹介します。特にCSS初心者の方々に参考にしていただければ光栄です。ただ、ここで紹介しているのは、CSSの問題解決の方法ではありません。CSS上の問題点の原因を、自分で見つけるためにとるべき手段です。見つかった問題点を、どうやって解決するかは、ここでは触れないのでがっかりしないでくださいね。 ※以下の手順は、下記のサイトをパクッ･･･、じゃなくて、翻訳しつつ簡単にまとめたものです。 参考: http://www.subcide.com/tutorials/debuggingcss/ まず、問題あるって認めましょう。 見なかったフリをしたい気持ちはよくわかります、が。 人的ミスをつぶそう スペルをチェックしよう
栄光ゼミナール；塾選びガイド
栄光ゼミナールとほかの塾との授業料、サービスなどさまざまなポイントについて比較しています。栄光ゼミナールの授業料、サービスなど充実させたコンテンツで作成していますが、やはり一番栄光ゼミナールを知るには、資料請求が一番です。 栄光ゼミナール資料内容 日程と授業料についてのご案内 栄光ゼミナールの夏期講習のご案内 個別指導のご案内。 「今子供たちは・」資料集栄光ブックレット とっておきなＤＶＤ（届くまでお楽しみ） 栄光ゼミナールでは、はじめての方には無料の夏期講習会になります。テキストの教材費は自己負担になりますが、それでも1教科につきたったの2100円。 栄光ゼミナールは特に中学生を対象に向けて圧倒的人気のサービスです。もちろん、それに付随するしっかりとしたサービスがあります。大手の学習塾には、有名講師が授業を100人程度で聞くタイプと少人数制（6人から20人程度）できめ細やかな授業
CSSデザインカタログ
対応ブラウザは Windows：InternetExplorer6，InternetExplorer7，Firefox2，Opera9 Mac：Firefox2，Opera9，Safari2 ですが，ブラウザによって若干表示が異なる部分もあります。 XHTML 1.0 でマークアップしてあります。 DOCTYPEスイッチによる標準モードに対応しています。InternetExplorer6 でXML宣言をし互換モードになった場合にも対応しています。 Netscape7，Mac InternetExplorer5 では期待通りに表示されないものがいくつかあります。 便宜上，分類コード（div011-hp，table010 など）を class名にしてありますが，実際にお使いの際には適切な class名に変更してください。 すでにお使いのCSSファイルに新たにCSSコードを追加した場合，既存
モバイルサイトのCSS : LINE Corporation ディレクターブログ
こんにちは、『livedoor 歌詞』や『livedoor グリーティング』を担当している吉沢です。それらのサービス以外では、モバイルサイトのコーディング関連のとりまとめを担当していることもあり、今回はモバイルサイトのCSSについてご紹介したいと思います。 以前の記事『モバイルサイトのデザイン』でもご紹介させていただきましたように、『ケータイ livedoor』は 3Gケータイを中心とした開発を行っており、XHTML でコーディングする機会が増えてきました。モバイルで XHTML を表示できるということは、スタイルシートに対応していることも意味するので、モバイルサイトの表現力のアップにつながります。 ■モバイルサイトのCSS事情 スタイルシートを採用するメリットとして、通常は HTML 構造の簡略化やデザインの一括管理などがあげられます。しかしモバイルサイトでのスタイルシートの採用は、通常
ke-tai.org > Blog Archive > ドコモ端末でCSSを表示するには
ドコモ端末でCSSを利用するには Tweet 2008/4/3 木曜日 matsui Posted in DoCoMo | 9 Comments » ドコモ端末でCSSを表示しようとして、悩まれる方が多いようなのでご紹介しようと思います。 ドコモのiモード端末では、FOMA以降の機種でXHTML対応となりCSSが使えます。 ※厳密にいうと、ごく初期のFOMA21xxシリーズでは使えません。詳しくは下記一覧表からご確認ください。 → iモード対応機種 対応コンテンツ・機能一覧 [nttdocomo.co.jp] ※PDFです ですが、PCと同じように普通に書くだけでは、CSSは認識されません。 下記の3点を守る必要があります。 iモード用のXML宣言、DOCTYPEを付ける CSSは外部ファイルにしない、ヘッダ部にも書かない 拡張子を「.xhtml」にする ※別の方法もあり まず1についてで
ウノウラボ Unoh Labs: CSSによるデザインワークと相性のよいHTMLって？
yamazakiです。最近だいぶあたたかくなってきましたね。おかげで日中眠くて仕方ないわけですがいかがお過ごしでしょうか。 ウノウに入る以前も含めてそれなりに長いことHTMLとCSSを書いてきたわけですが、今回は試みに、「だいたいこういうところに気を使われたHTMLだと、CSSでのデザイン適用やレイアウトがやりやすいな」というこれまでの経験則を簡単ですがまとめてみたいと思います。 まあ、このあたりはCSS書く人とHTML書く人の間でちゃんとルールを決めておけばいいだけの話なので、そもそも何の役に立つのか疑問といえば疑問ですが（笑 たとえばユーザがCSSを書いてスキンを作れるようなサービスを作る際、どういったHTMLにするかを決める、みたいな時には少し参考になる、かもしれません。 ID、クラスを適切に割り振って、要素がCSS側から一意に特定できるように たとえばグローバルナビゲーションとカ
独学で極める “Webデザイン”の技と心：第10回 CSS Spritesでサイトを高速化｜gihyo.jp … 技術評論社
今日は、CSSを使ってサイトを高速化するテクニック「CSS Sprites（CSSスプライト）」についてのお話をさせていただきます。 サイトの高速化というと、プログラムの最適化を行ったり、サーバのチューニングを行ったりというイメージがあるかと思います。実はCSSを上手に使うことによっても、サイトの高速化を行うことができます。しかも、かなりの効果が期待できるのです。 CSS Spritesとは？ 通常、ウェブページを制作する場合、デザインファイル（psdやpngなどの画像）をスライスし、HTMLのimg要素として埋め込んだり、CSSの背景画像として指定していることと思います。 それらの画像を一つにまとめ、１度の読み込みでのリクエスト数を減らすテクニックのことを「CSS Sprites」と呼びます。 このテクニックは、以前からマウスオーバーメニューを実現する際にも使われていたものでもありま
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CSSによる段組（マルチカラム）レイアウト講座
CSS Nite Vol.7: Web制作現場の対立を解消する！ XHTML CSSガイドライン作り [1]
モバイルでのXHTMLとCSS
初心者向け 3キャリア共通モバイルサイト作成 実践編 - （株）ビジュアルワークス 鶴岡千春