- ベストアンサー
CSSの指定を視覚的に
こんにちは! CSSの変更・追加など、実際のサイトを見ながら作業できるような便利な方法はないでしょうか? 以前、自分のサイトURLを入力すると、各クラス名がブロックで囲われて表示できる便利なサイトを見つけたのですがアドレスが分からず困っています。 ・・・なんだか上手く質問できていないような気がしますので、補足説明要求していただけると幸いです。
- みんなの回答 (2)
- 専門家の回答
質問者が選んだベストアンサー
その他の回答 (1)
- hogemodoki
- ベストアンサー率40% (2/5)
関連するQ&A
- ブラウザがおかしなアドレス指定をします
IEでURLを指定して(どのサイトのURLでも同じ)入力しても、そのアドレスの前にres://C:\WINNT\system32\shdoclc.dll/dnserror.htm#http:// と言うのがついてきて、ページが開けない状態です。 どのような原因で起こって、対処はどうすればよいのか、教えて下さい。 知識が多くないので、具体的な作業方法をお知らせ頂けると幸いです。
- 締切済み
- スパイウェア
- 追加CSSでサイトの編集をしようと思っているのです
追加CSSでサイトの編集をしようと思っているのですが、もともと青だった所を追加CSSを使用して赤に変更した場合、もともと書かれていた赤は無効になって追加CSSが優先されて赤になるのでしょうか?
- ベストアンサー
- CSS
- CSSでの2つの背景画像指定
現在、Wordpressでサイトを運営しています。 既に背景画像を以下の感じで指定しています background:#f0f0f0 url(images/背景画像) repeat; そこで、この背景画像を残した状態で、新たに左側に20px幅程度の画像を 上から下までfixedで付け足したいと考えております。 ところが、現在の背景画像を残したままでどうしても画像の追加が出来ません。 たとえば、上記CSSタグに追加で background: url(images/追加画像) repeat-y fixed left top; を記述しますと、最初の画像が消えてしまいます。 両方の画像を有効にするには、どのような記述にすればよいのか アドバイスを宜しくお願い致します。
- ベストアンサー
- CSS
- cssのクラス名のつけ方について
Sublime Textのプラグインの「Goto-CSS-Declaration」 を使えるよいクラス名のつけ方はないでしょうか? ・クラス名としては良いが、エスケープシーケンスをgotocssが認識しない .u-centering-length\+block { display: block; margin: auto; } ・下記のようなときはどうしますか?180per-remのようにしますか?一見わかりにくくないでしょうか? .u-fz-1dot8rem{ font-size: 1.8rem !important; } ただそうすると、下記とかぶりやすいですよね。180per-remとすれば違うクラス名にできるのでありでしょうか? .u-fz-180per{ font-size: 180% !important; }
- 締切済み
- CSS
- CSSの文字サイズについて
CSSの練習にサイトを作っているのですが、 文字の表示サイズをブラウザ側で変更すると文字が隠れてしまいます。 yahooなどは文字サイズを変更してもブロックも拡大しているようなのですがどうなっているのでしょうか。
- 締切済み
- HTML
- CSSで<table>を横に並べるように指定する方法
今までは、テーブルを入れ子にしてデザインしていたものを できる範囲でCSSに変更したく思っています。 本体が2カラムにしてあるページのメイン部分に、 小さなテーブルが横に4つ、縦に10から50個ほど入っています。 今までは テーブルが4つ入りのテーブルを縦にずらっとならべていました。 ブロック要素であるテーブルをスタイルシートでインライン要素に変える http://himajin.moo.jp/html/table/table3.html 上記サイトさんにあるような方法でやるとしたら 具体的にどのようなCSSを書けばよいのでしょうか? また、他に方法ありましたら宜しくご教授願います。
- 締切済み
- CSS
- CSSの使い方の流儀?
先日業者にホームページの作成を依頼したところ、 子孫セレクタを駆使したCSSを使ったページが できあがってきたのですが・・・ たとえばこんな感じ <div id="header"> <div class="block1"> <span>・・・・・・</span> ・・・・・・・ </div> <span>・・・・・・</span> ・・・・・・・ </div> <div id="contents"> <div class="block2"> <span>・・・・・・</span> ・・・・・・・ </div> <span>・・・・・・</span> ・・・・・・・ </div> これに対して CSSでこんなスタイルが設定されています(セレクタ部のみ抜粋) #header .block1 #header .block1 span #header span #contents .block2 #contents .block2 span #contents span 私だったらわざわざ複雑な子孫セレクタを使わずに、 個々にクラスかIDを設定すると思うのですが・・・ また、ただ画像が貼ってあるだけと思ったら、 CSSでspanの背景画像として貼ってあったり、 ただの仕切り線と思ったら、 やはりdivのボーダーラインを使っていたり・・・ こういう作りって一般的なのでしょうか? あるいは、何か利点があるのでしょうか? ブログのカスタマイズなどだと、元のHTMLを自分で直せない場合が多いので、 こういうコトをすることが良くある、というのはわかるのですが・・・ あまりにHTMLのタグの構造とCSSが密接に絡んでいて、 ほんの一文追加しようとしただけで苦労していまして・・・ なんでこういう書き方なのかな・・・と、 不思議に思っています。。
- 締切済み
- HTML
- HTMLとCSSはどれだけ分離できるのか。
とある本で「HTMLは本来文書構造とその内容のみを記録するもので、視覚的表現を行なうのは好ましくない」とあり、デザインの点についてはCSSに任せるようにとありました。たしかにこれによって文書作成者のデザイナーの仕事に完全に分断できるので便利だとは思うのですが、1つ疑問があります。その2つはどの程度まで分離できるのでしょう? 例えば<b>タグや<font>タグによる文字サイズ・色変更はターゲットを<body>や<p>あるいはそれに設定したクラスにすることによってCSSで代用が可能です。が、例えば「この部分のテキストは色を変えて、他はそのまま」というようにしたい場合、事前にタグやクラスを用意しておかなければなりませんよね?body内にプレーンテキストで書かれたテキストを、途中から部分的に変更を加えたい場合はそのHTMLファイルをいじる必要がありますよね。しかしそれでは役割の分担になっていないのではないでしょうか。 また、テーブルをレイアウトの点で有効ですが、これは逆にCSSでは実現不可能で、HTMLでのみ可能な表現です。これについても仕事の分断になっていないのではないかと思います。 本当にHTMLとCSSの分離によって作業の分断・効率化が図れるのでしょうか?
- 締切済み
- CSS
- 要素にスタイルシートを外部CSSにて指定する方法
外部運営で、間借りしているサイトを使用しています。(主の部分は、運営会社のみが変更可能) 自分でCSSを変更できないので、例えば、テキストリンクにスタイルを適用す場合、直接記述ができるようなのですが、 <a style="color: red; text-decoration: none;" target="_blank" href="url">ABCD</a> これを、直接スタイル記述ではなく、自分のサイトで作った外部CSSにリンクさせ、適用させたいと考えています。 ID name属性 Title属性 content type属性 スタイルシートクラス リンクcharset属性とスタイルシート欄が存在します。(上記の例は、最後のスタイルシートの欄に入れると上記のようなソースになりました。) 上記の中で、何か利用すれば外部CSSのリンクできるのでしょうか。
- ベストアンサー
- HTML
- CSSでクラス名を指定してもうまくいかない
下記URLのサイトを参考にして「Google+1ボタン」を設置しようとしています。 https://developers.google.com/+/web/+1button/?hl=ja とりあえずサイト上には設置できたのですが、今度はこの「Google+1ボタン」を自分が設置したい場所に貼り付けるために、CSSで指定しようと思いました。 ちなみに、取得したコードは以下のようになっています。 <!-- +1 ボタン を表示したい位置に次のタグを貼り付けてください。 --> <div class="g-plusone" data-size="medium"></div> <!-- 最後の +1 ボタン タグの後に次のタグを貼り付けてください。 --> <script type="text/javascript"> window.___gcfg = {lang: 'ja'}; (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/platform.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); </script> コードは上記のようになっています。 class="g-plusone" となっていますので、このままこれをクラス名としてCSSに記述しても適用されません。 そこで、これにさらに<div>タグで囲んで、この<div>にクラスを付ければできると思い <div class=”sample”><div class="g-plusone" data-size="medium"></div></div> として、sampleに対してスタイルを指定してみたところ、うまくできました。 しかし、できればこのようなことはせず、"g-plusone"というクラス名が最初から付いているわけですから、これを利用できないかと考えています。 もし、できるのであれば、そのやり方を教えてください。
- ベストアンサー
- CSS
- パソコンやスマートフォンから急にプリントできなくなった場合、ブラザー製品のMFC-L6900DWをご利用の方は以下の項目を確認しましょう。まずはお使いの環境や接続方法、関連するソフト・アプリの有無を確認します。また、電話回線の種類によってもプリントできない場合があります。それぞれの項目をチェックして適切な解決策を見つけましょう。
- プリントできない問題はパソコンやスマートフォンのOSによっても異なる場合があります。Windows10をお使いの方は特に注意が必要です。また、有線LAN接続を使用している場合は接続が正常かどうかも確認しましょう。さらに、関連するソフトやアプリがインストールされている場合、それらの設定も確認してください。
- 電話回線の種類もプリントできない原因になることがあります。ひかり回線を利用している場合は、接続や設定に問題がないか確認しましょう。アナログ回線やISND回線、IP電話を使用している場合も同様です。適切な回線の設定を行うことでプリントできるようになる可能性があります。
お礼
すばやいご回答ありがとうございます。 感動のあまりお礼が遅くなってしまいました。 インストールしていろいろといじっております。 素晴らしい、の一言に尽きます。