タグ

Tipsに関するhosiuoのブックマーク (161)

  • font-size指定 | d-spica

    font-size指定 2007-03-10 0 0 XHTML/CSS CSS, font-size 数で合理的にデザインする - サイズ編 で少し書いたfont-sizeについての補足です。 どのくらいの文字サイズで見られているかは,ブラウザとその設定によってまちまちです。でも,せめてデフォルトの状態では意図したレイアウト,フォントサイズで見てもらいたい,という願いもないわけではありません。font-sizeの指定をどうするか,ちょっと考えてみました。 font-sizeは%で font-sizeをpx,pt,inなどで絶対指定すると,Win IEで文字サイズの変更が出来なくなるのをご存じの方も多いでしょう。文字サイズを固定してしまうのはアクセシビリティ上少々問題があります。font-sizeはem,ex,%で相対指定(基準になるものとの比率で指定)するのがよいとされています。 Win

  • CSSによる段組(マルチカラム)レイアウト講座

    サービス終了のお知らせ いつもYahoo! JAPANのサービスをご利用いただき誠にありがとうございます。 お客様がアクセスされたサービスは日までにサービスを終了いたしました。 今後ともYahoo! JAPANのサービスをご愛顧くださいますよう、よろしくお願いいたします。

  • 色を仕事で使う人のためのツール20選『COLORS TOOLBOX: 20 Tools For Working With Colors』 | CREAMU

    Diary 色を仕事で使う人のためのツール20選『COLORS TOOLBOX: 20+ Tools For Working With Colors』 バランスのいい配色を手軽に作りたい。 そんなあなたにおすすめなのが、『COLORS TOOLBOX: 20+ Tools For Working With Colors』。色を仕事で使う人のためのツール20選だ。 以下にいくつかご紹介。 » 4096 Color Wheel カラーホイールをからWEBセーフカラー、WEBスマートカラー、アンセーフカラーを表示 » Accessibility Color Wheel 表面色と背景色のベストな組み合わせを作ってくれる » Color Palette Generator 画像のURLからRGBを調べてくれる » ColorMixers.com WYSIWYGフォーマットで色を作成できる » pic

  • 大容量RAMディスク活用例 - Gavotte Ramdisk まとめWIKI

    こんなんに使うと良いよって例 ・[[Firefox Portable を置く>http://portableapps.com/apps/internet/firefox_portable]] ・ブラウザのキャッシュを置く ・[[ページングファイルを置く]] ・OSのテンポラリを置く ・Photoshopのキャッシュを置く ・[[頻繁に読み込むゲームフォルダを移す>http://www10.atwiki.jp/gavotterd/pages/18.html]] ・[[MSDNライブラリにシンボリックリンク]] ・Outlook の pst ファイルを置く http://pc11.2ch.net/test/read.cgi/win/1210498064/699 >>698 ・Windowsの一時ファイル ・アプリケーションのキャッシュ(ブラウザのキャッシュや2chブラウザのdat等) ・読み込

    大容量RAMディスク活用例 - Gavotte Ramdisk まとめWIKI
  • 記号・特殊文字・顔文字を変換で入力する

    記号などの特殊文字を変換で入力する Microsoft IME 標準辞書では、以下の特殊文字を入力できます。 また、Microsoft IME 記号辞書を使うと、さらにいろいろな記号などを入力できます。Microsoft IME 記号辞書を使うときは、[Microsoft IME スタンダードのプロパティ] ダイアログ ボックスの [辞書/学習] タブで [Microsoft IME 記号辞書] チェック ボックスをオンにします。 作者注1:UNICODE(ユニコード)のみの特殊な文字(記号や外国語を含む)は、対応していないソフトがあります。 例えばロータス1-2-3など。 こうしたソフトでは、文字変換中は表示されても、変換後は ?(クエスチョンマーク)になったりします。 作者注2:このページにはマックでは表示されない「機種依存文字」も使用しています。 したがって、このページはウ

  • [CSS]クロスブラウザ対応、高さの異なるカラムを揃えるスタイルシート | コリス

    Matthew James Taylorのエントリーから、高さの異なるdivで組んだカラムの高さを揃えるスタイルシートを紹介します。 Equal Height Columns with Cross-Browser CSS & No Hacks demo: 2カラム demo: 3カラム 以前、紹介した「高さの異なるカラムを揃えるスタイルシート」では、ページ内アンカーで要素が消失したり、IEで印刷できないなどの不具合がありましたが、今回紹介するものは、その2つの不具合が無いものとなっています(IE7調べ)。 対応ブラウザは、IE5.5, 6, 7, Fx1.5, 2, 3, Op8, 9, Safari, Google Chromeなどほとんどのものに対応しています。 仕組みはカラムごとにdivを用意し、それぞれをずらして配置します。 下記は、そのイメージです。

  • 見出しをCSSでシンプルに装飾するtips - EC studio デザインブログ

    谷です。 今回はデザインブログらしく、デザイン系の記事を書きます。 私は企画デザインで主にHTML/CSSコーディングと プロモーション系以外のデザインをしています。 具体的にはボタンの画像や、見出しの装飾画像などです。 ※制作するサイトによっては全体の情報設計などもおこないます。 デザインブログというからには、ブログの投稿記事なども 見やすく見栄えよく!と思い立ったので、CSSを利用した 簡単な見出しのデザインを紹介します。 画像・余分なマークアップ(タグを加えたりとか)無しでデザイン ↑のような見出しのデザインですね。 見出しに該当する文章は基的に「h○タグ」でマークアップされますので そのh○タグ(今回はh4タグ)を装飾していきます。 1.これは見出しです。 非常にシンプルな形です。ブログの記事のタイトルの装飾は これの色違いですね。 2.これは見出しです。 付せんのようなデザイン

  • シンプルな見出し - スタイルシート・サンプル

    H1 { color: #000099; /* 文字の色 */ } H2 { color: #000099; /* 文字の色 */ } H3 { color: #000099; /* 文字の色 */ } H1 { color: #ffffff; /* 文字の色 */ background-color: #666699; /* 背景色 */ line-height: 130%; /* 行の高さ */ } H2 { color: #ffffff; /* 文字の色 */ background-color: #666699; /* 背景色 */ line-height: 130%; /* 行の高さ */ } H3 { color: #ffffff; /* 文字の色 */ background-color: #666699; /* 背景色 */ line-h

  • ちょっと使えるかもしれないCSS(1) - 見出しを飾る | オトコのキモチ2

    こちらのブログには認証がかかっています。 ユーザー名 パスワード Powered by Seesaa

  • CSSの見出しサンプル | ユージック

    CSSの見出しサンプル 2006年11月28日 業務を効率よくスピーディーに行うためのCSSで作る見出しサンプル集 パターンは考えると星の数ほどありますが、ここでは実際にニュースサイトやブログでも使われている“使える見出し”にこだわってみました。 アイデアが思いついたら随時追加していく予定です。 画像を使わないオーソドックスな5パターン CSSだけを使用した使い回しのきくオーソドックスなスタイル 使える見出し h5#midashi_01{ padding:5px 0 5px 15px; border-left:#009900 8px solid; border-bottom:#009900 1px solid; font-size: small; font-weight: bold; color:#333; } 使える見出し h5#midashi_02{ padding:5px 0 5px

    CSSの見出しサンプル | ユージック
  • line-height の値には単位なしが良いとされる理由

    CSS で行ボックスの高さを指定する line-height 値に、em(length) や %(percentage) などの単位を付けて指定しているサイトを意外と見かける。それは間違いではないし、例えばナビゲーションとかでブロック要素の垂直センターに配置するために意図的に指定しているんであれば良いんだけれど、そうでないなら line-height 値には単位なし (number) で指定した方が良いのにとか思ったりする。その理由は Eric's Archived Thoughts: Unitless line-heights でも分かりやすく説明されているんだけど、ちと劣化コピーしてみる。 単位ありと単位なしの違い 手っ取り早く説明するために、サンプルを作ってみた。p 要素があって、その中にインライン要素の em で一部分を強調している。分かりやすいようにそれぞれの font-size

  • Googleの検索結果からブログを除く: WeBlogZine

    Googleなどの検索サイトで検索する場合、上位に多くのブログがリストアップされ、実際に検索したい情報になかなかたどり着けず、良い方法がないか探している方も多いのではないかと思います。 この現象は、ブログがSEO対策上優れていることに加え、爆発的にブログが増えたことが原因と思われるのですが、爆発的に増えたブログと比例して、優れたライターやそれなりの情報を持つコンテンツが増えた訳ではないので、この様な状況に陥いっていると推測されます。 結局、これらを通常の検索方法で見分けるのは人の目で見るしかないので、すっぱりブログの検索をあきらめて、ブログを除外して検索する方法をご紹介します。 方法は簡単で、Googleの検索オプションであるキーワードを「"」で囲み先頭に「-」をつけると、そのキーワードを除外することができます。 これを応用してブログに必ず書かれている「トラックバック」や「コメント」などの

  • 「なんでも質問する」姿勢と「ググってから質問する」行動 - 発声練習

    まとめ 「なんでも質問する」姿勢は重要! 適切な答えは適切な質問からしか得られない。 適切な質問をするのは簡単ではない。たくさん質問をしてみるということだけが適切な質問を得るための唯一の方法。 「他人に向けて発するのは適切な質問だけ」という内部規定を作るとまったく質問できなくなる。 「ググってから質問する」という行動をとると回答を得やすい 誰もが常にどんな質問にでも答えてくれるわけではない。 多くの人にとって、何度も同じことについて答えるのは嫌だし、自分が苦労して得た情報にはそれなりの対価を払ってもらいたいと思っている。 質問に対する答えを効率良く得るという観点から見ると、質問者は、回答者が「答えたくない」と思う理由を極力減らすべき。 今の自分にとって最大限の努力の結果として「わからなかった」ということを回答者に伝えた方が回答者は答えおよび答えにつながるヒントを教えてくれる確率が上がる。

    「なんでも質問する」姿勢と「ググってから質問する」行動 - 発声練習
  • IE 6で泣かないための、9つのCSSハック (1/3) - @IT

    有限会社タグパンダ 喜安 亮介 2009/10/8 Webブラウザごとのレンダリングエンジンの違いにより起こるレイアウトの表示ずれ問題に泣かされるWebデザイナのために、Webブラウザごとに使えるかどうかの表を交えながら問題を解決するためのCSSハック&フィルタTipsをお届けします(編集部) 最も多く使われているのに……、いや、だからこそ 多くのWebデザイナの悩みの1つは、レイアウトの表示ずれ問題だと思います。これは、各Webブラウザが採用しているレンダリングエンジンの違いから起因している場合が多いです。その中でも、最もWebデザイナ泣かせのWebブラウザなのは、マイクロソフトが開発しているIE(Internet Explore)のバージョン6です。 IE 6は、発売開始当初のWindows XPにデフォルトでインストールされていたWebブラウザということもあり、世の中の多くのユーザー

  • 感染病態分野プレゼン12箇条 - 微生物病研究所 感染病態分野

    感染病態分野プレゼン12箇条 第一条、 番の一週間前までに原稿はいったん通しで作成してしまおう! 第二条、 何度も通しで口に出して練習しよう! 第三条、 ほかのヒトに聞いてもらおう!そしてどんな感想でも謙虚に耳をかたむけよう! 第四条、 頭を働かせなくても口が勝手に動くまで練習しよう! 第五条、 練習すればいったん上手になるが、その時点からさらに練習し、少し下手に なるぐらいまで練習しよう! 第六条、 プレゼン下手なヒトほど練習時間短い! 第七条、 プレゼンの練習は聞き手への誠意! 発表に向けて努力・練習・準備した演者の誠意は必ず聞き手に伝わります。 たとえどんな流暢な演者でも準備してこなかったプレゼンは鼻につきます。 第八条、 時間を守る! 短いのは大歓迎!時間オーバーしたら二度と呼んでもらえません! 第九条、 入れるかどうか迷った時は、そのスライドは抜こう! 第十条、 前をみてプレゼ

  • 黄金比をサイトのデザインに取り入れる簡単な3つの方法 | コリス

    その調和された比率は、トランプカードなどの日常的なものから、ギリシアのパルテノン神殿、ミロのヴィーナス、モナリザなどの芸術分野まで、多数存在します。 黄金比を使ったデザイン テクニックついては、下記も参考にどうぞ。 黄金比とは、黄金比を使ったすごいデザインテクニックのまとめ -Webデザイン・紙デザインに 黄金比を矩形に使用する 黄金比をマージンに使用する 黄金比をパーツに使用する 黄金比を矩形に使用する サイトで使用する画像などの矩形に黄金比を適応します。 サンプルでは、144pxと233pxの組み合わせを使用していますが、「1:1.6」を利用して100pxと160pxなど簡易なものでも効果はあると思います。 黄金比を横長の矩形に使用 黄金比をマージンに使用する レイアウトにグリッドシステムを取り入れマージンを使用した場合、数種類のサイズが必要になる場合が多くあります。 その際、1つの値

  • 最初のデートで絶対にしてはいけない13のこと / SHOOTIトピックス

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

  • URL構築の最適ガイドライン11ヶ条 | Moz - SEOとインバウンドマーケティングの実践情報

    この話題では、すでにすばらしい記事を掲載していたり、どこかのフォーラムでスレッドが立っていたりするのは確実なんだけど、僕の優秀な部下たちをもってしても、見つけ出せそうもない。Malicoat氏のブックマークなら入っていることは間違いないと思うんだけど、ブログの投稿をもって公のブックマークにするのが僕の個人的なやり方なので、以下に記しておこう。 成功するためにURLはどうあるべきか、11のガイドライン URLでコンテンツを表そう 明確なURLは優れたURLだ。ユーザーが該当ページを訪れる前に、アドレスバー(ペーストしたリンク)を見て、コンテンツの見当を正確につけられるなら大成功だ。人はこういうURLをあちこちに貼り付け、共有し、電子メールで送信し、書き留める。そしてもちろん、検索エンジンも認知する。

    URL構築の最適ガイドライン11ヶ条 | Moz - SEOとインバウンドマーケティングの実践情報
  • 主要ブラウザのデフォルトCSS - 我的春秋

    久々の CSS ネタにも関わらず、メモ程度の備忘録ですが、W3C CSS 2.1 勧告候補の Appendix にある、HTML 4 の推奨デフォルトスタイルと、現時点で僕が把握している主要ブラウザのデフォルトCSS の在りかのリストです。ネタ元は Accessify Forum: list of browsers' default CSS(via e-luck さんのブックマーク)です。 (※ Mac OS X 10.4、Windows 2000 で確認していますので、10.3 + IE 5 や Vista + IE 7 はチェックできていません。XP + IE 7 はそのうち実家の端末で確認する予定。)

    主要ブラウザのデフォルトCSS - 我的春秋
  • 標準準拠・後方互換モード各々の CSS 解釈の違いをまとめたドキュメントを共有

    2007-07-27T21:11:11+09:00 最近のブラウザには DOCTYPE 宣言の有無や種類で大きくわけて2種類の表示モードを切り替え、CSSHTML の解釈を変える機能が備わっています。マイクロソフトは同様の機能を DOCTYPE スイッチとしており、一般的にもそう呼ばれることが多いように感じます (この記事でも DOCTYPE スイッチとします)。 DOCTYPE スイッチはオンの状態で standards mode (標準準拠モード) に、オフの状態で quirks mode (後方 (過去) 互換モード) になります。標準準拠モードは仕様に準拠した厳格な表示モード、後方 (過去) 互換モードは仕様に準拠していない古いブラウザとの互換を目的とした表示モードです。つまり DOCTYPE 宣言の記述が無いようなコンテンツに対しては、仕様に準拠していない古いブラウザの解釈