「display:none」と「visibility: hidden」と「text-indent」はスパム？ | 無料SEO対策のススメ
「display:none」や「visibility: hidden」や「text-indent」はスパム？ 検索エンジンは画像リンクよりもテキストリンクを評価するため、できる限りリンクはテキストで行いたい所です。画像と比べテキストは見栄えが劣る為、ロゴやナビゲーションはテキストリンクにしてCSSで背景画像設定する手法が良く取られます。 背景画像の上にテキストリンクを表示することは何の問題もありませんが、テキストリンクを非表示にして画像を置換えするとスパムになると思っている方も多いのではないでしょうか。 画像置換＋テキスト非表示はスパムではない 結論から申し上げますと、CSSの画像置換えによるテキストの非表示はその行為自体がスパムにあたるわけではありません。text-indent: -9999px; はスパムになってdisplay:noneならスパムにはならないという事でもありません。 C
CSSや画像の命名規則について - kojika17
コーディングで時間のかかる要素の1つとして、id,class名や画像名などの命名規則が挙げられます。 特に中規模、大規模のサイトで、適当な名前を付けると名前が被る確率が上がり、 その結果、画像の上書きや不要なプロパティがかかってしまうなど、よくない結果になることも考えられます。 一つの例として、私の命名規則について紹介してます。参考程度に読んで頂けると幸いです。 カテゴリに分類して、つなげる。 ページのどの位置に属すか分類し、つなげる方法を取っています。 基本的に、CSSや画像名は同じにします。同名にすることで、名前を考える手間も省け、変更箇所の特定がしやすくなります。 例： CSS #top-side-nav 画像 top-side-nav-home.png top-side-nav-company.png 上記のように命名することで、 デザインを見なくても、どのような箇所に使われている
選択子
W3Cの勧告候補平成13年11月13日 この版: http://www.w3.org/TR/2001/CR-css3-selectors-20011113 最新の版: http://www.w3.org/TR/css3-selectors 前の版: http://www.w3.org/TR/2001/WD-css3-selectors-20010126 編者: Daniel Glazman (Netscape/AOL) Tantek Çelik (Microsoft Corporation) Ian Hickson Peter Linss (former editor, formerly of Netscape/AOL) John Williams (former editor, Quark, Inc.) 摘要 CSS(段階スタイルシート)は、HTML及びXMLの文書の、画面上、紙面上、音
Yahoo! UI Library(YUI)のFonts CSSを分解してみた | アイビーネットblog
2008年8月18日 13:01 CSSWebサービス 新規の仕事で、Yahoo! UI Library(YUI)のFonts CSSを利用しました。 YUI Font CSSとは、各種ブラウザで表示文字サイズの差異をなるべく少なくする目的で作られたCSSライブラリーです。 以前ある案件で、同じような構造のCSSを自分で作って使っていたのですが、興味があったので今回はこちらを利用することにしました。 Yahoo! UI LibraryのFonts CSS fonts.css(2.5.2) Yahoo! UI Library Fonts CSS(2.5.2)を分解 どんな処理をしているのかを理解せずに使うのは危険と思ったので、細かく解析してみました。Yahoo! UI Library Fonts CSS(2.5.2)は、下記の3つのパートから成り立っています。 body { font: 13
line-height の値には単位なしが良いとされる理由
CSS で行ボックスの高さを指定する line-height 値に、em(length) や %(percentage) などの単位を付けて指定しているサイトを意外と見かける。それは間違いではないし、例えばナビゲーションとかでブロック要素の垂直センターに配置するために意図的に指定しているんであれば良いんだけれど、そうでないなら line-height 値には単位なし (number) で指定した方が良いのにとか思ったりする。その理由は Eric's Archived Thoughts: Unitless line-heights でも分かりやすく説明されているんだけど、ちと劣化コピーしてみる。 単位ありと単位なしの違い 手っ取り早く説明するために、サンプルを作ってみた。p 要素があって、その中にインライン要素の em で一部分を強調している。分かりやすいようにそれぞれの font-size
CSS(スタイルシート)をjavascriptで切り替える色々な方法cookie : 4GALAXYのメモ
19 29 08 2007 CSS(スタイルシート)をjavascriptで切り替える色々な方法cookie jQuery, Css CSSを動的に切り替える方法をいくつか紹介します。全てcookieにより保存されます 1.styleswitch.jsを使う方法 まずGoogleで一番ヒットするのがstyleswitch.jsです。 コード <script src="styleswitch.js" type="text/javascript"></script> <link rel="stylesheet" type="text/css" href="default.css" /> <link rel="alternate stylesheet" type="text/css" media="screen" title="title1" href="css1.css" />
CSSで複数のclassを指定する | Takazudo Clipping*
(X)HTML上で、複数のclassを指定できるのは結構有名な話です。 <p class="Paragraph1 Right">段落</p> みたいに。 しかし、これをCSS上でもできるのを知ってましたか？ 自分は最近知りました。 こんな感じで。 .Navigation{ padding:5px; margin:0 0 10px; border:2px solid red; } .Navigation li{ padding:0 0 0 10px; background:url(arrow.gif) no-repeat 0 0; } .Navigation.R li{ float:right; } .Navigation.Popup li{ background-image:url(newwin.gif); } .Navigation.External li{ background-
納期間近でIEで崩れてる！ そんな時にも慌てないCSS開発のワークフロー
まだまだIE7、そしてIE6のユーザーをターゲットに考えているウェブサイトは多くあると思います。 そんなIEユーザーをターゲットに含めたウェブサイトを制作する上で、より効率的にCSSの開発が行えるワークフローを紹介します。 Cross-Browser CSS Development Workflow [ad#ad-2] 下記は各ポイントを意訳したものです。 1. リセットかノーマライズか 2. 基本的なレイアウトはIEで 3. 最後の確認もIEで 4. 最後の手段：IEのみスタイル 5. 問題に取り組み続ける 6. おわりに 1. リセットかノーマライズか IE, Firefox, Chrome, Safari, Operaなどのブラウザには各要素ごとのデフォルトのスタイルが用意されており、制作する際にはこれらの相違を見出し、各要素を整える必要があります。 CSSリセットとは CSSリセッ
Internet Explorerのみにスタイルシート適用 | へっぽこSEが何となく作ってみたweblog
一定期間更新がないため広告を表示しています
Common fonts to all versions of Windows & Mac equivalents (Browser safe fonts) - Web design tips & tricks
Common fonts to all versions of Windows & Mac equivalents Last updated: 2008/06/03 Return to the main page Introduction Here you can find the list with the standard set of fonts common to all versions of Windows and their Mac substitutes, referred sometimes as "browser safe fonts". This is the reference I use when making web pages and I expect you will find it useful too. If you are new to web des
Custom Checkboxes, Custom Radio Buttons, Custom Select Lists
Custom Checkboxes, Custom Radio Buttons, Custom Select Lists This JavaScript and CSS will allow you to use custom images for checkboxes, radio buttons and select lists. Checkboxes, Radio Buttons, Select Lists, Custom HTML Form Elements Have you ever wanted to use your own images for checkboxes, radio buttons or select lists? This script will let you do that. Easily. The unobtrusive script graceful
Let's begin CSS -- 1.11
1.11 フォントの種類の指定 1.6 では，フォントサイズの指定を扱った。ここでは，フォントそのものを指定する方法と，その基本的な考え方を解説する。 フォントファミリ，フォントフェイス フォントファミリとは，フォントのひとまとまりである。一般に，同じフォントファミリに属するフォントは，同様のデザインになっている。代表的なフォントファミリに，Helvetica，Arial，Times New Roman，Century などがある。 たとえば，Times New Roman フォントファミリを例にとると，そこには，正体，イタリック体，ボールド体，ボールドイタリック体などが含まれる。こういった個々のフォントはフォントフェイスという。フォントファミリは，似たデザインのフォントフェイスの集まりとも言える。 フォントファミリは，font-family プロパティで指定する。 font-family
CSSハック一覧
2013年3月23日 CSS 異なるブラウザーで見たらレイアウトが崩れる。。CSSハックはそんな時のお役立ち裏技（？）です。私がブックマークしているCSSハックに関するWebサイトがたくさんあったので（Safariがのってない・IE8しかのってない。。等の理由で）、自分用メモ。「こんなやり方もある！」というのがあればコメントして教えてください！ ↑私が10年以上利用している会計ソフト！ Internet Explorer IE6以下 #help_me { _color: blue; } * html #help_me { color: red; } IE7 *:first-child+html #help_me { color: red; } *+html #help_me { color: red; } IE6, IE7 #help_me { /color: blue; } IE8 #h
CSSを使ってどのブラウザでもフォントサイズを「％」で統一させる方法 | colori
CSSによるフォントサイズの指定は「font-size」属性を使って簡単に設定することができますが、ピクセル指定などの絶対的サイズで統一する方法にくらべて非常にやっかいなのが、相対的なサイズによるサイズの統一です。 ブラウザによって異なる、フォントサイズの境界 例えば「font-size:70%」というふうに指定して、Internet Explorer 6とFirefox2.0で見てみたページが以下のようなものです。 ※ページはxmlタグつきのXHTML1.0 Strictで作成、つまりInternet Explorer6は下位互換モードで表示されていますが、標準モードでも同じサイズで表示されます。 あきらかにFirefoxで表示されたページのフォントサイズが小さくなっていることがわかります。 このように、フォントをパーセント指定した場合は、その数値によってフォントサイズを規定する境界に微
CSS：初心者の頃にハマったスタイルシートのあれこれ … IE7多め
CSS、スタイルシート。初心者のころには CSS のスタイルがうまくいかなくて、半日や丸一日悩んだこともいっぱいありました。最近では、やっとひと通り覚えて、思うようにできるようになったかなーという感じです。今回は初心者だったころ、ちょっと悩んだことなどをいくつかまとめてみました。 Webサイトの見た目をデザインしていくのに欠かせない CSS。度々これってどうやるんだろうとか、どうしてこうなっちゃうの？というものに遭遇します。また、今までは IE6 をターゲットに含めてましたけど、そろそろ IE7 からをターゲットにすればいいのかなーと思うこともあって、過去のスタイルシートの書き方の習慣を変えようかなとも思っています。 スタイルシートを書いていて、今まで遭遇した不具合やその回避方法、また今まではこうしてたけど、これからは変わるかもしれないなーといものをまとめてみました。もうそんなことしてない
IEで指定どおりのfont-sizeにならない | d-spica
IEで指定どおりのfont-sizeにならない 2008-05-18 0 0 XHTML/CSS CSS, font-size IE との兼ね合いで，font-size は%で指定しておくのが，いちばん無難だと思うのですが，IE6, 7 にちょっと痛いバグがありました。 小さなサイズの文字が指定どおりの大きさにならないのです。 11px以下のフォントが指定より大きくなる まず，font-size のページを IE6 または IE7 でご覧ください。 順にフォントサイズが小さくなっていくはずなのですが，74%から72%あたりの日本語のフォントサイズが一旦大きくなっています。その後71%から 60%のところまで，日本語フォントはサイズが変わっていません。 FIrefox の場合と比べると，よく分かるかもしれません。 %で指定された font-size は，最終的にpxに変換され，端数処理して整
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
W3C CSS 検証サービス
http://www.designwalker.com/2010/06/jquery-forms.html
sakurachiro.com
Uka-p.com is for sale | HugeDomains
