- 締切済み
特定の要素だけCSSの継承を一時的に解除する方法はありますか
JavascriptのWYSWYGエディタを使っているのですが、ユーザーが入力するときに、たとえば、<oi>のようなタグを指定すると、入力時には数字付きリストが表示されます。 しかし、保存して、ページに表示する時には、そのページのＣＳＳが適用されてしまい、数字が消えるような指定を行っていた場合に、入力時の見た目を異なる表示がされてしまいます。 ＣＳＳの仕様としてはこれで正しいのですが、 これを、ユーザーが入力した部分だけ、全体のＣＳＳの適用しないようにしたいのです。 ページのタグにすべてclass指定を行えば、classの無いユーザー入力部分は適用外になりますが、サイト全体のベースのスタイルシートが、タグ全体に対する指定を行っているので、修正コストの大きさや修正漏れのリスクを考えると、一部分だけ、タグ全体指定などの継承を解除できれば、それが一番スマートだと考えています。 http://www6.plala.or.jp/go_west/nextcss/ref/basic/how2read.htm 上記のページの"継承"のところで以下の記述があります。 ------------------------------------------------------- CSS2になってから、[inherit] という値が導入されました。この値を使うと、値を継承しないプロパティでも、継承させる事が可能です。また、既に値を指定してしまったプロパティで、継承性を一時的に解除する為にも使えます。 ------------------------------------------------------- この、「継承性を一時的に解除する」ってことが、 おそらく私がやりたいことになると思いますが、 具体的な使い方は分かりませんでした。 やり方をご存知の方、教えていただけると助かります。 また、上記のことは不可能であるということが分かれば、それはそれで助かります。 よろしくお願いいたします。
- みんなの回答 （1）
- 専門家の回答
みんなの回答
関連するQ&A
- 特定範囲内のCSSの継承を断ち切る(解除する)には？
別ページにてTinyMCEというWeb上のWYSIWYGエディタにて作成したHTMLをDBへ登録し それをCSSでデザインされたページ中に読み込み、上位のCSSの継承をさせずに表示させたいのですが 親が読み込んでいるCSSの影響ですべてのタグに影響が出ており困っています。 読み込んだデータの範囲だけCSSの継承をさせないようにする方法はないのでしょうか？ 考えられる方法として、インラインフレームにして埋め込む方法が一番現実的かもしれないと思いますが 他に簡単な方法があればご教授していただけるとありがたいです。 当方環境は以下の通りです サーバー：RedHatLinux + Apache + PostgreSQL PHP4, Smarty... 対象ブラウザ:IE6,7 よろしくお願いします。
- ベストアンサー
- HTML
- CSSでの回り込みの解除について
1つのブロック要素の中でPタグで写真を配置してfloatで回り込ませ、任意のPタグで解除させたい場合、<div class="clear"><hr /></div>と該当のPタグで<p class="clear">するのはどちらがよいのでしょうか？ clearについてのCSS .clear { clear:both; } .clear hr { display:none; }
- ベストアンサー
- HTML
- CSSの反映を解除したいのですが
うまく伝えられるか微妙なんですが、MTを使ってます。すでにCSSでTABLE全体のスタイル設定がされているのですが、その設定を反映させたくないTABLEがあります。それを実行するにはどのようにしたらよいでしょうか。ちなみに何ができないかというと、エントリー内にTABLEを記述し、tr bgcolorで色指定をしているのですが、反映されません。その原因がCSSモジュールのTABLE部分だと思われるのです。何かタグ指定などでCSSが反映されないような手段はありますでしょうか。
- 締切済み
- ブログ
- 特定のページにのみ特定のCSSを適用させる方法
グーグルブログ(blogger)を利用しています。 特定のタグでページをリスト表示した時のみ、特定のCSSを、あらかじめ指定しておいたdiv部にのみ適用させる。といったJavascriptのコードを教えてください。 *ちなみに、タグでページをリスト化したときのURLは以下です。(exampleは例です) http://example.blogspot.com/search/label/example/ どうぞ宜しくお願いいたします。
- 締切済み
- JavaScript
- CSSで「継承しない」という指定はありますか
tableを入れ子にして td {width:200px;} とすると、すべてのtdに適用されますよね。 tdの中の入れ子になっているテーブルでは width指定はしたくない=200pxを継承したくないのです。 width:inherit; という属性はありますが、「継承しない」という値はありませんか？ ちなみに、table>td {width:200px;}はIE非対応なので使用不可です。
- ベストアンサー
- HTML
- 実務でＩＤとclassの使い分け方法
現在ＣＳＳを勉強中です。 classセレクタを使うとＣＳＳの指定が同じタグでもそれぞれ違う デザインが指定できて非常に使えるなぁと思ってます。 例えば、一方のＨ１タグの文字の色を青にしてもう一方のＨ１タグの 色を赤にしたりすることが可能です。 しかし、ＭｄＮを見てみるとよく外部ＣＳＳファイルに「＃○○」、 bodyタグ内にＩＤを指定してデザインを適用する使い方が多くを 占めていました。 このＩＤを使うときは、ページが縦に長いときに印をつけて、ページ内の指定位置へリンクするという使い方だけだと私は思っていました。 classではなくＩＤをよく使う理由はなんなのでしょうか？？ みなさまよろしくお願い申し上げます。
- ベストアンサー
- HTML
- ＣＳＳで特定のテーブルだけに適用する記述をおしえてください。
個人でＨＰをつくっているものなのですが、 外部ＣＳＳファイルに table, td, th { border: 2px red solid; } という記述をすると すべてのページにあるテーブルに適用されてしまいました。 ある箇所のテーブルなど指定するテーブルのみに記述したい場合はどういったタグにしたらよいのでしょうか？ お詳しい方どうぞよろしくお願いいたします。
- ベストアンサー
- HTML
- CSSのfloatの回り込み解除について
現在は、<dt>にfloat:leftを指定して、.clearを作成し、<div class="clear"></div>で解除しています。 ただ最近floatを頻繁に使うようになり、<div class="clear">が多くなってしまいどうにかならないか探しているところです。 私がやりたい事は、<dl>に直接clear属性を付属できないかです。 これができれば、回り込み解除の指定がいらなくなるので、助かるのですが、<dl>に入れると、<dt>のfloatも解除されてしまいます。 下記がサンプルソースです。 CSS： dl {clear:both;} dt {float:left;width:130px;border:solid 1px #CCC;} HTML <dl> <dt>SAMPLE</dt> <dt>SAMPLE</dt> <dt>SAMPLE</dt> </dl> <p>clearを設置しなくても回り込み解除</p> これが理想です。 やはり、clearは別で設置しなければならないんでしょうか？
- ベストアンサー
- HTML
- IEでCSSを動的に切り替える方法
もう３日間悩んでおりまして、糸口がつかめずご質問させていただきました。 何でも結構ですのでアドバイスいただけましたら助かりますm(_ _)m 【やりたいこと】 IEで画面をリロードすることなくCSSを再読込して適用させる。 【試した方法でIE以外では動いたもの】 http://phpspot.org/blog/archives/2009/08/css_91.html http://allabout.co.jp/gm/gc/23930/4/ 【本当にやりたいこと】 AjaxでPOSTして、戻ってきたページ全体のHTMLを使ってページ全体を上書き更新したい。 それはPOSTすることで画面の表示位置をずらしたくないためです。 IE（６，７，８）以外ではうまくいっていそうです。（FF3、Chromeで確認） IEだと、CSSが不完全に適用されているようなくずれた画面になるため ＣＳＳを再読込してリフレッシュできたら、解決すると考えたわけです。 検索していると、IEはCSSの動的切り替えに対応していないような記述もあったり。。 よろしくお願いしますm(_ _)m
- ベストアンサー
- JavaScript
- ＣＳＳレイアウトの中にテーブルのような使い方でＣＳＳを入れ子にする方法で質問です。
テーブルを一切つかわないでサイトを作成したいと思っていて、 現在ＣＳＳで２カラムのレイアウトをしています。 困っているのが、 ページの下部に”前のページ ＨＯＭＥ 後ろのページ” という風に横に３つならべたいと思っています。 テーブルであれば簡単にできることなのですが、 それをＣＳＳでできないかと思っております。 そこで外部ＣＳＳに .table{ width: 10px ; background-color: #ffffff; margin: 5px; border: solid 0px ; padding: 0.5em; } と記述し、ＨＴＭＬ部分に <p><span class="table">前のページ</span> <span class="table">ＨＯＭＥ</span> <span class="table">後ろのページ</span></p> という風に記述してみたのですが、 文字を打っていくとどんどんよこに伸びて、横幅を指定している意味がないような感じです。 私のようなＣＳＳの使い方をしたい場合はどのように記述すればよろしいのでしょうか？
- ベストアンサー
- HTML
